:root{--bg:#0b0f14;--bg-2:#0e131a;--surface:#12171f;--surface-2:#151c26;--border:#232c39;--text:#e8ecf3;--muted:#98a4b7;--brand:#60d2b6;--brand-2:#8fb4ff;--danger:#ff6b6b;--shadow-lg: 0 10px 30px rgba(0,0,0,.45);--shadow-md: 0 6px 22px rgba(0,0,0,.32);--radius-lg:16px;--radius-md:12px;--radius-sm:10px}:root[data-theme=light]{--bg:#f7fafc;--bg-2:#eef3f9;--surface:#ffffff;--surface-2:#f8fbff;--border:#d7e2ef;--text:#0a1328;--muted:#53617d;--brand:#1aa986;--brand-2:#2f6ee2;--danger:#d94848}*{box-sizing:border-box}html,body{height:100%}body{margin:0;background:radial-gradient(900px 600px at 50% -10%,rgba(143,180,255,.08),transparent),linear-gradient(180deg,var(--bg),var(--bg-2));color:var(--text);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}.container{max-width:1080px;margin:0 auto;padding:28px}.nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:10px 16px;margin:-12px -16px 18px;background:linear-gradient(180deg,#151c26b3,#12171f8c);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(120,145,180,.12);border-radius:var(--radius-md);box-shadow:var(--shadow-md)}:root[data-theme=light] .nav{background:#ffffffd9;border-color:#d7e2ef}.brand{font-weight:800;letter-spacing:.3px}a{color:var(--brand-2);text-decoration:none}a:hover{text-decoration:underline}button,.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;cursor:pointer;background:linear-gradient(180deg,#1c2430,#171e29);color:var(--text);padding:10px 14px;border-radius:var(--radius-sm);font-weight:650;border:1px solid var(--border);transition:transform .04s ease,background .2s,border-color .2s,box-shadow .2s}.btn{background:linear-gradient(180deg,var(--brand),#39b69a);color:#061115;border-color:transparent}.btn.secondary{background:linear-gradient(180deg,#1b2430,#151c26);color:var(--text)}:root[data-theme=light] .btn.secondary{background:linear-gradient(180deg,#f4f7fb,#eef3fb);color:var(--text);border:1px solid var(--border)}.btn.small,button.small{padding:8px 12px;font-size:14px}.tbl .btn.small{min-width:100px;text-align:center}.tbl .btn.small.secondary{min-width:86px}.tbl td{vertical-align:middle}button:hover,.btn:hover{transform:translateY(-1px);box-shadow:0 8px 22px #00000059}.btn:hover{filter:saturate(1.05) brightness(1.03)}button:active,.btn:active{transform:translateY(0) scale(.98)}button:focus-visible,.btn:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid color-mix(in oklab,var(--brand),white 15%);outline-offset:2px;border-color:color-mix(in oklab,var(--brand),white 15%)}.hero{display:grid;grid-template-columns:1.2fr .8fr;gap:32px;align-items:center;padding:44px 0}.hero h1{font-size:42px;line-height:1.1;margin:0 0 10px}.hero p{color:var(--muted);font-size:18px}.card{background:linear-gradient(180deg,#ffffff05,#ffffff03),var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-lg)}.tbl{width:100%;border-collapse:collapse}.tbl th,.tbl td{padding:10px;border-bottom:1px solid var(--border);text-align:left;vertical-align:middle}.tbl thead th{font-weight:800;color:var(--muted)}.tbl tr:hover td{background:linear-gradient(180deg,#ffffff08,#ffffff03)}.card.portal{transition:transform .15s ease,box-shadow .2s}.card.portal:hover{transform:translateY(-2px);box-shadow:0 16px 40px #00000080}.signin-card{padding:14px;border-radius:var(--radius-md)}.signin-title{font-weight:700;margin-bottom:6px;color:#d6e0ff;font-size:14px;letter-spacing:.2px}.compact>*+*{margin-top:8px}.stack>*+*{margin-top:10px}.grid{display:grid;gap:16px}.pricing{grid-template-columns:repeat(3,1fr)}.price{font-size:36px;font-weight:800}.grid.portals{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}.portal-header{display:flex;align-items:center;justify-content:space-between;gap:12px}.portal-name{font-weight:800;font-size:16px}.portal-meta{color:var(--muted);font-size:12px;margin-top:2px}.portal-actions{display:flex;gap:8px}.portal-link{margin-top:8px;font-size:13px;color:var(--muted)}.tag{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;font-weight:700}.tag.owner{background:#143a5e;color:#a6d4ff;border:1px solid #205389}.tag.client{background:#2a4a2e;color:#b7f3c8;border:1px solid #3a7a49}.badge-status{display:inline-block;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:800}.status-active{background:#2a4a2e;color:#b7f3c8;border:1px solid #3a7a49}.status-trial{background:#143a5e;color:#a6d4ff;border:1px solid #205389}.status-awaiting_invoice{background:#4a3a1a;color:#ffe0a6;border:1px solid #8a6a2a}.status-past_due{background:#4a1a1a;color:#ffb7b7;border:1px solid #8a2a2a}input,button{font-size:16px}label{display:block;font-size:14px;color:var(--muted);margin:6px 0}input{width:100%;padding:11px 12px;border-radius:10px;border:1px solid var(--border);background:#0f141c;color:var(--text);transition:border-color .2s,background .2s,box-shadow .2s}input:hover{border-color:#2c3646}input:focus{background:#0e141c;border-color:color-mix(in oklab,var(--brand),white 10%)}.tabs{display:grid;grid-template-columns:1fr 1fr;position:relative;margin-bottom:12px;background:linear-gradient(180deg,#111821,#0f141c);border:1px solid var(--border);border-radius:var(--radius-md);overflow:hidden}.tab-btn{all:unset;padding:12px 0;text-align:center;font-weight:750;color:#cfd7e6;cursor:pointer}.tab-btn.active{color:#fff}.tabs .underline{position:absolute;left:0;bottom:0;width:50%;height:2px;background:linear-gradient(90deg,var(--brand),var(--brand-2));transition:transform .25s ease;pointer-events:none;z-index:0}.panes{margin-top:16px;position:relative;z-index:1}.panes .pane{display:block;animation:fade .15s ease}@keyframes fade{0%{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}.pw{display:flex;align-items:center;gap:8px}.pw input{flex:1}.pw-toggle{background:#151e2a;border:1px solid var(--border);color:var(--text);padding:6px 8px;border-radius:8px;cursor:pointer}.toast{position:fixed;right:20px;bottom:20px;background:linear-gradient(180deg,#141b25,#101720);border:1px solid var(--border);color:var(--text);padding:10px 14px;border-radius:var(--radius-sm);box-shadow:var(--shadow-md)}.toast.info{border-color:#2a3649}.toast.error{border-color:var(--danger)}.footer{color:#8d98ab;font-size:13.5px;padding:24px 0;margin-top:48px;border-top:1px solid var(--border)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:50}.modal{width:min(760px,92vw);background:linear-gradient(180deg,#ffffff05,#ffffff03),var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:18px;box-shadow:var(--shadow-lg)}.auth-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;background:radial-gradient(1200px 800px at 50% 20%,rgba(143,180,255,.1),transparent),linear-gradient(180deg,var(--bg),var(--bg-2))}.auth-card{width:min(520px,90vw);background:linear-gradient(180deg,#ffffff05,#ffffff03),var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;box-shadow:var(--shadow-lg)}.container{max-width:1100px;padding-inline:clamp(12px,3.5vw,28px)}.grid.portals{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:clamp(12px,2.5vw,16px)}.portal-header{flex-wrap:wrap}.portal-actions{display:flex;gap:8px;flex-wrap:wrap}.portal-link{overflow-wrap:anywhere}@media (max-width: 900px){.portal-actions .btn{flex:1 0 auto}}@media (max-width: 640px){.portal-actions .btn{flex:1 0 48%}}@media (max-width: 420px){.portal-actions .btn{flex:1 0 100%}}.nav{flex-wrap:wrap;row-gap:10px}@media (max-width: 720px){.nav{padding:10px 12px;margin:-10px -12px 16px}.nav>div:last-child{width:100%;display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-start}.nav .btn.small{flex:1 0 auto}}@media (max-width: 720px){.grid{gap:12px}.hero{grid-template-columns:1fr;padding:28px 0}.hero h1{font-size:clamp(26px,5vw,36px)}.hero p{font-size:16px}.card{padding:16px}}@media (max-width: 900px){form .grid[style*="grid-template-columns:'1fr 1fr'"],form .grid[style*="grid-template-columns:'2fr 1fr 1fr 1fr'"]{grid-template-columns:1fr!important}}@media (max-width: 540px){.card li{align-items:flex-start}.card li span:last-child{display:flex;gap:8px;flex-wrap:wrap}.card li .btn.small{flex:1 0 48%}}@media (max-width: 380px){html{font-size:15px}.btn,button{padding:12px 14px}.btn.small{padding:10px 12px;font-size:15px}}
