:root{--opty-aqua: #49d7dd;--opty: #13c2c9;--opty-deep: #08aeb8;--opty-ink: #18232b;--opty-muted: #5b6b73;--opty-faint: #8a979d;--opty-cream: #fbfcf8;--opty-line: #dfe6e4;--brand: var(--opty);--brand-dark: var(--opty-deep);--grad-brand: linear-gradient(100deg, #49d7dd 0%, #13c2c9 55%, #08aeb8 100%);--grad-page: linear-gradient(165deg, #fbfcf8 0%, #f4faf8 52%, #e9f7f7 100%);--surface: #ffffff;--surface-soft: #f5f8f6;--surface-tint: #e9f7f7;--border: #dfe6e4;--border-soft: #eaf0ee;--text: #18232b;--text-body: #40525a;--text-muted: #5b6b73;--text-faint: #8a979d;--success: #0d9668;--success-soft: #d7f5e9;--danger: #d6453f;--danger-soft: #fdeae7;--warning: #b45309;--warning-soft: #fef1d6;--radius-xl: 22px;--radius-lg: 16px;--radius: 11px;--radius-sm: 8px;--shadow-sm: 0 1px 2px rgba(24, 35, 43, .05), 0 1px 3px rgba(24, 35, 43, .07);--shadow: 0 4px 6px -1px rgba(24, 35, 43, .07), 0 10px 24px -6px rgba(24, 35, 43, .12);--shadow-lg: 0 18px 45px -12px rgba(24, 35, 43, .26);--shadow-brand: 0 8px 20px -6px rgba(8, 174, 184, .42);--font: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-brand: var(--font);--font-accent: "DM Serif Display", "Iowan Old Style", Georgia, "Times New Roman", serif;--mono: "SF Mono", "Cascadia Mono", Consolas, monospace}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:var(--grad-page) fixed;color:var(--text);font-family:var(--font);font-size:15px;line-height:1.6;-webkit-font-smoothing:antialiased}h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.021em;color:var(--text)}p{margin:0}a{color:var(--brand);text-decoration:none;cursor:pointer}a:hover{color:var(--brand-dark)}::selection{background:#bdf0f1}:focus-visible{outline:3px solid rgba(19,194,201,.45);outline-offset:2px}.container{max-width:1140px;margin:0 auto;padding:34px 26px 80px}.container-narrow{max-width:860px}.page-head{display:flex;align-items:flex-end;gap:18px;flex-wrap:wrap;margin-bottom:24px}.page-head h1{font-size:27px}.page-head p{margin-top:5px;color:var(--text-muted);font-size:14.5px}.page-head-actions{margin-left:auto;display:flex;gap:9px}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-xl);box-shadow:var(--shadow);overflow:hidden}.section-title{font-size:17px;margin:30px 0 15px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text-body);font:inherit;font-size:14.5px;font-weight:600;cursor:pointer;white-space:nowrap;transition:transform .12s,box-shadow .15s,background .15s,border-color .15s}.btn:hover:not(:disabled){background:var(--surface-soft);border-color:#cfdcd8;color:var(--text-body)}.btn:active:not(:disabled){transform:translateY(1px)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn-primary{background:var(--grad-brand);border-color:transparent;color:#fff;box-shadow:var(--shadow-brand)}.btn-primary:hover:not(:disabled){filter:brightness(1.07);background:var(--grad-brand);color:#fff}.btn-danger{background:var(--danger);border-color:var(--danger);color:#fff}.btn-danger:hover:not(:disabled){background:#b8352f;border-color:#b8352f;color:#fff}.btn-ghost{border-color:transparent;background:transparent;color:var(--text-muted)}.btn-ghost:hover:not(:disabled){background:var(--surface-tint);color:var(--brand)}.btn-sm{padding:6px 12px;font-size:13.5px;border-radius:var(--radius-sm)}.btn-lg{padding:13px 24px;font-size:15.5px}.btn-block{width:100%}.auth{display:grid;grid-template-columns:42% 58%;min-height:100vh;background:var(--opty-cream);color:var(--opty-ink);font-family:var(--font-brand)}.auth-aside{display:flex;flex-direction:column;justify-content:center;padding:64px clamp(30px,9%,82px);background:linear-gradient(150deg,#57dce1 0%,var(--opty-aqua) 18%,var(--opty) 58%,var(--opty-deep) 100%);background-size:200% 200%;animation:opty-drift 16s ease-in-out infinite alternate;color:#fff;overflow:hidden}.auth-brand{margin-top:7vh}.auth-logo{width:min(100%,440px);color:#fff;animation:opty-rise .85s cubic-bezier(.22,.61,.36,1) both}.auth-tagline{margin-top:28px;font-size:clamp(19px,1.7vw,25px);font-weight:600;letter-spacing:-.015em;color:#fff;animation:opty-rise .85s cubic-bezier(.22,.61,.36,1) .12s both}.auth-tagline-sub{margin-top:9px;font-size:clamp(15px,1.28vw,17.5px);font-weight:400;line-height:1.5;color:#ffffffe6;animation:opty-rise .85s cubic-bezier(.22,.61,.36,1) .26s both}.auth-main{display:flex;align-items:center;justify-content:center;padding:56px clamp(24px,6%,80px);animation:opty-rise 1s cubic-bezier(.22,.61,.36,1) .34s both}.auth-panel{width:100%;max-width:430px}.auth-step{font-size:13.5px;font-weight:700;letter-spacing:.01em;color:var(--opty-deep)}.auth-panel h1{font-family:var(--font-brand);font-size:clamp(30px,3.1vw,40px);font-weight:800;letter-spacing:-.035em;line-height:1.12;color:var(--opty-ink)}.auth-step+h1{margin-top:10px}.auth-panel .sub{margin-top:8px;font-size:15.5px;font-weight:400;color:var(--opty-muted)}.auth-form{display:flex;flex-direction:column;gap:18px;margin-top:30px}.auth-form .field label{font-size:14px;font-weight:600;color:var(--opty-ink)}.auth-form .field input{padding:13px 15px;border:1px solid var(--opty-line);border-radius:10px;background:#fff;font-size:15px;color:var(--opty-ink);transition:border-color .18s ease,box-shadow .18s ease}.auth-form .field input::placeholder{color:#a3b0b5}.auth-form .field input:focus{border-color:var(--opty);box-shadow:0 0 0 4px #13c2c924}.auth-form .field.invalid input{border-color:var(--danger);background:#fff}.auth-form .field.invalid input:focus{box-shadow:0 0 0 4px #dc27431f}.auth-form .field .hint{color:var(--opty-faint)}.auth-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.btn-opty{width:100%;padding:14px 20px;border:none;border-radius:10px;background:linear-gradient(100deg,var(--opty-aqua) 0%,var(--opty) 55%,var(--opty-deep) 100%);color:#fff;font:inherit;font-size:16px;font-weight:700;cursor:pointer;transition:transform .18s ease,filter .18s ease,box-shadow .18s ease}.btn-opty:hover:not(:disabled){transform:translateY(-2px);filter:saturate(1.06) brightness(.95);box-shadow:0 10px 22px -12px #08aeb8cc}.btn-opty:active:not(:disabled){transform:translateY(0)}.btn-opty:disabled{opacity:.6;cursor:not-allowed}.btn-back{align-self:flex-start;padding:0;border:none;background:none;color:var(--opty-muted);font:inherit;font-size:14.5px;font-weight:600;cursor:pointer}.btn-back:hover{color:var(--opty-deep)}.auth-foot{margin-top:22px;font-size:15px;color:var(--opty-muted)}.auth-foot .join{margin-left:4px;font-family:var(--font-accent);font-style:italic;font-size:21px;font-weight:400;color:var(--opty);transition:color .18s ease}.auth-foot .join:hover{color:var(--opty-deep)}.auth .alert{border-radius:10px}@keyframes opty-rise{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}@keyframes opty-drift{0%{background-position:0% 50%}to{background-position:100% 50%}}@media(max-width:900px){.auth{grid-template-columns:1fr}.auth-aside{justify-content:flex-end;padding:54px 32px 44px}.auth-brand{margin-top:0}.auth-logo{width:min(64vw,320px)}.auth-main{padding:44px 26px 64px}}@media(max-width:520px){.auth-row{grid-template-columns:1fr}}.hero{position:relative;padding:40px 42px;margin-bottom:26px;border-radius:var(--radius-xl);background:var(--grad-brand);color:#fff;box-shadow:var(--shadow-lg);overflow:hidden}.hero:after{content:"";position:absolute;width:380px;height:380px;top:-170px;right:-110px;border-radius:50%;background:#ffffff21}.hero>*{position:relative;z-index:1}.hero .eyebrow{font-size:13px;font-weight:650;letter-spacing:.07em;text-transform:uppercase;opacity:.85}.hero h1{color:#fff;font-size:31px;margin:7px 0 9px}.hero p{color:#ffffffe6;font-size:15.5px;max-width:58ch}.hero-actions{display:flex;gap:11px;margin-top:22px;flex-wrap:wrap}.hero .btn{background:#ffffff29;border-color:#ffffff4d;color:#fff;box-shadow:none}.hero .btn:hover:not(:disabled){background:#ffffff42;color:#fff}.hero .btn-solid{background:#fff;color:var(--brand);border-color:#fff}.hero .btn-solid:hover:not(:disabled){background:#effbfb;color:var(--brand)}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:18px;margin-bottom:26px}.stat{display:flex;align-items:center;gap:15px;padding:20px 22px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.stat-ico{display:grid;place-items:center;flex:none;width:46px;height:46px;border-radius:13px;font-size:21px}.stat-ico.i-brand{background:#dff6f7}.stat-ico.i-teal{background:#d5f6f0}.stat-ico.i-amber{background:#fdf0d5}.stat-ico.i-slate{background:#e4ebe9}.stat .value{font-size:25px;font-weight:800;line-height:1.15;letter-spacing:-.03em}.stat .label{font-size:13.5px;color:var(--text-muted)}.tile-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}.tile{display:block;padding:26px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);color:inherit;transition:transform .16s,box-shadow .16s,border-color .16s}.tile:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#cfe4e0;color:inherit}.tile .stat-ico{margin-bottom:15px}.tile h3{font-size:17px;margin-bottom:6px}.tile p{color:var(--text-muted);font-size:14px}.tile .more{display:inline-block;margin-top:13px;color:var(--brand);font-weight:650;font-size:14px}.toolbar{display:flex;align-items:center;gap:11px;flex-wrap:wrap;padding:15px 20px;border-bottom:1px solid var(--border-soft);background:var(--surface-soft)}.toolbar label{font-size:13px;color:var(--text-muted);display:inline-flex;align-items:center;gap:7px}.toolbar select,.toolbar input{padding:7px 11px;border:1px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);color:var(--text);font:inherit;font-size:13.5px}.toolbar .grow{flex:1}.toolbar input[type=search]{min-width:210px}.table-scroll{overflow-x:auto}table{width:100%;border-collapse:collapse;font-size:14.5px}thead th{text-align:left;padding:12px 20px;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);border-bottom:1px solid var(--border);white-space:nowrap}tbody td{padding:14px 20px;border-bottom:1px solid var(--border-soft);vertical-align:middle}tbody tr:last-child td{border-bottom:none}tbody tr:hover{background:var(--surface-tint)}.cell-id{font-family:var(--mono);font-size:12.5px;color:var(--text-faint)}.cell-name{font-weight:650}.cell-sub{color:var(--text-muted);font-size:13px}.cell-actions{text-align:right;white-space:nowrap}.cell-actions .btn+.btn{margin-left:7px}.badge{display:inline-block;padding:3px 11px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.015em}.badge-active{background:var(--success-soft);color:var(--success)}.badge-inactive{background:#edf1ef;color:var(--text-muted)}.badge-suspended{background:var(--danger-soft);color:var(--danger)}.badge-admin{background:#d9f4f5;color:#067179}.badge-user{background:#edf1ef;color:var(--text-muted)}.pager{display:flex;align-items:center;gap:12px;padding:15px 20px;border-top:1px solid var(--border-soft);background:var(--surface-soft);font-size:13.5px;color:var(--text-muted);flex-wrap:wrap}.pager .spacer{flex:1}.form-section{padding:26px 30px;border-bottom:1px solid var(--border-soft)}.form-section:last-of-type{border-bottom:none}.form-section h3{font-size:12px;text-transform:uppercase;letter-spacing:.07em;color:var(--brand);margin-bottom:18px}.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.grid .span-2{grid-column:1 / -1}.field{display:flex;flex-direction:column;gap:7px}.field label{font-size:13.5px;font-weight:650;color:var(--text)}.field .req{color:var(--danger);margin-left:3px}.field input,.field select,.field textarea{width:100%;padding:11px 13px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text);font:inherit;font-size:14.5px;transition:border-color .15s,box-shadow .15s}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 4px #6366f121}.field input:disabled,.field select:disabled{background:var(--surface-soft);color:var(--text-muted)}.field textarea{resize:vertical;min-height:92px}.field .hint{font-size:12.5px;color:var(--text-faint)}.field .error{font-size:12.5px;color:var(--danger);font-weight:550}.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:var(--danger);background:#fffafb}.field.invalid input:focus{box-shadow:0 0 0 4px #dc27431f}.form-footer{display:flex;align-items:center;gap:11px;padding:20px 30px;background:var(--surface-soft);border-top:1px solid var(--border-soft);flex-wrap:wrap}.form-footer .spacer{flex:1}.form-alert{padding:18px 30px 0}.meta-strip{display:flex;flex-wrap:wrap;gap:28px;padding:20px 30px;margin:0;background:linear-gradient(120deg,#f2faf9,#fbfcf8);border-bottom:1px solid var(--border-soft)}.meta-strip div{display:flex;flex-direction:column;gap:2px}.meta-strip dt{margin:0;font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint)}.meta-strip dd{margin:0;font-size:13.5px;font-weight:650;font-family:var(--mono)}.alert{padding:13px 17px;border-radius:var(--radius);font-size:14px;font-weight:550;border:1px solid transparent}.alert-error{background:var(--danger-soft);color:var(--danger);border-color:#f6cdc8}.alert-warning{background:var(--warning-soft);color:var(--warning);border-color:#f3d99a}.alert-success{background:var(--success-soft);color:var(--success);border-color:#a7e6cd}.state{padding:66px 28px;text-align:center;color:var(--text-muted)}.state .big{font-size:42px;margin-bottom:12px}.state h3{font-size:18px;margin-bottom:7px}.state p{margin:0 auto 18px;font-size:14.5px;max-width:48ch}.spinner{width:26px;height:26px;margin:0 auto 14px;border:3px solid #dfe6e4;border-top-color:var(--brand);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;animation-iteration-count:1!important;transition:none!important}}@media(max-width:720px){.grid{grid-template-columns:1fr}.grid .span-2{grid-column:auto}.container{padding:22px 15px 60px}.hero{padding:28px 22px}.form-section{padding:22px 18px}.form-footer{padding:18px}}