/* ==================== v13h ACADEMY ADMIN, BEFORE THE SHARED RULES (were in academy/admin.php) ==================== */ :where(html.pf-adm) .ag-pill,:where(html.pf-adm) #agBig{zoom:calc(1 / var(--tz,1))} @media(max-width:600px){:where(html.pf-adm) .top .tsz{order:3;margin-right:2px} :where(html.pf-adm) .top .admbtn{order:4;margin-left:auto!important} :where(html.pf-adm) .top .av{order:5} :where(html.pf-adm) .brand .bwm{width:88px!important;height:auto!important} :where(html.pf-adm) #skin{display:none!important} :where(html.pf-adm) .tsz button{width:24px;height:24px}} :where(html.pf-adm) .tsz{display:inline-flex;gap:4px;align-items:center;margin-right:6px} :where(html.pf-adm) .tsz button{width:28px;height:28px;border:1px solid var(--line,#33264f);background:var(--card,#1c1430);color:var(--mute,#a99cc8);border-radius:8px;font-weight:600;line-height:1;padding:0;cursor:pointer} :where(html.pf-adm) .tsz button[data-ts=s]{font-size:11px} :where(html.pf-adm) .tsz button[data-ts=m]{font-size:14px} :where(html.pf-adm) .tsz button[data-ts=l]{font-size:17px} :where(html.pf-adm) .tsz button:hover{border-color:#F7931A} html:where(.pf-adm)[data-ts=s] .tsz [data-ts=s],html:where(.pf-adm)[data-ts=m] .tsz [data-ts=m],html:where(.pf-adm)[data-ts=l] .tsz [data-ts=l]{border-color:#F7931A;color:var(--fg,#f3eaff);box-shadow:0 0 0 1px rgba(247,147,26,.35)} html:where(.pf-adm){--bg:#0b0711;--bg2:#100a18;--panel:#130d1d;--card:#1a1228;--card2:#191126;--line:#2a1f3d;--fg:#f3eaff;--mute:#b9addb;--or:#F7931A;--or1:#C34813;--or2:#F7931A;--vi:#A35BFF;--ok:#4CC47F;--bad:#ff7a7a;--inp:#0e0916;--lnk:#d8c2ff; --display:"Poppins","Geist",system-ui,sans-serif;--body:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif;--mono:"Geist Mono",ui-monospace,Consolas,monospace;color-scheme:dark} html:where(.pf-adm)[data-skin="light"]{--bg:#f1f0f4;--bg2:#ffffff;--panel:#ffffff;--card:#ffffff;--card2:#f4f2f8;--line:#e4e2e8;--fg:#16181d;--mute:#66636d;--vi:#7a35e0;--ok:#1d7a44;--bad:#b42318;--inp:#ffffff;--lnk:#7a35e0;color-scheme:light} html:where(.pf-adm),:where(html.pf-adm) *,html:where(.pf-adm)::before,:where(html.pf-adm) *::before,html:where(.pf-adm)::after,:where(html.pf-adm) *::after{box-sizing:border-box} html:where(.pf-adm),:where(html.pf-adm) body{height:100%} :where(html.pf-adm) body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--body);font-size:14px;line-height:1.45;display:flex;flex-direction:column} :where(html.pf-adm) a{color:var(--lnk)} :where(html.pf-adm) button{font:inherit;color:inherit;cursor:pointer} :where(html.pf-adm) .top{position:sticky;top:0;z-index:20;background:var(--bg2);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding:8px max(12px,env(safe-area-inset-right,0px)) 8px max(12px,env(safe-area-inset-left,0px))} :where(html.pf-adm) .brand{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--fg)} :where(html.pf-adm) .brand .bmk{width:34px;height:34px;border-radius:9px} :where(html.pf-adm) .brand .bwm{height:20px;width:auto} :where(html.pf-adm) .brand .bwm.ink{display:none} html:where(.pf-adm)[data-skin="light"] .brand .bwm{display:none} html:where(.pf-adm)[data-skin="light"] .brand .bwm.ink{display:block} :where(html.pf-adm) .brand .bdv{width:1px;height:18px;background:var(--line)} :where(html.pf-adm) .brand .bac{font-family:var(--mono);font-size:10px;letter-spacing:.4em;text-transform:uppercase;color:var(--or2)} :where(html.pf-adm) .hnav{display:flex;gap:4px;margin:0 auto;overflow-x:auto;scrollbar-width:none} :where(html.pf-adm) .hnav a{color:var(--mute);padding:7px 11px;border-radius:9px;font-weight:500;white-space:nowrap;text-decoration:none} :where(html.pf-adm) .hnav a:hover{color:var(--fg)} :where(html.pf-adm) .hdl{display:flex;gap:4px} :where(html.pf-adm) .hlink{color:var(--fg);text-decoration:none;font-size:12.5px;font-weight:600;padding:6px 10px;border-radius:999px} :where(html.pf-adm) .hlink:hover{background:var(--card2)} :where(html.pf-adm) .admbtn{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:999px;font:700 13px var(--body);color:#16101c;background:linear-gradient(90deg,#C34813,#F7931A);text-decoration:none;white-space:nowrap} :where(html.pf-adm) .skin{border:1px solid var(--line);background:var(--card);color:var(--fg);border-radius:999px;padding:5px 10px;font-size:12px;font-weight:600} :where(html.pf-adm) .av{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--vi),var(--or2));display:grid;place-items:center;font-weight:700;font-size:12px;color:#16101c;flex:none;text-decoration:none} :where(html.pf-adm) .burger{display:none;border:1px solid var(--line);background:var(--card);border-radius:9px;padding:6px 9px;color:var(--fg)} :where(html.pf-adm) .shell{flex:1;display:grid;grid-template-columns:250px minmax(0,1fr);min-height:0} :where(html.pf-adm) .side{border-right:1px solid var(--line);background:var(--bg2);overflow-y:auto;padding:18px 10px 30px} :where(html.pf-adm) .side .feedbtn{display:block;width:100%;text-align:left;border-radius:10px;padding:9px 12px;background:#7c3aed;border:1px solid #7c3aed;color:#fff;font-weight:600;margin-bottom:10px;text-decoration:none} :where(html.pf-adm) .side .feedbtn:hover{background:#6d28d9;border-color:#c4a8ff} :where(html.pf-adm) .grp{margin:12px 0 4px;padding:0 8px;font-weight:600;font-size:13px} :where(html.pf-adm) .sp{display:flex;align-items:center;gap:9px;color:var(--mute);padding:7px 8px;border-radius:8px;font-size:13.5px;text-decoration:none} :where(html.pf-adm) .sp:hover{background:var(--card)} :where(html.pf-adm) .sp.on{background:var(--card2);color:var(--fg);font-weight:600} :where(html.pf-adm) .sp svg{width:17px;height:17px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;color:var(--or2)} :where(html.pf-adm) .sp .cnt{margin-left:auto;font-size:11px;border-radius:999px;padding:0 7px;background:#d92d20;color:#fff;font-weight:700} :where(html.pf-adm) .main{overflow-y:auto;padding:18px 18px 60px} :where(html.pf-adm) .mainin{max-width:1180px;margin:0 auto} :where(html.pf-adm) .phd{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:0 0 12px} :where(html.pf-adm) .phd h1{font-family:var(--display);font-size:20px;margin:0;line-height:1.2} :where(html.pf-adm) .phd .asof{font-size:12px;color:var(--mute)} :where(html.pf-adm) .flash{border-left:3px solid var(--ok);background:var(--card);border-radius:10px;padding:8px 12px;margin:0 0 12px;font-size:13px} :where(html.pf-adm) .flash.err{border-left-color:var(--bad)} @media(max-width:1180px){:where(html.pf-adm) .hdl{display:none}} @media (max-width:820px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-adm) .burger{display:inline-block} :where(html.pf-adm) .hnav{display:none} :where(html.pf-adm) .shell{grid-template-columns:minmax(0,1fr)} :where(html.pf-adm) .side{position:fixed;inset:0 auto 0 0;width:min(84vw,300px);z-index:40;transform:translateX(-105%);transition:transform .2s} :where(html.pf-adm) .side.open{transform:none;box-shadow:0 0 0 100vmax rgba(5,3,9,.6)} :where(html.pf-adm) .main{padding:14px 14px 60px}} @media(max-width:560px){:where(html.pf-adm) .brand .bdv,:where(html.pf-adm) .brand .bac{display:none} :where(html.pf-adm) .admbtn{min-height:30px;padding:0 11px;font-size:12px} :where(html.pf-adm) .top{gap:8px}} :where(html.pf-adm) .jfr{display:grid;grid-template-columns:minmax(120px,240px) 1fr 44px 70px;gap:10px;align-items:center;font-size:13px;padding:5px 0;border-bottom:1px solid var(--line)} :where(html.pf-adm) .jfr:last-of-type{border-bottom:0} :where(html.pf-adm) .jfr .jb{height:12px;background:var(--card2);border-radius:6px;overflow:hidden} :where(html.pf-adm) .jfr .jb i{display:block;height:100%;background:linear-gradient(90deg,#4c1d95,#7c3aed)} :where(html.pf-adm) .jfr b{text-align:right} :where(html.pf-adm) .jfr .jp{font-size:12px;color:var(--mute)} :where(html.pf-adm) .jfr.weak .jl{color:var(--bad);font-weight:600} :where(html.pf-adm) .jfr.weak .jb i{background:var(--bad)} :where(html.pf-adm) .jtl div{display:flex;gap:12px;font-size:13px;padding:5px 0;border-top:1px solid var(--line)} :where(html.pf-adm) .jtl span{min-width:120px;color:var(--mute);font-size:12px} :where(html.pf-adm) tr.gen td{background:rgba(242,213,138,.08)} :where(html.pf-adm) tr.gen b{color:#F2D58A} @media(max-width:600px){:where(html.pf-adm) .jfr{grid-template-columns:1fr 40px 60px} :where(html.pf-adm) .jfr .jb{grid-column:1/-1;order:3}} :where(html.pf-adm) .dkbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:0 0 10px} :where(html.pf-adm) .chip{font-size:12.5px;font-weight:500;border:1px solid var(--line);border-radius:10px;padding:6px 12px;color:#c4b8e0;text-decoration:none;background:transparent} :where(html.pf-adm) .chip:hover{border-color:#8b5cf6;color:#f3eaff} :where(html.pf-adm) .chip b{color:#b794ff;margin-left:2px} :where(html.pf-adm) .chip.on{background:#24183a;color:#f3eaff;border-color:#8b5cf6;font-weight:600} :where(html.pf-adm) .chip.on b{color:#f3eaff} :where(html.pf-adm) .dkq{margin:0 0 0 auto!important} :where(html.pf-adm) .dkt tbody tr{cursor:pointer} :where(html.pf-adm) .dkt tbody tr:hover td{background:var(--card2)} :where(html.pf-adm) .dkd{display:inline-block;width:11px;height:11px;border-radius:50%;margin-top:4px} :where(html.pf-adm) .dkd.n{border:1px solid var(--line)} :where(html.pf-adm) .dkh{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px} :where(html.pf-adm) .dkh>div{flex:1} :where(html.pf-adm) .dkhs{font-size:17px!important;letter-spacing:0!important;text-transform:none!important;color:var(--fg)!important;margin:0 0 2px!important} :where(html.pf-adm) .stp{font-size:12px;padding:2px 10px;border-radius:99px;border:1px solid var(--or2);color:var(--or2);white-space:nowrap} :where(html.pf-adm) .dkg{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:12px;align-items:start} :where(html.pf-adm) .dkg>div{display:flex;flex-direction:column;gap:10px;min-width:0} @media(max-width:980px){:where(html.pf-adm) .dkg{grid-template-columns:1fr}} :where(html.pf-adm) .dkm{border:1px solid var(--line);border-radius:12px;padding:10px 12px;background:var(--card)} :where(html.pf-adm) .dkm.us{border-left:3px solid var(--or2);background:var(--card2)} :where(html.pf-adm) .dkm.auto{border-left-color:var(--mute);opacity:.85} :where(html.pf-adm) .prc{border-color:rgba(247,147,26,.45)} :where(html.pf-adm) .prh{display:flex;justify-content:space-between;align-items:baseline;gap:10px} :where(html.pf-adm) .prv{border-top:1px solid var(--line,rgba(255,255,255,.08));padding:12px 0} :where(html.pf-adm) .prvh{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap} :where(html.pf-adm) .prst{font:500 11px/1.6 Geist Mono,ui-monospace,Menlo,monospace;text-transform:uppercase;letter-spacing:.06em;border-radius:999px;padding:1px 9px;border:1px solid currentColor} :where(html.pf-adm) .prst.ok,:where(html.pf-adm) .okc{color:#12b76a} :where(html.pf-adm) .prst.warn,:where(html.pf-adm) .warnc{color:#f79009} :where(html.pf-adm) .prst.bad{color:#d92d20} :where(html.pf-adm) .prst.mute{color:var(--mute)} :where(html.pf-adm) .btn1{min-height:36px;padding:0 14px;font-weight:600;font-size:13px;cursor:pointer;background:#7c3aed;border:1px solid #7c3aed;color:#fff;border-radius:10px} :where(html.pf-adm) .btn1:hover{background:#6d28d9;border-color:#c4a8ff} :where(html.pf-adm) .btn1:disabled{opacity:.6} :where(html.pf-adm) .btn2{display:inline-flex;align-items:center;min-height:36px;border:1px solid var(--line);border-radius:10px;padding:0 14px;color:#f3eaff;text-decoration:none;background:#1b1229;cursor:pointer;font:inherit;font-size:13px;font-weight:600} :where(html.pf-adm) .btn2:hover{border-color:#8b5cf6} :where(html.pf-adm) .pred form{display:grid;gap:10px;margin-top:10px} :where(html.pf-adm) .pred label{display:grid;gap:4px} :where(html.pf-adm) .pred textarea,:where(html.pf-adm) .pred input{width:100%} :where(html.pf-adm) .prsend{display:grid;gap:8px;margin-top:10px;padding:10px;border-radius:10px;background:rgba(247,147,26,.08)} :where(html.pf-adm) .prrep{margin-top:10px;font-size:13.5px} :where(html.pf-adm) .preval{margin-top:10px;padding:10px 12px;border-radius:10px;border:1px dashed var(--line,rgba(255,255,255,.2))} :where(html.pf-adm) .lab2{display:block;font:500 11px Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:#F7931A;margin-bottom:4px} :where(html.pf-adm) .prgo{gap:8px;margin-top:12px} :where(html.pf-adm) .prgo form{margin:0} :where(html.pf-adm) .dkhide{margin-top:6px;text-align:right} :where(html.pf-adm) .dkhide .lnkb{font-size:12px} :where(html.pf-adm) .dkvia{font-size:11px;border-radius:999px;padding:1px 8px;margin-left:8px;background:rgba(163,91,255,.15);color:var(--mute)} :where(html.pf-adm) .dkp summary{cursor:pointer;color:var(--mute)} :where(html.pf-adm) .dkheld{border-left:3px solid #f79009} :where(html.pf-adm) .dkhe{border-top:1px solid var(--line,rgba(255,255,255,.08));padding:10px 0} :where(html.pf-adm) .dkhe .dkmb{margin:6px 0;opacity:.9} :where(html.pf-adm) .dkmh{display:flex;justify-content:space-between;gap:10px;font-size:12px;color:var(--mute);margin-bottom:4px} :where(html.pf-adm) .dkmh b{color:var(--fg)} :where(html.pf-adm) .dkmb{overflow-wrap:anywhere} :where(html.pf-adm) .dkr textarea,:where(html.pf-adm) .dks select,:where(html.pf-adm) .dks input,:where(html.pf-adm) .dkr input{font:inherit;color:var(--fg);background:var(--inp);border:1px solid var(--line);border-radius:8px;padding:8px 10px;width:100%} :where(html.pf-adm) .dkr textarea{margin:6px 0 8px;resize:vertical} :where(html.pf-adm) .dkrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap} :where(html.pf-adm) .dkrow input[name=guide]{flex:1;min-width:160px;width:auto} :where(html.pf-adm) .dkrow label{display:flex;gap:6px;align-items:center} :where(html.pf-adm) .dkrow input[type=checkbox]{width:auto} :where(html.pf-adm) .dks label{display:block;font-size:12px;color:var(--mute);margin:0 0 8px} :where(html.pf-adm) .dks label select,:where(html.pf-adm) .dks label input{margin-top:3px} :where(html.pf-adm) .dkr button,:where(html.pf-adm) .dks button{font:inherit;font-size:13px;font-weight:600;min-height:36px;padding:0 14px;cursor:pointer;background:#7c3aed;border:1px solid #7c3aed;color:#fff;border-radius:10px} :where(html.pf-adm) .dkr button:hover,:where(html.pf-adm) .dks button:hover{background:#6d28d9;border-color:#c4a8ff} :where(html.pf-adm) .dka{display:flex;justify-content:space-between;gap:8px;font-size:12px;padding:5px 0;border-top:1px solid var(--line)} :where(html.pf-adm) .lnkb{background:none;border:0;color:var(--bad);text-decoration:underline;cursor:pointer;font:inherit;font-size:12.5px;padding:0} :where(html.pf-adm) .pill{font-size:12px;border:1px solid var(--line);border-radius:10px;padding:4px 10px;color:#c4b8e0;text-decoration:none} :where(html.pf-adm) a.pill:hover{border-color:#8b5cf6;color:#f3eaff} :where(html.pf-adm) .ptabs{display:flex;gap:6px;overflow-x:auto;padding-bottom:4px;margin-bottom:12px} :where(html.pf-adm) .ptabs a{flex:0 0 auto;text-decoration:none;color:#c4b8e0;background:transparent;border:1px solid var(--line);border-radius:10px;padding:6px 12px;font-weight:500;font-size:13px} :where(html.pf-adm) .ptabs a:hover{border-color:#8b5cf6;color:#f3eaff} :where(html.pf-adm) .ptabs a.on{background:#24183a;color:#f3eaff;border-color:#8b5cf6;font-weight:600} :where(html.pf-adm) .grid{display:grid;gap:10px} :where(html.pf-adm) .k6{grid-template-columns:repeat(6,1fr)} :where(html.pf-adm) .c2{grid-template-columns:1fr 1fr} @media(max-width:900px){:where(html.pf-adm) .k6{grid-template-columns:repeat(3,1fr)} :where(html.pf-adm) .c2{grid-template-columns:1fr}} :where(html.pf-adm) .card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;min-width:0} :where(html.pf-adm) .card h2{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--or);margin:0 0 8px} :where(html.pf-adm) .kpi b{display:block;font-size:22px;line-height:1.1} :where(html.pf-adm) .kpi span{font-size:11px;color:var(--mute)} :where(html.pf-adm) .bar{display:grid;grid-template-columns:130px 1fr 60px;gap:8px;align-items:center;font-size:12.5px;padding:3px 0} :where(html.pf-adm) .bl{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} :where(html.pf-adm) .bt{height:9px;background:var(--card2);border-radius:5px;overflow:hidden} :where(html.pf-adm) .bt i{display:block;height:100%;background:linear-gradient(90deg,#4c1d95,#7c3aed);border-radius:5px} :where(html.pf-adm) .bar b{text-align:right} :where(html.pf-adm) .chart{display:flex;align-items:flex-end;gap:2px;height:110px;margin-top:6px} :where(html.pf-adm) .chart div{flex:1;background:linear-gradient(0deg,#4c1d95,#7c3aed);border-radius:3px 3px 0 0;min-height:2px;position:relative} :where(html.pf-adm) .chart div.z{background:var(--line)} :where(html.pf-adm) .axis{display:flex;justify-content:space-between;font-size:10.5px;color:var(--mute);margin-top:4px} :where(html.pf-adm) table{width:100%;border-collapse:collapse;font-size:12.5px} :where(html.pf-adm) th,:where(html.pf-adm) td{text-align:left;padding:6px 8px;border-bottom:1px solid var(--line);vertical-align:top} :where(html.pf-adm) th{color:var(--mute);font-weight:600;font-size:11px;text-transform:uppercase;letter-spacing:.06em} :where(html.pf-adm) td.n,:where(html.pf-adm) th.n{text-align:right} :where(html.pf-adm) .tw{overflow-x:auto} :where(html.pf-adm) .mute{color:var(--mute)} :where(html.pf-adm) .sm{font-size:12px} :where(html.pf-adm) .ok{color:var(--ok)} :where(html.pf-adm) .bad{color:var(--bad)} :where(html.pf-adm) .tag{display:inline-block;font-size:11px;border-radius:999px;padding:1px 8px;background:rgba(163,91,255,.18)} :where(html.pf-adm) form.f{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:8px} :where(html.pf-adm) form.f input,:where(html.pf-adm) form.f select{font:inherit;color:var(--fg);background:var(--inp);border:1px solid var(--line);border-radius:8px;padding:7px 10px} :where(html.pf-adm) form.f button{font:inherit;font-size:13px;font-weight:600;min-height:36px;padding:0 14px;cursor:pointer;background:#7c3aed;border:1px solid #7c3aed;color:#fff;border-radius:10px} :where(html.pf-adm) form.f button:hover{background:#6d28d9;border-color:#c4a8ff} :where(html.pf-adm) .note{font-size:12px;color:var(--mute);margin:10px 0 0} :where(html.pf-adm) .fch{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin:6px 0 6px;font-weight:600} :where(html.pf-adm) .fcs{display:grid;grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:10px;margin:0 0 12px} :where(html.pf-adm) .fcd{display:block;text-decoration:none;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:14px;padding:12px 14px;min-width:0} :where(html.pf-adm) a.fcd:hover{border-color:#8b5cf6} :where(html.pf-adm) .fcd b{display:block;font-size:24px;line-height:1.1;font-weight:700} :where(html.pf-adm) .fcd span{display:block;font-size:12px;color:var(--mute);margin-top:3px} :where(html.pf-adm) .fcd.on{background:#24183a;border-color:#8b5cf6;box-shadow:none} :where(html.pf-adm) .fcd.warn b{color:var(--or)} :where(html.pf-adm) .fcd.bad b{color:var(--bad)} :where(html.pf-adm) .fcd.good b{color:var(--ok)} :where(html.pf-adm) .card table a{color:inherit;text-decoration:none;font-weight:600} :where(html.pf-adm) .card table tr[onclick]{cursor:pointer} :where(html.pf-adm) .card table tr[onclick]:hover td{background:rgba(163,91,255,.08)} :where(html.pf-adm) .dkt tbody tr:hover td,:where(html.pf-adm) table tbody tr:hover td{background:rgba(163,91,255,.06)} :where(html.pf-adm) .abtn{display:inline-flex;align-items:center;min-height:36px;font:inherit;font-size:13px;font-weight:600;text-decoration:none;padding:0 14px;cursor:pointer;background:#7c3aed;border:1px solid #7c3aed;color:#fff;border-radius:10px} :where(html.pf-adm) .abtn:hover{background:#6d28d9;border-color:#c4a8ff} :where(html.pf-adm) .abtn.gh{background:#1b1229;color:#f3eaff;border:1px solid var(--line)} :where(html.pf-adm) .abtn.gh:hover{background:#1b1229;border-color:#8b5cf6} :where(html.pf-adm) .seg{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px} :where(html.pf-adm) .seg label{position:relative;cursor:pointer;margin:0!important;display:inline-block!important;color:var(--fg)!important} :where(html.pf-adm) .seg input{position:absolute;opacity:0;pointer-events:none} :where(html.pf-adm) .seg span{display:inline-block;border:1px solid var(--line);border-radius:10px;padding:6px 12px;font-size:12.5px;font-weight:500;color:#c4b8e0;background:transparent} :where(html.pf-adm) .seg label:hover span{border-color:#8b5cf6;color:#f3eaff} :where(html.pf-adm) .seg input:checked+span{background:#24183a;color:#f3eaff;border-color:#8b5cf6;font-weight:600} :where(html.pf-adm) .seg input:focus-visible+span{outline:2px solid #8b5cf6;outline-offset:2px} :where(html.pf-adm) .own label{display:grid;gap:4px;font-size:13px;color:var(--mute)} :where(html.pf-adm) .own input{font:inherit;color:var(--fg);background:var(--inp);border:1px solid var(--line);border-radius:10px;padding:10px 12px} :where(html.pf-adm) .own .card{display:grid;gap:10px;margin-bottom:10px} :where(html.pf-adm) .own .card h2{display:flex;gap:8px;align-items:center;flex-wrap:wrap} :where(html.pf-adm) .own .btn{font:inherit;font-size:13px;font-weight:600;min-height:36px;padding:0 14px;cursor:pointer;background:#7c3aed;border:1px solid #7c3aed;color:#fff;border-radius:10px} :where(html.pf-adm) .own .btn:hover{background:#6d28d9;border-color:#c4a8ff} :where(html.pf-adm) .own .gh{background:#1b1229;color:#f3eaff;border:1px solid var(--line)} :where(html.pf-adm) .own .gh:hover{background:#1b1229;border-color:#8b5cf6} :where(html.pf-adm) .own .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center} :where(html.pf-adm) .own .mute{color:var(--mute);font-size:13px} :where(html.pf-adm) .own p{margin:0} :where(html.pf-adm) .own .msg{border-radius:10px;padding:12px 14px;background:rgba(76,196,127,.12);border:1px solid rgba(76,196,127,.4);margin-bottom:10px} :where(html.pf-adm) .own .msg.bad{background:rgba(255,122,122,.1);border-color:rgba(255,122,122,.45)} :where(html.pf-adm) .own .pill{font-size:12px;font-weight:600;border-radius:999px;padding:3px 10px;border:0} :where(html.pf-adm) .own .pill.on{background:rgba(76,196,127,.18);color:var(--ok)} :where(html.pf-adm) .own .pill.off{background:rgba(255,122,122,.15);color:var(--bad)} :where(html.pf-adm) .own .link{font:13px Geist Mono,ui-monospace,Consolas,monospace;word-break:break-all;background:var(--inp);border:1px dashed var(--vi);border-radius:10px;padding:12px} :where(html.pf-adm) .own .log{font:12px Geist Mono,ui-monospace,Consolas,monospace;color:var(--mute);white-space:pre-wrap;word-break:break-all} /* ==================== v13e ACADEMY NEW LOOK (was newlook.css; gated by html.nl, loads before the shared rules as before) ==================== */ html.nl{--nlpan:#140d1f;--nlstage:#05030a;--nlbtn:#1b1229;--nlon:#24183a;--nlline:#2a1f3d;--nlvio:#7c3aed;--nlvio2:#8b5cf6;--nlmut:#a99cc8;--nlfont:Geist,system-ui,-apple-system,"Segoe UI",sans-serif} html.nl[data-skin="light"] .nlpanel{--nlpan:#ffffff;--nlstage:#e9e6f0;--nlbtn:#ffffff;--nlon:#efe6ff;--nlline:#d6cfe3;--nlvio:#6d28d9;--nlvio2:#6d28d9;--nlmut:#4f4860;--mute:#4f4860;--violet:#6d28d9} html.nl *{scrollbar-width:thin;scrollbar-color:#4a3878 transparent} html.nl *::-webkit-scrollbar{width:8px;height:8px} html.nl *::-webkit-scrollbar-track{background:transparent} html.nl *::-webkit-scrollbar-thumb{background:#4a3878;border-radius:999px;border:2px solid transparent;background-clip:padding-box} html.nl *::-webkit-scrollbar-thumb:hover{background:#A35BFF;background-clip:padding-box} html.nl[data-skin="light"] .nlpanel *{scrollbar-color:#b9a6dc transparent} html.nl[data-skin="light"] .nlpanel *::-webkit-scrollbar-thumb{background:#b9a6dc;background-clip:padding-box} .nlsw{font:600 12px Geist,system-ui,sans-serif;border:1px dashed #F7931A;background:transparent;color:#F7931A;border-radius:10px;padding:6px 10px;cursor:pointer;white-space:nowrap} .nlsw:hover{background:rgba(247,147,26,.12)} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl body{height:calc(100vh / var(--tz,1))!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;background:var(--nlstage)!important;background-image:none!important} html.nl .shell{flex:1!important;display:grid!important;grid-template-columns:var(--col-l,340px) minmax(0,1fr) var(--col-r,340px)!important;min-height:0!important;height:auto!important} html.nl .top{position:relative!important;top:0!important;height:59px;box-sizing:border-box;padding:10px 14px!important;gap:10px!important;background:var(--nlpan)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-bottom:1px solid var(--nlline)!important;box-shadow:none!important;flex:none} html.nl .top .burger,html.nl .top .hdl,html.nl .top>.viewas,html.nl .top>.tsz,html.nl .top>.skin,html.nl .top>#admbtn,html.nl .top>#meav,html.nl .cfab,html.nl #agPill{display:none!important} html.nl .brand{gap:12px!important;flex:none!important} html.nl .brand .bmk{display:none!important} html.nl .brand .bwm{height:19px!important;width:auto!important} html.nl .brand .bdv{display:block!important;width:1px!important;height:24px!important;background:var(--nlline)!important;margin:0!important} html.nl .brand .bac{font:600 17px Poppins,Geist,system-ui,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--fg)!important} html.nl .tabs{position:absolute!important;left:50%;top:50%;transform:translate(-50%,-50%);margin:0!important;gap:4px!important;overflow:visible!important} html.nl .tabs button{text-transform:uppercase!important;letter-spacing:.06em!important;font:600 12px Geist,system-ui,sans-serif!important;padding:6px 12px!important;border-radius:10px!important;border:1px solid var(--nlline)!important;background:var(--nlbtn)!important;color:var(--nlmut)!important;transition:border-color .2s,color .2s} html.nl .tabs button:hover{color:var(--fg)!important;border-color:var(--nlvio2)!important} html.nl .tabs button.on,html.nl .tabs button[aria-current],html.nl .tabs button.act{color:var(--fg)!important;border-color:var(--nlvio2)!important;background:var(--nlon)!important} html.nl .nlacts{margin-left:auto;display:flex;align-items:center;gap:6px;flex-wrap:nowrap} html.nl .nlacts .tsz{margin:0 4px 0 0!important} html.nl .nlacts .tsz button{width:28px;height:28px;background:var(--nlbtn);border-color:var(--nlline)} html.nl .nlacts .nlb,html.nl .nlacts .skin{font:500 14px Geist,system-ui,sans-serif;color:var(--fg);background:var(--nlbtn);border:1px solid var(--nlline);border-radius:10px;padding:6px 12px;height:33px;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;text-decoration:none;white-space:nowrap;cursor:pointer;transition:border-color .2s} html.nl .nlacts .nlb:hover,html.nl .nlacts .skin:hover{border-color:var(--nlvio2)} html.nl .nlacts a.nlb.out::after{content:"";display:inline-block;width:.62em;height:.62em;background:currentColor;opacity:.75;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5l5-5M3.5 2.5h4v4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5l5-5M3.5 2.5h4v4'/%3E%3C/svg%3E") center/contain no-repeat} html.nl .nlacts #admbtn{display:inline-flex!important;align-items:center;height:33px;box-sizing:border-box;padding:6px 12px!important;border-radius:10px!important;background:#F7931A!important;background-image:none!important;border:1px solid #F7931A!important;color:#000!important;font:600 14px Geist,system-ui,sans-serif!important;box-shadow:none!important;text-decoration:none} html.nl .nlacts #admbtn:hover{background:#ffa53d!important;border-color:#ffa53d!important} html.nl .side{position:static!important;transform:none!important;width:auto!important;background:var(--nlpan)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-right:1px solid var(--nlline)!important;padding:12px 11px 30px!important;overflow-y:auto!important;min-height:0} html.nl .side .feedbtn{background:var(--nlvio)!important;background-image:none!important;color:#fff!important;border:1px solid var(--nlvio)!important;text-align:center!important;font:600 14px Geist,system-ui,sans-serif!important;padding:9px 12px!important;border-radius:10px!important;margin:0 0 6px!important} html.nl .side .feedbtn:hover{background:#8b5cf6!important;border-color:#c4a8ff!important} html.nl .side .feedbtn.on{box-shadow:0 0 0 2px var(--nlpan),0 0 0 3px #c4a8ff} html.nl .side .grp{font:600 13px Geist,system-ui,sans-serif!important;color:var(--fg)!important;padding:16px 0 6px!important;margin:6px -11px 0!important;padding-left:11px!important;padding-right:11px!important;border-top:1px solid var(--nlline);letter-spacing:0!important;text-transform:none!important} html.nl .side .grp:first-of-type{border-top:0;margin-top:0!important} html.nl .side .sp{color:var(--nlmut)!important;font-size:13.5px!important;border:1px solid transparent!important;border-radius:10px!important;padding:6px 9px!important;transition:border-color .2s,color .2s} html.nl .side .sp:hover{color:var(--fg)!important;border-color:var(--nlline)!important;background:transparent!important} html.nl .side .sp.on,html.nl .side .sp.act,html.nl .side .sp[aria-current]{color:var(--fg)!important;border-color:var(--nlvio2)!important;background:var(--nlon)!important} html.nl .side .sp.nltool{border-color:var(--nlline)!important;background:var(--nlbtn)!important;color:var(--fg)!important;margin:0 0 6px!important;padding:8px 12px!important} html.nl .side .sp.nltool .dot{display:none!important} html.nl .side .sp.nltool:hover{border-color:var(--nlvio2)!important} html.nl .main{position:relative;overflow:hidden!important;padding:12px!important;background:var(--nlstage)!important;min-height:0;display:flex;flex-direction:column} html.nl .nlpanel{flex:1;min-height:0;display:flex;flex-direction:column;border:1px solid var(--nlline);border-radius:12px;overflow:hidden;background:var(--bg);transition:margin-right .3s cubic-bezier(.2,.8,.2,1)} html.nl .nlbar{flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;box-sizing:border-box;padding:10px 14px 10px 22px;background:var(--nlpan);border-bottom:1px solid var(--nlline)} html.nl .nlbar .nlt{font:500 13px Geist,system-ui,sans-serif;color:var(--nlmut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} html.nl .nlbar .nlbb{display:flex;align-items:center;gap:6px;flex-wrap:nowrap} html.nl .nlbar .hlink,html.nl .nlbar .nlbtn,html.nl .nlbar .skin{font:500 13px Geist,system-ui,sans-serif!important;color:var(--fg)!important;background:var(--nlbtn)!important;border:1px solid var(--nlline)!important;border-radius:10px!important;padding:6px 10px!important;cursor:pointer;white-space:nowrap} html.nl .nlbar .hlink:hover,html.nl .nlbar .nlbtn:hover,html.nl .nlbar .skin:hover{border-color:var(--nlvio2)!important} html.nl .nlbar .viewas{display:inline-flex!important;align-items:center;gap:8px;font:500 13px Geist,system-ui,sans-serif;color:var(--nlmut)} html.nl .nlbar .viewas select{font:500 13px Geist,system-ui,sans-serif;color:var(--fg);background:var(--nlbtn);border:1px solid var(--nlline);border-radius:10px;padding:6px 8px} html.nl .nlscroll{flex:1;min-height:0;overflow-y:auto;padding:22px 22px 60px} html.nl .nlscroll .cols{display:block!important;max-width:1180px;margin:0 auto!important;padding-bottom:40px!important} html.nl .nlscroll #center{min-width:0} html.nl .nlright{background:var(--nlpan);border-left:1px solid var(--nlline);display:flex;flex-direction:column;min-height:0;overflow:hidden} html.nl .nltabs{flex:none;display:flex;gap:6px;padding:10px 10px 0;border-bottom:1px solid var(--nlline);padding-bottom:10px} html.nl .nltabs button{flex:1;font:500 14px Geist,system-ui,sans-serif;color:var(--fg);background:var(--nlbtn);border:1px solid var(--nlline);border-radius:10px;padding:7px 10px;cursor:pointer;transition:border-color .2s} html.nl .nltabs button:hover{border-color:var(--nlvio2)} html.nl .nltabs button.on{border-color:var(--nlvio2);background:var(--nlon)} html.nl .nlright #agPanel.nldock{position:relative!important;inset:auto!important;right:auto!important;bottom:auto!important;width:auto!important;height:auto!important;flex:1;min-height:0;opacity:1!important;transform:none!important;clip-path:none!important;pointer-events:auto!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;zoom:1!important;transition:none!important} html.nl .nlright #agPanel.nldock #agEnd,html.nl .nlright #agPanel.nldock .ag-wm{display:none!important} html.nl .nlright #agPanel.nldock{display:flex!important;flex-direction:column!important} html.nl .nlright #agPanel.nldock .ag-head{order:0;height:auto!important;padding:12px 10px 0 16px!important;background:transparent!important;border:0!important} html.nl .nlright #agPanel.nldock .ag-orbwrap{display:contents!important} html.nl .nlright #agPanel.nldock #agBig{order:1;align-self:center;margin-top:18px} html.nl .nlright #agPanel.nldock .ahi{order:2;display:block;text-align:center;margin:10px 16px 0;font:600 19px Poppins,Geist,system-ui,sans-serif;color:var(--fg)} html.nl .nlright #agPanel.nldock .ag-state{order:2;text-align:center;margin:10px 16px 0;color:var(--nlmut)!important;font-weight:400!important} html.nl .nlright #agPanel.nldock .ag-gauge{order:3;align-self:center} html.nl .nlright #agPanel.nldock .ag-log{order:4;flex:1;min-height:0;padding:18px 14px 10px!important} html.nl .nlright #agPanel.nldock .ag-chips{order:5;justify-content:flex-start!important;gap:6px!important;margin:0!important;padding:0 12px 10px!important} html.nl .nlright #agPanel.nldock .ag-chip{min-height:28px!important;padding:3px 10px!important;font-size:12.5px!important;border-radius:999px!important;border:1px solid var(--nlline)!important;background:var(--nlbtn)!important;color:var(--fg)!important} html.nl .nlright #agPanel.nldock .ag-chip:hover{border-color:var(--nlvio2)!important} html.nl .nlright #agPanel.nldock .ag-foot{order:6;flex-wrap:wrap!important;gap:8px!important;padding:0 12px 12px!important} html.nl .nlright #agPanel.nldock .ag-foot textarea{order:-1;flex:1 1 100%!important;min-height:72px!important;border-radius:10px!important;border:1px solid var(--nlline)!important;font-size:14px!important} html.nl .nlright #agPanel.nldock .ag-mic{min-height:36px!important;padding:0 14px 0 11px!important;font-size:14px!important;border-radius:10px!important;animation:none!important;box-shadow:none!important;background:var(--nlbtn)!important;color:var(--fg)!important;border:1px solid var(--nlline)!important} html.nl .nlright #agPanel.nldock .ag-mic svg{width:16px;height:16px} html.nl .nlright #agPanel.nldock .ag-send{min-height:36px!important;border-radius:10px!important;margin-left:auto} html.nl .nlright #agPanel.nldock button.ag-send[type=submit]{background:var(--nlvio)!important;border-color:var(--nlvio)!important;color:#fff!important;font-weight:600!important;padding:0 16px!important} html.nl .nlright #agPanel.nldock .ag-name{font-size:14px} html.nl .nlover{position:absolute;top:12px;right:12px;bottom:12px;width:380px;max-width:calc(100% - 24px);z-index:6;display:flex;flex-direction:column;background:var(--nlpan);border:1px solid var(--nlline);border-radius:12px;box-shadow:-24px 0 48px rgba(0,0,0,.45);animation:nlin .32s cubic-bezier(.2,.8,.2,1)} html.nl .nlover[hidden]{display:none} @keyframes nlin{from{transform:translateX(30px);opacity:0}to{transform:none;opacity:1}} html.nl .nloh{flex:none;display:flex;align-items:center;gap:8px;padding:12px 12px 12px 18px;border-bottom:1px solid var(--nlline)} html.nl .nloh b{flex:1;font:700 16px Poppins,Geist,system-ui,sans-serif;color:var(--fg)} html.nl .nloh button{font:500 13px Geist,system-ui,sans-serif;color:var(--fg);background:var(--nlbtn);border:1px solid var(--nlline);border-radius:10px;padding:6px 10px;cursor:pointer;display:inline-flex;align-items:center;gap:6px} html.nl .nloh button:hover{border-color:var(--nlvio2)} html.nl .nloh button.on{border-color:#F7931A;color:#F7931A} html.nl .nlob{flex:1;min-height:0;overflow-y:auto;padding:14px} html.nl .nlob #right{display:flex!important;flex-direction:column;gap:12px} html.nl .main.nlpinned .nlover{box-shadow:none;animation:none} html.nl .main.nlpinned .nlpanel{margin-right:392px}} @media (min-width:861px) and (max-width:1100px) and (hover:hover){html.nl .shell{grid-template-columns:var(--col-lm,300px) minmax(0,1fr) var(--col-rm,300px)!important} html.nl .nlacts a.nlb.out::after{display:none} html.nl .main.nlpinned .nlpanel{margin-right:0} html.nl .main.nlpinned .nlover{box-shadow:-24px 0 48px rgba(0,0,0,.45)}} @media (min-width:861px) and (max-width:1300px) and (hover:hover){html.nl .nlacts .nlb,html.nl .nlacts .skin,html.nl .nlacts #admbtn{padding:6px 8px!important;font-size:12px!important} html.nl .tabs button{padding:6px 9px!important}} @media (min-width:861px) and (max-width:1279px) and (hover:hover){html.nl .nlacts .tsz{display:none!important}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.nl .brand .bmk{display:none!important} html.nl .brand .bdv{display:block!important;width:1px;height:20px;background:var(--line)} html.nl .brand .bac{font:600 16px Poppins,Geist,system-ui,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:var(--fg)!important} html.nl .nlacts,html.nl .nltabs,html.nl .nlover .nloh,html.nl .nlbar{display:none!important} html.nl .nlright,html.nl .nlpanel,html.nl .nlscroll,html.nl .nlover,html.nl .nlob{display:contents!important}} html.nl[data-skin="light"] .lnk,html.nl[data-skin="light"] a.lnk,html.nl[data-skin="light"] button.lnk{color:#6d28d9!important} html.nl[data-skin="light"] .dkb,html.nl[data-skin="light"] .osn{color:#b45309!important} html.nl[data-skin="light"] .pintag{color:#7a3a00!important;background:#ffe9cc!important;border-color:#f0b46a!important} html.nl[data-skin="light"] .lbn{color:#4f4860!important} html.nl .btn:not(.gh){color:#16101c} html.nl[data-skin="light"] .lbt{background:#ffffff!important} html.nl .nlbar .viewas span{white-space:nowrap} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.nl .top .tsz{display:none!important} html.nl .brand .bac{display:inline!important;font-size:15px!important} html.nl .brand .bwm{height:15px!important;width:auto!important} html.nl .brand{gap:9px!important}} html.nl{--or1:#dd6a1d} html.nl[data-skin="light"] .nlsw{color:#9a4d00;border-color:#c26a00} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .top,html.nl .top button,html.nl .top a,html.nl .side,html.nl .side button,html.nl .side a,html.nl .nlbar,html.nl .nlbar button,html.nl .nlbar select,html.nl .nltabs button,html.nl .nloh button{font-family:var(--nlfont)!important} html.nl .tabs button{font-family:var(--nlfont)!important;line-height:1.45!important;font-weight:600!important} html.nl .nlacts .nlb,html.nl .nlacts #admbtn{height:auto!important;line-height:1.45!important;padding:8px 12px!important;font-weight:400!important;font-size:14px!important} html.nl .nlacts #admbtn{font-weight:600!important} html.nl .nlacts .tsz button{width:26px!important;height:26px!important;border-radius:8px!important;color:var(--nlmut)!important;font-family:var(--nlfont)!important} html.nl .side .sp{font-size:14px!important} html.nl .side .feedbtn{font-family:var(--nlfont)!important;line-height:1.45!important;padding:8px 12px!important} html.nl .nltabs button{line-height:1.45;padding:7px 10px} html.nl .nlbar .hlink,html.nl .nlbar .nlbtn,html.nl .nlbar .skin{font-size:14px!important;font-weight:400!important;padding:8px 12px!important;line-height:1.45!important} html.nl .nlbar .viewas,html.nl .nlbar .viewas select{font-size:14px!important;font-weight:400!important} html.nl .nlbar .nlt{font-size:14px;font-weight:400}} html.nl .brand .nlico{height:35px;width:35px;flex:none;display:block} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.nl .brand .nlico{height:31px;width:31px}} html.nl #agSettings #agSDone,html.nl #agConsent .ag-acts button,html.nl .ag-sheet .ag-acts button{border-radius:10px!important} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .main.nlpinned .nlbar .nlt{display:block!important} html.nl .nlbar .nlbb{flex:none;margin-left:auto} html.nl .main.nlpinned .nlbar .viewas>span{display:none}} @media (min-width:861px) and (max-width:1180px) and (hover:hover){html.nl .nlbar .nlt{display:block!important} html.nl .nlbar .viewas>span{display:none}} html.nl .nlacts #admbtn{font-family:var(--nlfont)!important} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .top .nlacts .tsz button{width:26px!important;height:26px!important;min-width:26px!important}} html.nl .nlright #agPanel.nldock .ag-mic svg{display:none!important} html.nl .nlright #agPanel.nldock .ag-mic{padding:0 14px!important;font:500 14px var(--nlfont)!important;height:36px;min-height:36px!important} html.nl .nlright #agPanel.nldock .ag-foot textarea{font:300 14px Geist,"Segoe UI",system-ui,sans-serif!important;min-height:72px!important;padding:10px 12px!important;background:var(--nlbtn)!important} html.nl .nlright #agPanel.nldock button.ag-send[type=submit]{font:600 14px var(--nlfont)!important;height:36px} html.nl .nlright #agPanel.nldock .ag-chips{padding:0 12px 10px!important} html.nl .nlright #agPanel.nldock .ag-chip{font-family:var(--nlfont)!important;font-size:12.5px!important} html.nl .nlright #agPanel.nldock .nlmeta{font:400 12px var(--nlfont);color:var(--nlmut);align-self:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:1} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlbar .nlt{flex:none;max-width:40%} html.nl .nlbar .nlbb{min-width:0;overflow-x:auto;scrollbar-width:none} html.nl .nlbar .nlbb::-webkit-scrollbar{display:none} html.nl .main.nlpinned .nlbar{padding-left:16px} html.nl .main.nlpinned .nlbar .viewas select{max-width:140px}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .side{padding:0!important} html.nl .side .nlpnl{padding:12px;border-bottom:1px solid var(--nlline)} html.nl .side .nlpnl .feedbtn{margin:0!important;width:100%!important;display:block} html.nl .side .nlpnl .grp.nlph{font:700 14px var(--nlfont)!important;color:var(--fg)!important;margin:0 0 8px!important;padding:0!important;border:0!important;letter-spacing:0!important;text-transform:none!important} html.nl .side .nlpnl .sp{font:400 14px var(--nlfont)!important;color:var(--fg)!important;padding:7px 8px!important;margin:0!important;line-height:1.45!important} html.nl .side .nlpnl .sp .nm{color:inherit!important;font:inherit!important} html.nl .side .nlpnl .sp.nltool{padding:8px 12px!important;margin:6px 0 0!important} html.nl .side .nlpnl .grp.nlph+.sp.nltool{margin-top:0!important}} html.nl .nlacts>span[class^="nlslot"]{display:none!important} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlpanel{background:#140d1f;box-shadow:0 0 0 1px var(--nlline)} html.nl .nlscroll{background:radial-gradient(900px 500px at 80% 0,rgba(139,92,246,.14),transparent 70%)} html.nl[data-skin="light"] .nlpanel{background:#ffffff;box-shadow:0 0 0 1px var(--nlline)} html.nl[data-skin="light"] .nlscroll{background:radial-gradient(900px 500px at 80% 0,rgba(124,58,237,.07),transparent 70%)} html.nl .top .nlacts .tsz{gap:4px!important;margin:0 4px 0 0!important} html.nl .top .nlacts .tsz button{width:28px!important;height:28px!important;min-width:28px!important;box-sizing:border-box!important;padding:0!important;line-height:1!important;border:1px solid var(--nlline)!important;background:var(--nlbtn)!important;color:var(--nlmut)!important;border-radius:8px!important;font-weight:600!important;box-shadow:none!important} html.nl .top .nlacts .tsz button:hover{border-color:#F7931A!important} html.nl[data-ts="s"] .top .nlacts .tsz [data-ts="s"],html.nl[data-ts="m"] .top .nlacts .tsz [data-ts="m"],html.nl[data-ts="l"] .top .nlacts .tsz [data-ts="l"]{border-color:#F7931A!important;color:var(--fg)!important;box-shadow:0 0 0 1px rgba(247,147,26,.35)!important}} html.nl .nlright #agPanel.nldock .ag-tb{font:500 13px Geist,"Segoe UI",system-ui,sans-serif!important;letter-spacing:0!important} html.nl .nlright #agPanel.nldock #agSet{padding:0!important;width:38px} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .top{height:auto!important;min-height:0!important;max-height:none!important}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlright #agPanel.nldock #agBig{width:249.4px!important;height:249.4px!important;max-width:130%!important;zoom:1!important;margin-top:13.7px!important}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlright #agPanel.nldock #agBig{margin-bottom:-6.88px!important} html.nl .nlright #agPanel.nldock .ahi{margin:8px 16px 0!important;line-height:normal} html.nl .nlright #agPanel.nldock .ag-state{margin:2px 16px 0!important;font-size:13px!important;min-height:20px}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlright,html.nl .side{font-size:14px!important;line-height:1.45!important} html.nl .nltabs button{font-weight:400!important;padding:7px!important} html.nl .nlright #agPanel.nldock{padding:12px 14px 14px!important;gap:10px!important;font:400 14px/1.45 Geist,"Segoe UI",system-ui,sans-serif!important;box-sizing:border-box} html.nl .nlright #agPanel.nldock>*{order:0!important} html.nl .nlright #agPanel.nldock .ag-head{padding:0!important;margin:0!important;height:auto!important;min-height:0!important;display:flex!important;align-items:center!important;justify-content:space-between!important} html.nl .nlright #agPanel.nldock .ag-head .ag-name{margin:0!important;padding:0!important} html.nl .nlright #agPanel.nldock #agSet svg{width:18px!important;height:18px!important} html.nl .nlright #agPanel.nldock .ag-tb{line-height:1.45!important} html.nl .nlright #agPanel.nldock .ag-orbwrap{display:flex!important;flex-direction:column!important;align-items:center!important;text-align:center!important;padding:14px 0 0!important;margin:0!important;flex:none!important} html.nl .nlright #agPanel.nldock #agBig{margin:-10.32px 0 -6.88px!important;align-self:center!important} html.nl .nlright #agPanel.nldock .ahi{margin:8px 0 0!important;display:block!important;font:600 19px Poppins,Geist,system-ui,sans-serif!important;line-height:normal!important} html.nl .nlright #agPanel.nldock .ag-state{margin:2px 0 0!important;font:300 13px Geist,"Segoe UI",system-ui,sans-serif!important;color:#a99bbd!important;min-height:20px;line-height:1.45!important} html.nl .nlright #agPanel.nldock .ag-log{flex:1 1 auto!important;min-height:0!important;padding:18px 4px 8px!important;gap:12px!important;margin:0!important} html.nl .nlright #agPanel.nldock .ag-chips{display:flex!important;flex-wrap:wrap!important;justify-content:flex-start!important;gap:6px!important;padding:0!important;margin:0!important;flex:none!important} html.nl .nlright #agPanel.nldock .ag-chip{font:400 12px/1.35 Geist,"Segoe UI",system-ui,sans-serif!important;padding:5px 9px!important;min-height:0!important;border-radius:999px!important;border:1px solid #2a1f3d!important;background:#1b1229!important;color:#f3eaff!important} html.nl .nlright #agPanel.nldock .ag-foot{display:block!important;padding:0!important;margin:0!important;flex:none!important} html.nl .nlright #agPanel.nldock .ag-foot textarea{display:block!important;width:100%!important;box-sizing:border-box!important;height:78px!important;min-height:78px!important;max-height:78px!important;padding:8px 10px!important;font:300 14px/1.4 Geist,"Segoe UI",system-ui,sans-serif!important;border:1px solid #2a1f3d!important;border-radius:10px!important;background:#0f0a18!important;color:#f3eaff!important;resize:none} html.nl .nlright #agPanel.nldock .nlaskb{display:flex!important;align-items:center!important;gap:8px!important;margin-top:6px!important} html.nl .nlright #agPanel.nldock .ag-mic{height:auto!important;min-height:0!important;padding:8px 12px!important;font:400 14px/1.45 Geist,"Segoe UI",system-ui,sans-serif!important;border:1px solid #2a1f3d!important;border-radius:10px!important;background:#1b1229!important;color:#f3eaff!important;margin:0!important} html.nl .nlright #agPanel.nldock .nlmeta{flex:1!important;font:300 12px/1.45 Geist,"Segoe UI",system-ui,sans-serif!important;color:#a99cc8!important} html.nl .nlright #agPanel.nldock button.ag-send[type=submit]{height:auto!important;min-height:0!important;padding:8px 14px!important;font:600 14px/1.45 Geist,"Segoe UI",system-ui,sans-serif!important;margin:0!important;border-radius:10px!important} html.nl .nlright #agPanel.nldock .ag-endbtn{height:auto!important;min-height:0!important;padding:8px 12px!important} html.nl .side .nlpnl .grp.nlph{line-height:1.45!important} html.nl .nlscroll{padding:0!important;scrollbar-gutter:stable both-edges} html.nl .nlscroll>.nlbar{position:sticky;top:0;z-index:5;padding:10px 22px!important} html.nl .nlscroll>.cols{padding:22px 22px 60px!important}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlright #agPanel.nldock #agSet{width:38px!important;box-sizing:border-box!important;padding:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important} html.nl .nlbar{font-size:14px!important;line-height:1.45!important}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .top:not(.nltop):has(.top-in){display:none!important} html.nl .bg{display:none!important} html.nl .nltop{display:flex;align-items:center;flex:none;z-index:30} html.nl .nltop .brand{display:flex;align-items:center;text-decoration:none} html.nl .nltop .bwm.ink{display:none!important} html.nl .nltop .tabs{display:flex} html.nl body:has(.nltop) .shell{max-width:none!important;margin:0!important;gap:0!important;padding:0!important;position:static!important} html.nl body:has(.nltop) .side{position:static!important;top:auto!important;max-height:none!important;align-self:stretch!important;display:block!important;padding:12px!important;overflow-y:auto!important;background:var(--nlpan)!important;border-right:1px solid var(--nlline)!important} html.nl body:has(.nltop) .side>*{margin-bottom:10px} html.nl body:has(.nltop) .stage{max-width:1180px!important;margin:0 auto!important;padding:22px 22px 40px!important;box-sizing:border-box} html.nl body:has(.nltop) .rail{position:static!important;flex:none;background:var(--nlpan)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border-top:1px solid var(--nlline)!important;padding:10px 22px!important} html.nl body:has(.nltop) .nlpanel{display:flex;flex-direction:column} html.nl .nlbar .exit,html.nl .nlbar #spl,html.nl .nlbar #ezr{font:400 14px/1.45 var(--nlfont)!important;color:var(--fg)!important;background:var(--nlbtn)!important;border:1px solid var(--nlline)!important;border-radius:10px!important;padding:8px 12px!important;cursor:pointer;white-space:nowrap;height:auto!important;min-height:0!important} html.nl .nlbar .exit:hover,html.nl .nlbar #spl:hover,html.nl .nlbar #ezr:hover{border-color:var(--nlvio2)!important} html.nl .nlbar .exit.nlclose{background:#F7931A!important;border-color:#F7931A!important;color:#000!important;font-weight:600!important} html.nl .nlbar .exit.nlclose:hover{background:#ffa53d!important;border-color:#ffa53d!important} html.nl #ownFill{top:auto!important;bottom:84px!important} html.nl .nlkey{position:static!important;opacity:1!important;margin-top:14px;font:12px/1.4 Geist Mono,ui-monospace,monospace!important;color:var(--nlmut)!important} html.nl .nlovp .prog{display:block!important;width:auto!important} html.nl .nlovp .prog .pl{display:flex;justify-content:space-between;font:600 12px var(--nlfont);color:var(--fg);margin-bottom:8px} html.nl .nlovp .prog .pb{height:8px;border-radius:99px;background:#2a1f3d;overflow:hidden} html.nl .nlovp .prog .pb b{display:block;height:100%;background:linear-gradient(90deg,#a35bff,#6d28d9)} html.nl .nlovp #saved{display:block;margin-top:12px;font:400 13px var(--nlfont);color:var(--nlmut)} html.nl .nlob .grid.k6.nlk{display:grid!important;grid-template-columns:1fr 1fr!important;gap:10px!important} html.nl body:has(.hnav) .main .mainin{max-width:none!important;padding:22px 22px 60px!important} html.nl .hnav{position:absolute!important;left:50%;top:50%;transform:translate(-50%,-50%);display:flex!important;gap:4px!important;margin:0!important} html.nl .hnav a{text-transform:uppercase!important;letter-spacing:.06em!important;font:600 12px/1.45 var(--nlfont)!important;padding:6px 12px!important;border-radius:10px!important;border:1px solid var(--nlline)!important;background:var(--nlbtn)!important;color:var(--nlmut)!important;text-decoration:none!important;transition:border-color .2s,color .2s} html.nl .hnav a:hover{color:var(--fg)!important;border-color:var(--nlvio2)!important} html.nl .top>.hdl{display:none!important} html.nl .side .nlpnl a.feedbtn{text-decoration:none;box-sizing:border-box}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nltop .brand .bac{color:var(--fg)!important;-webkit-text-fill-color:currentColor!important;background:none!important} html.nl .top>.av{display:none!important} html.nl .nlbar .nlbb{flex-wrap:wrap!important;justify-content:flex-end!important;row-gap:6px;overflow:visible!important;flex:0 1 auto!important} html.nl .nlbar{align-items:center!important} html.nl .main.nlpinned .nlbar .nlt{flex:0 1 auto;min-width:60px}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlrd{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px} html.nl .nlrd #spl,html.nl .nlrd #ezr{font:400 13px/1.45 var(--nlfont)!important;color:var(--fg)!important;background:var(--nlbtn)!important;border:1px solid var(--nlline)!important;border-radius:10px!important;padding:6px 10px!important;cursor:pointer} html.nl .nlrd #spl:hover,html.nl .nlrd #ezr:hover{border-color:var(--nlvio2)!important}} html.nl .nltop,html.nl .nlbar,html.nl .nlright,html.nl .nlover,html.nl .nlacts{--fg:#f3eaff} html.nl[data-skin="light"] .nlbar{--fg:#16181d} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlscroll #stage{width:100%!important;min-width:0!important;overflow-x:hidden}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl body:has(.nltop) .side{padding:0!important} html.nl body:has(.nltop) .side>.nlpnl{margin:0!important;padding:12px!important;border-bottom:1px solid var(--nlline)} html.nl body:has(.nltop) .side>.nlpnl.nlsyl{border-bottom:0} html.nl body:has(.nltop) .side .nlsyl>*{margin-bottom:10px} html.nl body:has(.nltop) .side .nlsyl>.grp.nlph{margin:0 0 8px!important} html.nl body:has(.nltop) .side .nlsyl>.small{padding:0!important;margin:0 0 12px!important;font:400 12px/1.45 var(--nlfont)!important;color:var(--nlmut)!important} html.nl body:has(.nltop) .side a.feedbtn{display:block;width:100%;box-sizing:border-box;text-decoration:none;margin:0!important}} @media (max-width:1600px) and (min-width:861px) and (hover:hover), (max-width:1600px) and (min-width:1401px){html.nl .nlacts a.nlb.out::after{display:none!important} html.nl .nlacts .nlnone{display:none!important}} @media (max-width:1499px) and (min-width:861px) and (hover:hover), (max-width:1499px) and (min-width:1401px){html.nl .top .nlacts .tsz{display:none!important}} @media (max-width:999px) and (min-width:861px) and (hover:hover){html.nl .tabs,html.nl .hnav{position:static!important;transform:none!important;margin:0 auto!important}} @media (max-width:1199px) and (min-width:861px) and (hover:hover){html.nl .nlacts a.nlown{display:none!important}} html.nl[data-skin="light"] :is(.top,.nltop,.side,.nlright,.nlover){--bg:#0b0711;--bg2:#100a18;--card:#130d1d;--card2:#191126;--line:#2a1f3d;--fg:#f3eaff;--fg2:#e6dcf7;--mute:#b9addb;--violet:#A35BFF;--gold:#F2D58A;--chipon:#16101c;color-scheme:dark;color:#f3eaff} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl[data-skin="light"] .top,html.nl[data-skin="light"] .nltop{background:#140d1f!important;box-shadow:none!important;border-bottom-color:#2a1f3d!important} html.nl[data-skin="light"] .side{background:#140d1f!important;border-right-color:#2a1f3d!important} html.nl[data-skin="light"] .nlright{background:#140d1f!important} html.nl[data-skin="light"] body{background:#05030a!important} html.nl[data-skin="light"] .main{background:#05030a!important} html.nl[data-skin="light"] .brand .bwm:not(.ink){display:block!important} html.nl[data-skin="light"] .brand .bwm.ink{display:none!important} html.nl[data-skin="light"] .side .sp,html.nl[data-skin="light"] .side .nm,html.nl[data-skin="light"] .side .grp{color:#f3eaff!important}} @media (max-width:999px) and (min-width:861px) and (hover:hover){html.nl .nlacts a[target="arguta-site"]{display:none!important}} html.nl[data-skin=light] :is(.side,.nlright,.nlover,.nltop){--void:#0b0711;--panel:#140e20;--panel2:#1c1430;--line2:#4a3878;--ink:#f3eaff;--soft:#d8cdef;--dim:#a99cc8;--violet2:#7c3df0;--amber:#F7931A;--ok:#3ddc97;--bad:#ff6b81;--cyan:#d8c2ff} html.nl[data-skin=light] .side .sec{background:rgba(20,14,32,.8)!important;border-color:#2a1f3d!important} html.nl[data-skin=light] .side .li:hover{background:rgba(163,91,255,.08)!important} html.nl[data-skin=light] .side .li.now{background:rgba(163,91,255,.16)!important} html.nl[data-skin=light] .side .sn{color:var(--c)!important;background:transparent!important} html.nl[data-skin="light"] .nlover .kick,html.nl[data-skin="light"] .nlover .dkb,html.nl[data-skin="light"] .nlover .osn{color:#F7931A!important} html.nl .nlover [style*="opacity:.45"],html.nl .nlover [style*="opacity: 0.45"]{opacity:.75!important} html.nl .nlover .ost.z{opacity:.8!important} .nlbrain{--cl:#2a1f3d;--cb:#1a1228;--cm:#c4b8e0;--ct:#f3eaff;max-width:1120px;margin:0 auto;padding:14px 10px 40px;box-sizing:border-box;color:var(--ct);font-family:Geist,"Segoe UI",system-ui,sans-serif} html[data-skin="light"] .nlbrain{--cl:#e3dcec;--cb:#ffffff;--cm:#5d5470;--ct:#1b1325} html.nl .nlbar .nlbbsave{background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;font-weight:600!important} .nlbbtoast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;pointer-events:none;z-index:9999;background:#1b1229;color:#f3eaff;border:1px solid #8b5cf6;border-radius:10px;padding:10px 16px;font:500 14px Geist,system-ui,sans-serif;transition:opacity .25s,transform .25s} .nlbbtoast.on{opacity:1;transform:translate(-50%,0)} html.nl .nlscroll{container-type:inline-size;container-name:doc} html.nl .nlscroll .doc{container-type:normal} html.nl .nlover .nlprof{display:none} html.nl .nlover.nlpmode .nlprof{display:block;flex:1;min-height:0;overflow-y:auto;padding:14px 18px 28px} html.nl .nlover.nlpmode .nlob{display:none!important} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlscroll>.cols{max-width:1120px!important;padding:36px 32px 60px!important;margin:0 auto!important;box-sizing:border-box!important;width:100%} html.nl .nlscroll .nlcrew,html.nl .nlscroll .nlbrain{max-width:none!important;padding:0!important;margin:0!important} html.nl body:has(.hnav) .main .mainin{max-width:1120px!important;padding:36px 32px 60px!important;margin:0 auto!important;box-sizing:border-box} html.nl body:has(.nltop) .nlscroll #stage{max-width:1120px!important;padding:36px 32px 40px!important}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlbar .nlsub{flex:1 1 auto;justify-content:center;--u-line:var(--nlline);--u-mut:#c4b8e0;--u-h:var(--fg)} html.nl[data-skin="light"] .nlbar .nlsub{--u-mut:var(--nlmut)} html.nl .nlbar .nlt{flex:0 1 auto} html.nl .nlemb{display:block;width:100%;border:0;background:transparent;min-height:400px}} html.nl .nlscroll>.cols.nlhid{display:none!important} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlpanel{container-type:inline-size;container-name:nlp}} @container nlp (max-width:1000px){html.nl .nlbar .viewas>span{display:none}} html.nl .nlemb{zoom:calc(1 / var(--tz,1))} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.nl .nlbar.nlctr{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center} html.nl .nlbar.nlctr .nlt{grid-column:1;justify-self:start;max-width:100%} html.nl .nlbar.nlctr .nlsub{grid-column:2;justify-self:center;flex:none} html.nl .nlbar.nlctr .nlbb{grid-column:3;justify-self:end} html.nl .nlbar.nltight .nlt{display:none!important} html.nl .nlbar.nltight .nlsub{flex:none} html.nl .nlbar.nlnosub .nlsub{display:none!important} html.nl .nlbar.nltight .nlbb,html.nl .nlbar.nlnosub .nlbb{margin-left:auto}} html.nl .side .nlpnl[data-grp="start-here"] .sp .dot{background:#a35bff!important} html.nl .side .nlpnl[data-grp="arguta-os"] .sp .dot{background:#f7931a!important} html.nl .side .nlpnl[data-grp="courses"] .sp .dot{background:#3ddc97!important} html.nl .side .nlpnl[data-grp="community"] .sp .dot{background:#d8c2ff!important} html.nl .side .nlpnl[data-grp="mentoring"] .sp .dot{background:#f2d58a!important} html.nl .side .nlpnl[data-grp="help"] .sp .dot{background:#b9addb!important} html.nl .side .nlpnl[data-grp="arguta"] .sp .dot{background:#f7931a!important} html.nl .side .sp.nlhid{display:none!important} html.nl .nlscroll .nlcrew .din{max-width:none;padding:0;margin:0} html.nlquietb #center > .stban{display:none!important} html.nlquiet .nlbar .nlsub{display:none!important} html.nlpolon .nlbar .nlsub{display:none!important} :where(html.nl) #side .lfoot{margin:10px 0 0} html.nl #connection{display:none!important} /* ==================== v13h ACADEMY BANNERS AND SETUP PANELS (were inside academy/lib.php and steps-lib.php; their own class names, page-wide rules only while the banner shows) ==================== */ :where(html:not(.pf-app):not(.pf-studio)) body:has(.cfbar){padding-top:52px} :where(html:not(.pf-app):not(.pf-studio)) .cfbar{position:fixed;inset:0 0 auto 0;z-index:100;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 14px;padding:10px 16px;background:#b3261e;color:#fff;font:600 14px/1.4 system-ui,-apple-system,"Segoe UI",Arial,sans-serif;box-shadow:0 4px 18px rgba(0,0,0,.35)} :where(html:not(.pf-app):not(.pf-studio)) .cfbar form{margin:0} :where(html:not(.pf-app):not(.pf-studio)) .cfbar button{font:inherit;font-size:14px;cursor:pointer;border:1px solid rgba(255,255,255,.75);background:#fff;color:#b3261e;border-radius:999px;padding:7px 14px;min-height:36px} @media(max-width:640px){:where(html:not(.pf-app):not(.pf-studio)) body:has(.cfbar){padding-top:96px}} :where(html:not(.pf-app):not(.pf-studio)) body:has(.spbar) :is(.ag-pill,.ag-panel,.cd-box){display:none!important} :where(html:not(.pf-app):not(.pf-studio)) body:has(.spbar){padding-top:44px} :where(html:not(.pf-app):not(.pf-studio)) .spbar{position:fixed;inset:0 0 auto 0;z-index:100;display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;padding:10px 16px;background:#F7931A;color:#16101c;font:600 14px system-ui,-apple-system,sans-serif} :where(html:not(.pf-app):not(.pf-studio)) .spbar a{margin-left:auto;color:#16101c;background:#fff;border-radius:999px;padding:6px 12px;text-decoration:none} :where(html:not(.pf-app):not(.pf-studio)) .obbar{background:#130d1d;border-bottom:1px solid rgba(163,91,255,.5);color:#f3eaff;font:15px/1.5 "Geist","Segoe UI",system-ui,-apple-system,Arial,sans-serif;padding:12px max(16px,env(safe-area-inset-left,0px));position:relative;z-index:60} :where(html:not(.pf-app):not(.pf-studio)) ' . '.obin2{max-width:1100px;margin:0 auto;display:grid;gap:10px} :where(html:not(.pf-app):not(.pf-studio)) .obk{font:600 12px/1 "Geist Mono",ui-monospace,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase;color:#F7931A} :where(html:not(.pf-app):not(.pf-studio)) ' . '.obs{display:flex;flex-wrap:wrap;gap:8px} :where(html:not(.pf-app):not(.pf-studio)) .obp{display:inline-flex;align-items:center;gap:8px;padding:7px 12px 7px 7px;border-radius:999px;border:1px solid #2a1f3d;background:#0b0711;color:#b9addb;font-size:14px} :where(html:not(.pf-app):not(.pf-studio)) ' . '.obp b{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#2a1f3d;color:#f3eaff;font-size:13px} :where(html:not(.pf-app):not(.pf-studio)) .obp.on{border-color:#F7931A;color:#f3eaff} :where(html:not(.pf-app):not(.pf-studio)) .obp.on b{background:linear-gradient(90deg,#C34813,#F7931A);color:#16101c} :where(html:not(.pf-app):not(.pf-studio)) .obp.ok{border-color:#4CC47F;color:#4CC47F} :where(html:not(.pf-app):not(.pf-studio)) .obp.ok b{background:#4CC47F;color:#0b0711} :where(html:not(.pf-app):not(.pf-studio)) ' . '.obbar p{margin:0;max-width:75ch} :where(html:not(.pf-app):not(.pf-studio)) .obb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0} :where(html:not(.pf-app):not(.pf-studio)) .obbtn{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border-radius:999px;border:0;background:linear-gradient(90deg,#C34813,#F7931A);color:#16101c;font:600 15px inherit;font-family:inherit;text-decoration:none;cursor:pointer} :where(html:not(.pf-app):not(.pf-studio)) ' . '.obbtn.gh{background:transparent;color:#f3eaff;border:1px solid rgba(163,91,255,.65)} :where(html:not(.pf-app):not(.pf-studio)) .obtick{display:inline-flex;gap:8px;align-items:center;font-size:15px} :where(html:not(.pf-app):not(.pf-studio)) .obtick input{width:22px;height:22px} :where(html:not(.pf-app):not(.pf-studio)) .obbar a{color:#d9c2ff} :where(html:not(.pf-app):not(.pf-studio)) .obbar .obbtn,:where(html:not(.pf-app):not(.pf-studio)) .ow .obbtn{box-sizing:border-box;font:600 15px/1.2 "Geist","Segoe UI",system-ui,-apple-system,Arial,sans-serif} :where(html:not(.pf-app):not(.pf-studio)) .obbar .obbtn{color:#16101c} :where(html:not(.pf-app):not(.pf-studio)) .obbar .obbtn.gh{color:#f3eaff} :where(html:not(.pf-app):not(.pf-studio)) ' . '.obin{font:16px inherit;font-family:inherit;color:#f3eaff;background:#0b0711;border:1px solid #2a1f3d;border-radius:12px;padding:10px 12px;min-height:44px;min-width:220px} :where(html:not(.pf-app):not(.pf-studio)) .ow{position:fixed;inset:0;z-index:200;background:rgba(5,3,9,.78);display:flex;align-items:center;justify-content:center;padding:16px} :where(html:not(.pf-app):not(.pf-studio)) .ow[hidden]{display:none} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owbox{width:min(560px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#130d1d;border:1px solid rgba(163,91,255,.6);border-radius:18px;padding:22px 22px 18px;color:#f3eaff;font:16px/1.5 "Geist","Segoe UI",system-ui,-apple-system,Arial,sans-serif;box-shadow:0 20px 60px rgba(0,0,0,.6)} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owtop{display:flex;align-items:center;gap:10px;margin-bottom:10px} :where(html:not(.pf-app):not(.pf-studio)) .owdots{display:flex;gap:6px;flex:1} :where(html:not(.pf-app):not(.pf-studio)) .owdots i{width:28px;height:6px;border-radius:3px;background:#2a1f3d} :where(html:not(.pf-app):not(.pf-studio)) .owdots i.on{background:linear-gradient(90deg,#C34813,#F7931A)} :where(html:not(.pf-app):not(.pf-studio)) .owdots i.ok{background:#4CC47F} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owx{background:none;border:0;color:#b9addb;font-size:26px;line-height:1;cursor:pointer;padding:4px 8px} :where(html:not(.pf-app):not(.pf-studio)) .owk{font:600 12px/1 "Geist Mono",ui-monospace,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase;color:#F7931A} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owstep h2{margin:6px 0 10px;font-size:22px;line-height:1.25} :where(html:not(.pf-app):not(.pf-studio)) .owstep p{margin:0 0 10px} :where(html:not(.pf-app):not(.pf-studio)) .owsm{font-size:14px;color:#b9addb} :where(html:not(.pf-app):not(.pf-studio)) a.owsm{display:inline-block;margin-top:2px;color:#d9c2ff} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owchips{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:4px 0 12px} :where(html:not(.pf-app):not(.pf-studio)) .owchip{display:inline-block;padding:7px 12px;border-radius:10px;background:#0b0711;border:1px solid #F7931A;font-weight:600;font-size:15px} :where(html:not(.pf-app):not(.pf-studio)) .owsep{color:#F7931A;font-size:20px} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owcopy{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:6px 14px;border-radius:10px;border:1px solid rgba(163,91,255,.65);background:#0b0711;color:#f3eaff;font:600 15px inherit;font-family:inherit;cursor:pointer} :where(html:not(.pf-app):not(.pf-studio)) .owcopy::after{content:"Copy";font-size:12px;color:#b9addb;font-weight:400} :where(html:not(.pf-app):not(.pf-studio)) .owcopy.done::after{content:"Copied";color:#4CC47F} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owlink{background:#0b0711;border:1px solid #4CC47F;border-radius:10px;padding:10px;margin:0 0 8px;word-break:break-all;font-size:14px} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ownav{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:16px;padding-top:12px;border-top:1px solid #2a1f3d} :where(html:not(.pf-app):not(.pf-studio)) .ownav .owhelp{margin-left:auto;font-size:14px;color:#d9c2ff} :where(html:not(.pf-app):not(.pf-studio)) .obbtn[disabled]{opacity:.45;cursor:not-allowed} :where(html:not(.pf-app):not(.pf-studio)) ' . '.owdone{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px} :where(html:not(.pf-app):not(.pf-studio)) .ow .obbtn{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border-radius:999px;border:0;background:linear-gradient(90deg,#C34813,#F7931A);color:#16101c;font:600 15px inherit;font-family:inherit;text-decoration:none;cursor:pointer} :where(html:not(.pf-app):not(.pf-studio)) .ow .obbtn.gh{background:transparent;color:#f3eaff;border:1px solid rgba(163,91,255,.65)} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ow .obin{font:16px inherit;font-family:inherit;color:#f3eaff;background:#0b0711;border:1px solid #2a1f3d;border-radius:12px;padding:10px 12px;min-height:44px;min-width:200px} :where(html:not(.pf-app):not(.pf-studio)) .ock{position:fixed;inset:0;z-index:210;background:rgba(5,3,9,.78);display:flex;align-items:center;justify-content:center;padding:16px} :where(html:not(.pf-app):not(.pf-studio)) .ock[hidden]{display:none} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ockbox{width:min(600px,100%);max-height:calc(100vh - 32px);overflow:auto;background:#130d1d;border:1px solid rgba(163,91,255,.6);border-radius:18px;padding:20px;color:#f3eaff;font:16px/1.5 "Geist","Segoe UI",system-ui,-apple-system,Arial,sans-serif} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ockbox h2{margin:4px 0 6px;font-size:22px} :where(html:not(.pf-app):not(.pf-studio)) .ockk{font:600 12px/1 "Geist Mono",ui-monospace,Consolas,monospace;letter-spacing:.18em;text-transform:uppercase;color:#F7931A} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ocksum{margin:0 0 12px;padding:10px 12px;border-radius:12px;font-weight:600} :where(html:not(.pf-app):not(.pf-studio)) .ocksum.ok{background:rgba(76,196,127,.12);border:1px solid #4CC47F;color:#4CC47F} :where(html:not(.pf-app):not(.pf-studio)) .ocksum.gap{background:rgba(247,147,26,.1);border:1px solid #F7931A;color:#F7931A} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ock ul{list-style:none;margin:0;padding:0;display:grid;gap:8px} :where(html:not(.pf-app):not(.pf-studio)) .ock li{display:flex;gap:10px;align-items:flex-start;padding:10px;border-radius:12px;background:#0b0711;border:1px solid #2a1f3d} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ock li>b{flex:none;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;font-size:14px} :where(html:not(.pf-app):not(.pf-studio)) .ock li.ok>b{background:#4CC47F;color:#0b0711} :where(html:not(.pf-app):not(.pf-studio)) .ock li.gap{border-color:#F7931A} :where(html:not(.pf-app):not(.pf-studio)) .ock li.gap>b{background:linear-gradient(90deg,#C34813,#F7931A);color:#16101c} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ock li strong{display:block} :where(html:not(.pf-app):not(.pf-studio)) .ock li span{display:block;font-size:14px;color:#b9addb} :where(html:not(.pf-app):not(.pf-studio)) .ockb{display:inline-flex;align-items:center;margin-top:8px;min-height:40px;padding:8px 16px;border-radius:999px;border:0;background:linear-gradient(90deg,#C34813,#F7931A);color:#16101c;font:600 14px/1.2 "Geist","Segoe UI",system-ui,sans-serif;text-decoration:none;cursor:pointer;box-sizing:border-box} :where(html:not(.pf-app):not(.pf-studio)) ' . '.ocknav{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px} :where(html:not(.pf-app):not(.pf-studio)) .ocknav .g{background:transparent;color:#f3eaff;border:1px solid rgba(163,91,255,.65)} :where(html:not(.pf-app):not(.pf-studio)) .ocknav a{margin-left:auto;font-size:14px;color:#d9c2ff} /* ==================== SHARED RULES (the master as it was, then the v13 shared defaults) ==================== */ /* arguta-ui.css v45 (v12lj): master type and spacing lock at the end of the file */ /* arguta-ui.css v36 (v12jy): no fake bold anywhere */ /* arguta-ui.css: the Arguta master stylesheet (v5, 8 Nov 2026). One file for the App, Studio, Academy, course player and Admins. A shared style is changed here, once, and nowhere else. Fonts: Google Fonts only (SIL Open Font License), served from academy.arguta.ai/font.php, never the device's own font. Poppins for headings, Geist for all text, buttons and menus, Geist Mono for the small orange labels. */ @font-face{font-family:'Geist';font-style:normal;font-display:swap;font-weight:100 900;src:url(https://academy.arguta.ai/font.php?f=geist) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Geist';font-style:normal;font-display:swap;font-weight:100 900;src:url(https://academy.arguta.ai/font.php?f=geist-ext) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Geist';font-style:italic;font-display:swap;font-weight:100 900;src:url(https://academy.arguta.ai/font.php?f=geist-i) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Geist Mono';font-style:normal;font-display:swap;font-weight:100 900;src:url(https://academy.arguta.ai/font.php?f=mono) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Geist Mono';font-style:normal;font-display:swap;font-weight:100 900;src:url(https://academy.arguta.ai/font.php?f=mono-ext) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:400;src:url(https://academy.arguta.ai/font.php?f=pop-400) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:400;src:url(https://academy.arguta.ai/font.php?f=pop-400-ext) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:500;src:url(https://academy.arguta.ai/font.php?f=pop-500) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:500;src:url(https://academy.arguta.ai/font.php?f=pop-500-ext) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:600;src:url(https://academy.arguta.ai/font.php?f=pop-600) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:600;src:url(https://academy.arguta.ai/font.php?f=pop-600-ext) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:700;src:url(https://academy.arguta.ai/font.php?f=pop-700) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:700;src:url(https://academy.arguta.ai/font.php?f=pop-700-ext) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:800;src:url(https://academy.arguta.ai/font.php?f=pop-800) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} @font-face{font-family:'Poppins';font-style:normal;font-display:swap;font-weight:800;src:url(https://academy.arguta.ai/font.php?f=pop-800-ext) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF} @font-face{font-family:'Poppins';font-style:italic;font-display:swap;font-weight:400;src:url(https://academy.arguta.ai/font.php?f=pop-400i) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD} /* frame columns: one width for the left and right columns on every platform (Richard, 8 Nov 2026: the left column matches the right) */ :root{--col-l:340px;--col-r:340px;--col-lm:300px;--col-rm:300px} :root{--f-head:Poppins,Geist,system-ui,sans-serif;--f-text:Geist,system-ui,-apple-system,"Segoe UI",sans-serif;--f-mono:Geist Mono,ui-monospace,Menlo,monospace} /* ===== TYPE SCALE: every text size in the pages comes from these (Richard, 8 Nov 2026: about 20 styles instead of 84). Change a size here and it changes everywhere. ===== */ :root{--fs-label-s:10.5px;--fs-label:11px;--ls-label:.12em;--fs-cap:12px;--fs-note:13px;--fs-small:13.5px;--fs-body:14px;--fs-btn:15px;--fs-intro:16px;--fs-h4:16px;--fs-h3:19px;--lh-body:1.6;--lh-ui:1.45} /* ===== PAGE CONTENT: one source for every page shown in the App and the Academy (headings, labels, intro, body, buttons, cards). ===== */ /* ---- base tokens of the page (were in the App's base sheet); same values in the App and the Academy ---- */ .doc{--txt:#f3eaff;--line:#2a1f3d;--vio:#8b5cf6;--mut:#a99cc8;--amb:#F7931A;--pan:#140d1f} /* the page text every element starts from (the App's body text) */ .doc{font:14px/1.45 Geist,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--txt);-webkit-font-smoothing:antialiased} :where(.doc) .din{max-width:780px;margin:0 auto;padding:36px 28px 60px} :where(.doc) .din h1{font:700 clamp(26px,3.2vw,38px)/1.15 Poppins,Geist,system-ui,sans-serif;margin:0 0 10px;color:var(--txt)} :where(.doc) .din h1 em{font-style:normal;color:#b794ff} :where(.doc) .din .lead{color:#c4b8e0;font-size:var(--fs-intro);margin:0 0 22px} .lite :where(.doc) .din h1,:where(html[data-skin="light"] .doc) .din h1{color:#1b1325} .lite :where(.doc) .din h1 em,:where(html[data-skin="light"] .doc) .din h1 em{color:#7c3aed} .doc{--cb:#1a1228;--cl:#2a1f3d;--ct:#f3eaff;--cm:#c4b8e0} .lite .doc,html[data-skin="light"] .doc{--cb:#fff;--cl:#eee8f3;--ct:#1b1325;--cm:#5d5470} :where(.doc) .din.wide{max-width:1040px} :where(.doc) .din h2{font:700 clamp(20px,2.2vw,26px)/1.2 Poppins,Geist,system-ui,sans-serif;margin:6px 0 10px;color:var(--ct)} .doc .din h3{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;margin:0 0 6px;color:var(--ct)} :where(.doc) .din p{color:var(--cm);line-height:var(--lh-body)} .doc .din .row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:4px 0 6px} :where(.doc) .sec{margin-top:44px;padding-top:28px;border-top:1px solid var(--cl)} :where(.doc) .din,:where(.doc) .din.wide{max-width:1120px;margin:0 auto;padding:36px 32px 60px;box-sizing:border-box} :where(.doc) .wsl .din{padding-top:28px;padding-bottom:28px} :where(.doc) .ghostb{min-height:44px;padding:0 20px;border-radius:10px;border:1px solid var(--cl);background:transparent;color:var(--ct);font-weight:600} :where(.doc) .ghostb:hover{border-color:var(--vio)} .lite :where(.doc) .ghostb,:where(html[data-skin="light"] .doc) .ghostb{background:#fff} :where(.doc) .sec.end{border-top:0;padding-top:8px} :where(.doc,.modal) .k{font:500 var(--fs-label)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--amb)} :where(.doc) .note{font-size:var(--fs-note);margin:10px 0 0} /* ---- page parts that were in the App's own sheet ---- */ :where(.doc) .ticks{margin:0;padding:0 0 0 18px;display:grid;gap:6px;color:var(--ct)} :where(.doc) .chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px} :where(.doc) .chips span{font-size:var(--fs-note);color:var(--cm);border:1px solid var(--cl);border-radius:999px;padding:4px 11px} :where(.doc) .cmp.gap td:last-child{color:var(--ct);font-weight:600} :where(.doc) .say{margin:12px 0 0;color:var(--cm)} :where(.doc) .say b{color:var(--ct)} :where(.doc) .lam{font-weight:800;margin-right:6px} :where(.doc) .lam.vi{color:var(--vio)} :where(.doc) .lam.or{color:var(--amb)} :where(.doc) .path .ticks{color:var(--cm);font-size:var(--fs-body)} :where(.doc) .ex3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} :where(.doc) .trust{margin-top:34px;text-align:center;font:500 var(--fs-label)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--amb)} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(.doc) .ex3{grid-template-columns:1fr}} :where(.doc) .lpl{align-self:flex-start;color:var(--amb);border:1px solid rgba(247,147,26,.4)} /* buttons and links in pages (the App's values; the Academy's .cmain is the App's .main) */ :where(.doc) button{font:inherit;cursor:pointer;border-radius:10px;border:1px solid var(--line);background:#1b1229;color:var(--txt);padding:8px 12px} :where(.doc) button.main,:where(.doc) button.cmain{background:#7c3aed;border-color:#7c3aed;color:#fff;font-weight:600} :where(.doc) button.cmain:not(:disabled):hover{background:#6d28d9;border-color:#c4a8ff} :where(.doc) button.big{min-height:44px;padding:0 22px;font-size:var(--fs-btn);border-radius:10px} :where(.doc) a.ghost{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:10px;border:1px solid var(--cl);color:var(--ct);text-decoration:none;font-weight:600} :where(.doc) a.ghost:hover{border-color:var(--vio)} :where(.doc) .ej[data-prof]{cursor:pointer} :where(.doc) .ej{display:grid;gap:6px;background:var(--cb);border:1px solid var(--cl);border-radius:14px;padding:16px} :where(.doc) .ej img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--vio)} :where(.doc) .ej b{color:var(--ct)} :where(.doc) .ej span{color:var(--cm);font-size:var(--fs-body);font-style:italic} :where(.doc) .soonb{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 20px;border-radius:10px;border:1px solid var(--cl);color:var(--ct);font-weight:600;opacity:.55;cursor:default} :where(.doc) .soonb small{font-size:var(--fs-label-s);color:var(--amb);font-weight:600} /* v12ic: Arguta OS in seven parts: six cards, then the proof layer across the full width */ :where(.doc) .osp{grid-column:1/-1} :where(.doc) .osp2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px} :where(.doc) .ospb{border-left:1px solid var(--p-line);padding-left:24px} :where(.doc) .ospb b{display:block;font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h);margin:0 0 6px} :where(.doc) .ospb p{margin:0 0 10px;font-size:var(--fs-body);color:var(--p-b)} :where(.doc) .ospb ul{margin:0;padding-left:18px;color:var(--p-b);font-size:var(--fs-small);line-height:var(--lh-body)} @container doc (max-width:860px){:where(.doc) .osp2{grid-template-columns:1fr}:where(.doc) .ospb{border-left:0;padding-left:0;border-top:1px solid var(--p-line);padding-top:16px}} /* a little more room between a section heading and its cards when there is no intro line (Try it) */ :where(.doc) .sec>h2+.ex3{margin-top:22px} /* v12ic: Arguta OS diagram, from the website's: six example jobs wired to the Business Brain, with dots moving along the wires (pure SVG, no script) */ :where(.doc) .oxw{position:relative;aspect-ratio:1000/560;margin:30px 0 6px} :where(.doc) .oxw-svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible} :where(.doc) .oxw-ring{fill:none;stroke:var(--p-line);stroke-width:1.2} :where(.doc) .oxw-hub{fill:var(--p-card);stroke:#8b5cf6;stroke-opacity:.6;stroke-width:1.2} :where(.doc) .oxw-ringlabel{font:600 10px Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:.2em;fill:var(--p-lab)} :where(.doc) .oxw-wire{fill:none;stroke:#8b5cf6;stroke-opacity:.45;stroke-width:1.3} :where(.doc) .oxw-wire.o{stroke:#F7931A;stroke-opacity:.45} .doc .oxw .oxw-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:19%;text-align:center;display:grid;gap:4px} .doc .oxw .oxw-core small{font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);color:var(--p-acc)} .doc .oxw .oxw-core b{font:600 var(--fs-h4)/1.3 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} .doc .oxw .oxw-core span{font-size:var(--fs-cap);color:var(--p-b)} :where(.doc) .oxw-c{position:absolute;top:var(--y);transform:translateY(-50%);width:24%;box-sizing:border-box} :where(.doc) .oxw-l{left:0} :where(.doc) .oxw-r{right:0} @container doc (max-width:860px){:where(.doc) .oxw{aspect-ratio:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}:where(.doc) .oxw-svg{display:none}:where(.doc) .oxw-core,:where(.doc) .oxw-c{position:static;transform:none;width:auto}:where(.doc) .oxw-core{grid-column:1/-1;order:-1}} @container doc (max-width:420px){:where(.doc) .oxw{grid-template-columns:1fr}} /* ---- page parts (was console/pages.css) ---- */ .doc{container:doc/inline-size;--p-card:var(--cb);--p-line:var(--cl);--p-h:var(--ct);--p-b:var(--cm);--p-acc:#b794ff;--p-vio:#7c3aed;--p-lab:var(--amb);--p-ora:var(--amb);--p-band:#1f1630;--p-ok:#3ddc97;--p-ph:#0f0a17;--p-sh:none} .lite .doc,html[data-skin="light"] .doc{--p-card:#fff;--p-line:#e9e4ef;--p-h:#1b1325;--p-b:#5d5470;--p-acc:#7c3aed;--p-vio:#7c3aed;--p-lab:#b45309;--p-ora:#e8761a;--p-band:#faf8fd;--p-ok:#047857;--p-ph:#f3f0f7;--p-sh:0 1px 2px rgba(27,19,37,.06)} .doc .din h1{letter-spacing:-.01em} .doc .din h2{font-size:clamp(22px,2.6vw,30px);letter-spacing:-.01em} .doc .din .lede{color:var(--p-b);font-size:var(--fs-intro);line-height:var(--lh-body);max-width:680px;margin:8px 0 0} .doc .din .lede b{color:var(--p-h)} .doc .din .note{font-size:var(--fs-note);color:var(--p-b);margin-top:14px} .doc .din .note.ctrn{text-align:center;margin-top:10px} .doc .din .small{font-size:var(--fs-note);margin:2px 0 12px;color:var(--p-b)} .lite .doc .k,html[data-skin="light"] .doc .k{color:var(--p-lab)} .doc .sec.ctr,.doc .pgh.ctr{text-align:center} .doc .sec.ctr .lede,.doc .pgh.ctr .lede{margin-left:auto;margin-right:auto} .doc .sec.ctr>.row{justify-content:center} .doc .sec.end{border-top:0} .doc .pgh{padding:4px 0 6px} .doc .hud,.doc .aa,.doc .pwc,.doc .jp,.doc .layer,.doc .lv,.doc .dvx,.doc .oxc,.doc .blk,.doc .fact,.doc .rules>div,.doc .crflow>div,.doc .crface,.doc .argroles>div,.doc .gap,.doc .acta{background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} .doc .hud{position:relative;overflow:hidden} .doc .hud.pad{padding:24px 26px} .doc .hud .big{font-size:var(--fs-intro);color:var(--p-h);line-height:var(--lh-body);margin:8px 0 0;max-width:860px} .doc .hud a{color:var(--p-acc)} .doc .hud h3{margin:0 0 6px} .doc .hud p{margin:0} .doc .lam{flex:none;display:block} .doc .lam.v,.doc .wm .v{color:var(--p-vio)} .doc .lam.o,.doc .wm .o{color:var(--p-ora)} .doc .wm{display:inline-flex} .doc .wmrow{display:flex;align-items:center;gap:14px;margin:10px 0 4px} .doc .wmrow .wm svg{width:70px;height:48px} .doc .wmt{font:700 clamp(38px,4.6vw,58px)/1 Poppins,Geist,system-ui,sans-serif;letter-spacing:-.02em;color:var(--p-h)} .doc .lam2{display:flex} .doc .lam2 .lam+.lam{margin-left:-14px} .doc .hx{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:34px;align-items:center} .doc .hx h1.hbr{font-size:clamp(34px,4.6vw,58px);line-height:1.05;margin-bottom:12px} .doc .hbr .ln{display:block} .doc .hbr .brain{position:relative;display:inline;color:var(--p-h)} .doc .hbr .brain::before{content:"";position:absolute;left:-7%;width:114%;top:54%;height:1.15em;transform:translateY(-50%);z-index:-1;pointer-events:none;border-radius:50%;border:1.5px solid var(--p-vio);opacity:.8} .doc .hbr .ln:first-child{isolation:isolate} .doc .hsub{margin:0 0 14px;font:600 clamp(19px,2vw,23px)/1.25 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} .doc .hsub em{font-style:normal;color:var(--p-acc)} .doc .hx .lead{font-size:var(--fs-intro);line-height:var(--lh-body);max-width:600px;color:var(--p-b)} .doc .hx-card{all:unset;box-sizing:border-box;cursor:pointer;display:grid;gap:0;border-radius:14px;overflow:hidden;background:var(--p-card);border:1px solid var(--p-vio);box-shadow:var(--p-sh)} .doc .hx-card:hover{border-color:var(--p-acc)} .doc .hx-card:focus-visible{outline:2px solid var(--p-vio);outline-offset:3px} .doc .hx-ph{display:flex;flex-direction:column} .doc .hx-ph img{width:100%;aspect-ratio:1/1;height:auto;object-fit:cover;object-position:50% 18%;display:block;background:var(--p-ph);border-bottom:1px solid var(--p-line)} .doc .hx-cap{display:grid;gap:3px;padding:14px 16px 4px} .doc .hx-cap b{font:700 22px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} .doc .hx-cap>span:last-child{font-size:var(--fs-small);color:var(--p-b)} .doc .hx-faces{display:flex;align-items:center;padding:10px 16px 16px} .doc .hx-faces img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:2px solid var(--p-card);margin-right:-8px;background:var(--p-ph)} .doc .hx-faces i{font-style:normal;margin-left:16px;font-size:var(--fs-note);font-weight:600;color:var(--p-lab)} .doc .mb{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:center;padding:28px} .doc .mb.hud{margin-top:44px;border-top:1px solid var(--p-line)} .doc .say{margin:14px 0 0;font-size:var(--fs-h3);color:var(--p-h)} .doc .say b{color:var(--p-h)} .doc .say small{display:block;color:var(--p-b);font-size:var(--fs-btn);margin-top:6px} .doc .mb-l>.ghostb{margin-top:18px} .doc .two2{display:grid;gap:12px} .doc .aa{display:flex;gap:16px;align-items:flex-start;padding:18px;background:var(--p-band);box-shadow:none} .doc .aa h3{margin:0} .doc .aa p{margin:4px 0 0;font-size:var(--fs-body)} .doc .pow{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:22px;text-align:left} .doc .pow.p3{grid-template-columns:repeat(3,minmax(0,1fr))} .doc .pow.p4{grid-template-columns:repeat(4,minmax(0,1fr))} .doc .pwc{} .doc .pwc b{display:block;font-size:var(--fs-intro);margin-bottom:6px;color:var(--p-h)} .doc .pwc span{color:var(--p-b);font-size:var(--fs-body);line-height:var(--lh-body)} .doc .pwc i,.doc .crflow i{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;margin-bottom:10px;background:var(--p-vio);color:#fff;font-style:normal;font-weight:600;font-size:var(--fs-note)} .doc .gap{margin-top:22px;overflow:hidden;text-align:left} .doc .g-h,.doc .g-r{display:grid;grid-template-columns:1.1fr 1fr 1fr 1.2fr;gap:12px;padding:12px 16px;border-top:1px solid var(--p-line);align-items:center} .doc .gap.g4 .g-h,.doc .gap.g4 .g-r{grid-template-columns:.75fr 1fr 1fr 1fr} .doc .g-h{border-top:0;font-size:var(--fs-note);font-weight:600;color:var(--p-h)} .doc .g-h .us{color:var(--p-acc)} .doc .g-r b{color:var(--p-h);font-weight:600;font-size:var(--fs-body)} .doc .g-r span{color:var(--p-b);font-size:var(--fs-body)} .doc .g-r .us{color:var(--p-h);font-weight:600;border-left:2px solid var(--p-vio);padding-left:10px} .doc .paths3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:26px;text-align:left} .doc .jp{position:relative;display:flex;flex-direction:column;gap:10px;padding:22px 18px 18px} .doc .jp.hi{border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} .doc .jp .tag{position:absolute;top:-10px;left:14px;background:var(--amb);color:#1b0f02} .doc .jn{font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-lab)} .doc .jp .lam{width:30px;height:30px} .doc .jp h3{font-size:var(--fs-h3);margin:0} .doc .jp .jl{margin:0;color:var(--p-h);font-weight:600} .doc .jp p{margin:0;font-size:var(--fs-body)} .doc .jp .ticks{color:var(--p-b);font-size:var(--fs-small);margin-bottom:6px} .doc .jp>button,.doc .jp>a{align-self:flex-start;margin-top:auto} .doc .ej{grid-template-columns:44px 1fr;align-items:center;gap:10px 12px;padding:16px;background:var(--p-card);border-color:var(--p-line);box-shadow:var(--p-sh)} .doc .ej img{width:44px;height:44px;background:var(--p-ph);border-color:var(--p-vio)} .doc .ej div{display:grid} .doc .ej b{color:var(--p-h)} .doc .ej small{font:500 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-lab)} .doc .ej>span{grid-column:1/-1;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--p-h);font-style:normal} .doc .acta{display:grid;grid-template-columns:1.25fr .75fr;overflow:hidden;border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} .doc .acta-l{padding:28px} .doc .acta-l h2{margin-top:4px} .doc .acta-l p{margin:0} .doc .acta-r{padding:28px 24px;display:flex;flex-direction:column;justify-content:center;gap:10px;border-left:1px solid var(--p-line);background:var(--p-band)} .doc .acta-r>button{width:100%} .doc .acta-r p{font-size:var(--fs-note);text-align:center;margin:2px 0 0} .doc .acta-t{list-style:none;padding:0;margin:16px 0 0;display:grid;gap:8px} .doc .acta-t li{padding-left:26px;position:relative;color:var(--p-h);font-size:var(--fs-body)} .doc .acta-t li::before{content:"";position:absolute;left:0;top:4px;width:14px;height:14px;border-radius:50%;background:var(--p-vio)} .doc .acta-t li::after{content:"";position:absolute;left:4px;top:7px;width:5px;height:3px;border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg)} .doc .osline{margin:14px 0 0;font-size:var(--fs-btn)} .doc .osline b{color:var(--p-h)} .doc .oxs{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr) minmax(0,1fr);grid-template-areas:"a r d" "b r e";gap:14px 18px;align-items:center;margin-top:26px} .doc .oxa{grid-area:a} .doc .oxb{grid-area:b} .doc .oxd{grid-area:d} .doc .oxe{grid-area:e} .doc .oxring{grid-area:r;position:relative;aspect-ratio:1;display:grid;place-items:center} .doc .oxring svg{position:absolute;inset:0;width:100%;height:100%} .doc .oxring .r1{fill:none;stroke:var(--p-ora);stroke-width:1;stroke-dasharray:3 6} .doc .oxring .r2{fill:var(--p-card);stroke:var(--p-vio);stroke-width:1} .doc .oxring .rl{font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:.2em;fill:var(--p-lab)} .doc .oxcore{width:52%;text-align:center;display:grid;gap:6px;position:relative} .doc .oxcore small{font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:.2em;color:var(--p-acc)} .doc .oxcore b{font:600 clamp(15px,1.8vw,20px)/1.2 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} .doc .oxcore span{font-size:var(--fs-note);color:var(--p-b)} .doc .oxc{display:grid;gap:8px;padding:14px 16px} .doc .oxc .h{display:flex;align-items:center;gap:8px;font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);color:var(--p-b)} .doc .oxc .od{width:7px;height:7px;border-radius:50%;background:var(--p-vio)} .doc .oxc.o .od{background:var(--p-ora)} .doc .oxc .t{color:var(--p-h);font-size:var(--fs-body)} .doc .oxc .pl{justify-self:start;font-size:var(--fs-cap);font-weight:600;color:var(--p-lab);border:1px solid var(--p-line);border-radius:999px;padding:2px 9px} .doc .oxc .pl.g{color:var(--p-ok)} .doc .osx{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:20px} .doc .layer{display:flex;flex-direction:column;padding:20px 18px} .doc .layer .n{font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);color:var(--p-lab);margin-bottom:10px} .doc .layer h3{font-size:var(--fs-h4);margin:0 0 6px} .doc .layer p{margin:0 0 10px;font-size:var(--fs-body)} .doc .layer ul{margin:0;padding-left:18px;color:var(--p-b);font-size:var(--fs-small);line-height:var(--lh-body)} .doc .layer .more,.doc .part .more{all:unset;cursor:pointer;margin-top:auto;padding-top:12px;color:var(--p-acc);font-size:var(--fs-body);font-weight:600} .doc .layer .more:hover{text-decoration:underline} .doc .chain{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px;margin-top:22px} .doc .blk{position:relative;min-width:0;padding:16px 14px 14px;display:flex;flex-direction:column} .doc .blk:not(:last-child)::after{content:"";position:absolute;right:-21px;top:50%;width:20px;height:1px;background:var(--p-line)} .doc .blk:not(:last-child)::before{content:"";position:absolute;right:-14px;top:calc(50% - 3px);width:7px;height:7px;border-radius:50%;background:var(--p-vio);z-index:1} .doc .blk .bh{display:grid;grid-template-columns:1fr;row-gap:4px;font:var(--fs-label)/1.4 Geist Mono,ui-monospace,Menlo,monospace;color:var(--p-b)} .doc .blk .bh .ok{color:var(--p-ok)} .doc .blk .bh .mo{color:var(--p-lab)} .doc .blk h3{font-size:var(--fs-intro);margin:10px 0 6px} .doc .blk .hash{margin-top:auto!important} .doc .blk p{margin-bottom:12px!important} .doc .hnote{margin:14px 0 0;font-size:var(--fs-note);line-height:var(--lh-body);color:var(--p-b)} .doc .hnote a{color:var(--p-lab);font-weight:600;text-decoration:none} .doc .hnote a:hover{text-decoration:underline} .doc .blk p{margin:0;font-size:var(--fs-small);line-height:1.45} .doc .blk .hash{margin-top:12px;padding-top:8px;border-top:1px dashed var(--p-line);font:var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;color:var(--p-lab)} .doc .levels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:22px;text-align:left} .doc .lv{padding:18px} .doc .lv.now{border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} .doc .lv .bar{height:4px;border-radius:4px;background:var(--p-line);margin-bottom:14px;overflow:hidden} .doc .lv .bar i{display:block;height:100%;background:var(--p-vio)} .doc .lv .lt{display:block;font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-lab);margin-bottom:8px} .doc .lv p{margin:6px 0 0;font-size:var(--fs-body)} .doc .mh{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px;text-align:left} .doc .mh .hud.pad{padding:18px} .doc .mh p{font-size:var(--fs-body)} .doc .divs2{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px} .doc .dvx{all:unset;box-sizing:border-box;cursor:pointer;display:grid;gap:10px;align-content:start;padding:16px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} .doc .dvx:hover,.doc .dvx:focus-visible{border-color:var(--p-vio)} .doc .dvf2{display:flex} .doc .dvf2 img{width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--p-card);margin-right:-8px;background:var(--p-ph)} .doc .dvn{display:flex;align-items:center;gap:8px} .doc .dvn b{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h);display:inline-flex;align-items:center;gap:8px} .doc .dvn b::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--cc)} .doc .dvn i{margin-left:auto;font-style:normal;font:600 var(--fs-label)/1.4 Geist Mono,ui-monospace,Menlo,monospace;color:var(--p-b);border:1px solid var(--p-line);border-radius:999px;padding:1px 8px} .doc .dvt{font-size:var(--fs-small);line-height:var(--lh-body);color:var(--p-b)} .doc .arghero{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:26px;align-items:start;padding:22px} .doc .argbig{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 14%;border-radius:12px;border:1px solid var(--p-line);background:var(--p-ph)} .doc .arghero h1{margin-top:6px} .doc .lead2{font-size:var(--fs-intro);line-height:var(--lh-body);margin:0 0 14px;color:var(--p-b)} .doc .argroles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .doc .argroles>div{padding:12px 14px;display:flex;flex-direction:column;gap:3px;background:var(--p-band);box-shadow:none} .doc .argroles b{color:var(--p-h)} .doc .argroles span{font-size:var(--fs-small);color:var(--p-b);line-height:1.45} .doc .argsig{font:600 var(--fs-h3)/1.3 Poppins,Geist,system-ui,sans-serif;margin:16px 0 2px;color:var(--p-acc)} .doc .facts{display:grid;grid-template-columns:1fr 1fr;gap:12px} .doc .facts.f3{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:18px} .doc .fact{display:flex;flex-direction:column;justify-content:flex-end} .doc .fact b{display:block;font:700 clamp(32px,3.6vw,46px)/1 Poppins,Geist,system-ui,sans-serif;letter-spacing:-.02em;color:var(--p-acc)} .doc .fact span{display:block;margin-top:10px;color:var(--p-b);font-size:var(--fs-body);line-height:1.45} .doc .rules{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px} .doc .rules>div{padding:18px;display:grid;gap:6px;align-content:start} .doc .rules b{color:var(--p-h);font-size:var(--fs-btn)} .doc .rules span{color:var(--p-b);font-size:var(--fs-body);line-height:var(--lh-body)} .doc .soon.hud{border-color:var(--p-line);border-left:3px solid var(--amb)} .doc .soon h2{margin-top:10px} .doc .soon p{max-width:760px} .doc .pill{display:inline-block;font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-lab);border:1px solid var(--p-line);border-radius:999px;padding:4px 10px} .doc .crh{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:34px;align-items:center} .doc .crh h1{font-size:clamp(30px,3.6vw,44px);line-height:1.08} .doc .crh .row{margin-top:18px} .doc .crport{all:unset;box-sizing:border-box;cursor:pointer;position:relative;justify-self:center;width:100%;max-width:340px;aspect-ratio:3/4;border-radius:14px;overflow:hidden;border:1px solid var(--p-vio);background:var(--p-ph);box-shadow:var(--p-sh)} .doc .crport img{width:100%;height:100%;object-fit:cover;object-position:50% 14%;display:block} .doc .crbr{position:absolute;inset:12px;width:calc(100% - 24px);height:calc(100% - 24px);pointer-events:none} .doc .crbr path{fill:none;stroke:#fff;stroke-opacity:.85;stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linecap:round} .lite .doc .crbr path,html[data-skin="light"] .doc .crbr path{stroke:#7c3aed;stroke-opacity:1} .doc .crport>span{position:absolute;left:14px;bottom:14px;font:600 var(--fs-label)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-lab);background:var(--p-card);border:1px solid var(--p-line);border-radius:999px;padding:5px 11px} .doc .crflow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:22px 0 0;text-align:left;align-items:stretch;flex-wrap:nowrap} .doc .crflow>div{padding:18px 16px;font-size:inherit;text-align:left;flex:none} .doc .crflow b{display:block;margin-bottom:4px;color:var(--p-h)} .doc .crflow span{color:var(--p-b);font-size:var(--fs-body);line-height:var(--lh-body)} .doc .crfaces{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:12px;margin-top:22px;text-align:left} .doc .crface{all:unset;box-sizing:border-box;cursor:pointer;display:flex;flex-direction:column;overflow:hidden;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} .doc .crface:hover,.doc .crface:focus-visible{border-color:var(--p-vio)} .doc .crface img{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 15%;display:block;background:var(--p-ph);border-bottom:1px solid var(--p-line)} .doc .cfd{display:grid;gap:3px;padding:12px 14px 14px} .doc .cfd b{font-size:var(--fs-intro);color:var(--p-h)} .doc .cfd small{color:var(--p-b);font-size:var(--fs-note);line-height:1.4} .doc .cfd em{font-style:normal;font-size:10.5px;font-weight:700;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-lab);margin-top:4px} .doc .cfd em.free{color:var(--p-ok)} .doc .crface.lead{border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} .doc .crface.soon{border-style:dashed} .doc .about2{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:40px;align-items:start} .doc .about2 .facts{grid-auto-rows:minmax(160px,auto);margin-top:24px} .doc .din .sub2{font-size:clamp(18px,1.8vw,21px);color:var(--p-b);margin-top:0} .doc .values{margin-top:20px;display:grid} .doc .values div{padding:12px 0;border-top:1px solid var(--p-line);font-size:var(--fs-body)} .doc .values b{color:var(--p-h)} .doc .values span{color:var(--p-b)} .doc .trust{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:36px;font:600 var(--fs-label)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-b)} .doc .trust .wm svg{width:32px;height:22px} .doc .faq2{max-width:820px;margin:22px auto 0;display:grid;gap:10px} .doc .faq2 details{background:var(--p-card);border:1px solid var(--p-line);border-radius:12px;padding:0 16px;box-shadow:var(--p-sh)} .doc .faq2 details[open]{border-color:var(--p-vio)} .doc .faq2 summary{list-style:none;cursor:pointer;padding:14px 36px 14px 0;font-size:var(--fs-intro);font-weight:600;position:relative;color:var(--p-h)} .doc .faq2 summary::-webkit-details-marker{display:none} .doc .faq2 summary::after{content:"+";position:absolute;right:2px;top:9px;font-size:24px;font-weight:400;color:var(--p-acc);transition:transform .2s} .doc .faq2 details[open] summary::after{transform:rotate(45deg)} .doc .faq2 details p{margin:0;padding:0 0 16px;max-width:720px;color:var(--p-b)} .lite .doc .ghostb,html[data-skin="light"] .doc .ghostb{color:var(--p-h);border-color:#e3dcec} .lite .doc .chips span,html[data-skin="light"] .doc .chips span{color:var(--p-b);border-color:var(--p-line)} @container doc (max-width:1000px){ .doc .divs2,.doc .rules{grid-template-columns:repeat(2,minmax(0,1fr))} .doc .pow{grid-template-columns:repeat(3,minmax(0,1fr))} .doc .pow.p4,.doc .osx,.doc .crflow{grid-template-columns:repeat(2,minmax(0,1fr))} .doc .chain{grid-template-columns:repeat(3,minmax(0,1fr))} .doc .blk::before,.doc .blk::after{display:none} } @container doc (max-width:860px){ .doc .hx,.doc .mb,.doc .arghero,.doc .about2,.doc .acta,.doc .crh{grid-template-columns:1fr} .doc .hx-card{max-width:340px} .doc .mb{padding:20px 18px;gap:20px} .doc .arghero{padding:16px} .doc .argbig{max-height:420px} .doc .divs2,.doc .rules,.doc .levels,.doc .argroles,.doc .facts.f3,.doc .pow,.doc .pow.p3,.doc .pow.p4,.doc .paths3,.doc .osx,.doc .chain,.doc .mh,.doc .crflow{grid-template-columns:1fr} .doc .acta-r{border-left:0;border-top:1px solid var(--p-line)} .doc .acta-l,.doc .acta-r{padding:22px 18px} .doc .g-h{display:none} .doc .g-r,.doc .gap.g4 .g-r{grid-template-columns:1fr;gap:6px;padding:14px 16px} .doc .g-r:first-of-type{border-top:0} .doc .g-r span[data-l]::before{content:attr(data-l);display:block;font:600 var(--fs-label-s)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-b);margin-bottom:2px} .doc .g-r .us[data-l]::before{color:var(--p-acc)} .doc .hud.pad{padding:18px} .doc .oxs{grid-template-columns:1fr 1fr;grid-template-areas:"r r" "a b" "d e"} .doc .oxring{max-width:320px;width:100%;justify-self:center} .doc .crport{max-width:300px} .doc .crfaces{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} } @container doc (max-width:420px){ .doc .oxs{grid-template-columns:1fr;grid-template-areas:"r" "a" "b" "d" "e"} } .doc .dtool .sub{justify-content:safe center} .doc .wmrow .wmlogo{display:block;width:100%;max-width:520px;height:auto;margin:6px 0 2px} .doc .wmrow .wmlogo.ink{display:none} .lite .doc .wmrow .wmlogo,html[data-skin="light"] .doc .wmrow .wmlogo{display:none} .lite .doc .wmrow .wmlogo.ink,html[data-skin="light"] .doc .wmrow .wmlogo.ink{display:block} .doc .mb .k{font:600 var(--fs-note)/1.45 Geist,system-ui,sans-serif;letter-spacing:0;text-transform:none;color:var(--p-ora)} .doc .argsig{margin-top:22px!important} .doc .sec.hc>.k,.doc .sec.hc>h2,.doc .sec.hc>.lede{display:block;text-align:center} .doc .sec.hc>.lede{margin-left:auto;margin-right:auto} .doc .argroles{margin-top:18px} .doc .talkto h2{margin-top:0} .doc .talkto p{max-width:760px} /* ===== CREW PROFILE: one source for the profile panel in the App and the Academy (always dark, like the side panels) ===== */ .aprof{font:14px/1.55 Geist,"Segoe UI",system-ui,sans-serif;color:#f3eaff} .aprof h2{margin:0;font:700 24px Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .aprof .prole{margin:4px 0;color:#d9cff0} .aprof .pm{margin:0 0 8px;color:#a99cc8;font-style:italic;font-size:13px} .aprof .ptag{display:inline-block;font:600 11px Geist,system-ui,sans-serif;color:#F7931A;border:1px solid rgba(247,147,26,.45);border-radius:999px;padding:2px 9px} .aprof .ptag.own{color:#3ddc97;border-color:rgba(61,220,151,.45)} .aprof .pbig{width:var(--cardw,202px);max-width:100%;height:auto;aspect-ratio:3/4;border-radius:14px;object-fit:cover;object-position:50% 15%;border:1px solid #8b5cf6;display:block;margin:6px 0 14px;box-sizing:border-box} .aprof h4{margin:18px 0 6px;font:600 10.5px Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:#F7931A} .aprof p{margin:0;color:#d9cff0;line-height:1.55} .aprof ul{margin:0;padding-left:18px;color:#d9cff0;display:grid;gap:4px} .aprof .pcmd{display:grid;gap:6px} .aprof .pcmd button,.aprof .pcmd span{display:block;font:13px/1.55 Geist,"Segoe UI",system-ui,sans-serif;color:#f3eaff;background:#1b1229;border:1px solid #2a1f3d;border-radius:10px;padding:8px 10px;margin:0;text-align:left} .aprof .pcmd button{cursor:pointer} .aprof .psig{margin-top:18px;color:#f3eaff;font-style:italic} .aprof .pbtns,.aprof p:has(>.pww){display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 0} .aprof .pww,.aprof .bmain{display:block;font:600 14px/1.45 Geist,system-ui,-apple-system,"Segoe UI",sans-serif;color:#fff;background:#7c3aed;border:1px solid #7c3aed;border-radius:10px;padding:8px 12px;margin:0;text-align:center;cursor:pointer;text-decoration:none} .aprof .pww:hover,.aprof .bmain:hover{background:#6d28d9} .aprof .pbtn{display:block;font:14px/1.45 Geist,system-ui,-apple-system,"Segoe UI",sans-serif;color:#f3eaff;background:#1b1229;border:1px solid #2a1f3d;border-radius:10px;padding:8px 12px;margin:0;cursor:pointer;text-decoration:none} .aprof .pbtn:hover{border-color:#8b5cf6} /* ===== PAGE MENU: one source for the page menu in the App and the Academy (each platform maps the three colour tokens) ===== */ .apnav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;min-width:0} .apnav::-webkit-scrollbar{display:none} .apnav button{background:transparent!important;border:1px solid var(--u-line,#2a1f3d)!important;border-radius:10px!important;padding:6px 10px!important;margin:0;color:var(--u-mut,#c4b8e0);font:500 13px/1.45 Geist,system-ui,-apple-system,"Segoe UI",sans-serif;white-space:nowrap;cursor:pointer;transition:color .2s,border-color .2s} .apnav button:hover{color:var(--u-h,#f3eaff);border-color:#8b5cf6!important} .apnav button.on{color:var(--u-h,#f3eaff);border-color:#F7931A!important} .lite .apnav button.on,html[data-skin="light"] .apnav button.on{background:#fff!important} /* ===== PRICE CARDS (v12if, Richard 8 Nov 2026): one card style for the App and the Academy. Each platform keeps its own plans and contents. ===== */ :where(.doc) .plw{margin-top:18px} :where(.doc) .bill{display:flex;width:max-content;margin:0 auto 22px;padding:4px;gap:4px;border:1px solid var(--p-line);border-radius:999px;background:var(--p-card)} :where(.doc) .bill button{font:600 var(--fs-note)/1 Geist,system-ui,sans-serif;color:var(--p-b);background:none;border:0;border-radius:999px;padding:9px 16px;cursor:pointer;min-height:0} :where(.doc) .bill button b{font-weight:600;color:var(--p-ok);margin-left:4px} :where(.doc) .bill button.on{background:var(--p-vio);color:#fff} :where(.doc) .bill button.on b{color:#fff} :where(.doc) .pcards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch} @container doc (max-width:900px){:where(.doc) .pcards{grid-template-columns:repeat(2,minmax(0,1fr))}} @container doc (max-width:560px){:where(.doc) .pcards{grid-template-columns:1fr}} :where(.doc) .pcx{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0;padding:20px 16px 16px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh);color:var(--p-h)} :where(.doc) .pcx.hi{border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} :where(.doc) .pcx .tag{position:absolute;top:-10px;left:14px;background:var(--p-lab);color:#1b0f02} :where(.doc) .pcx .pn{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .pcx .lfree{color:var(--p-ok);border-color:color-mix(in srgb,var(--p-ok) 45%,transparent)} :where(.doc) .pcx .pp{font:700 30px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h);margin-top:2px} :where(.doc) .pcx .pp s{font:500 var(--fs-intro)/1 Geist,system-ui,sans-serif;color:var(--p-b);margin-right:8px} :where(.doc) .pcx .pp small{font:500 var(--fs-note)/1 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .pcx .po{margin:0;font:var(--fs-cap)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b);min-height:1.45em} :where(.doc) .pcx .pt{font:600 var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-lab);padding-bottom:10px;border-bottom:1px solid var(--p-line)} :where(.doc) .pcx .tk{list-style:none;margin:2px 0 6px;padding:0;display:grid;gap:7px} :where(.doc) .pcx .tk li{position:relative;padding-left:20px;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .pcx .tk li::before{content:"✓";position:absolute;left:0;top:0;color:var(--p-ok);font-weight:700} :where(.doc) .pcx .tk b{color:var(--p-h);font-weight:600} :where(.doc) .pcx .ag{font-size:var(--fs-cap)} :where(.doc) .pcx > button,:where(.doc) .pcx > span.m,:where(.doc) .pcx > span.y{margin-top:auto} :where(.doc) .pcx button{width:100%} :where(.doc) .plw .y{display:none} :where(.doc) .plw.yr .y{display:block} :where(.doc) .plw.yr .m{display:none} :where(.doc) .plw.yr .pp.y{display:block} :where(.doc) .soon{color:var(--p-lab);border:1px solid color-mix(in srgb,var(--p-lab) 45%,transparent);margin-left:4px;vertical-align:1px} :where(.doc) .note.sp{font-size:var(--fs-cap);line-height:var(--lh-ui)} :where(.doc) .why{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:18px} @container doc (max-width:760px){:where(.doc) .why{grid-template-columns:1fr}} :where(.doc) .why>div{background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;padding:16px;box-shadow:var(--p-sh)} :where(.doc) .why b{display:block;font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .why p{margin:6px 0 0;font:var(--fs-note)/var(--lh-body) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .cmp.vs td:not(:first-child),:where(.doc) .cmp.vs th:not(:first-child){text-align:center;width:16%} :where(.doc) .cmp.vs .y1{color:var(--p-ok);font-weight:700} :where(.doc) .cmp.vs .n1{color:var(--p-b);opacity:.6} :where(.doc) .cmp.vs .d1{font-size:var(--fs-cap);color:var(--p-b)} /* v12ig: releasing-soon card in the gold dotted outline, top-up blocks, the Arguta column highlighted in the comparison */ :where(.doc) .pcx.rs{border:1.5px dashed color-mix(in srgb,var(--p-lab) 70%,transparent);box-shadow:none;background:color-mix(in srgb,var(--p-lab) 4%,var(--p-card))} :where(.doc) .pcx .tag.rs{background:var(--p-card);color:var(--p-lab);border:1px solid color-mix(in srgb,var(--p-lab) 70%,transparent)} :where(.doc) .tops{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px} @container doc (max-width:760px){:where(.doc) .tops{grid-template-columns:repeat(2,minmax(0,1fr))}} :where(.doc) .top{display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;padding:18px 14px 14px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} :where(.doc) .top b{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .top .tp{font:700 30px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .top .tj{font:var(--fs-cap)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b);margin-bottom:6px} :where(.doc) .top button{width:100%;margin-top:auto} .doc .sec.hc>.lede{max-width:680px} .doc .row.ctrr{justify-content:center} :where(.doc) .cmp.vs{margin-top:26px;margin-bottom:8px;border-collapse:separate;border-spacing:0} :where(.doc) .cmp.vs th:nth-child(2),:where(.doc) .cmp.vs td:nth-child(2){background:color-mix(in srgb,var(--p-vio) 12%,transparent);border-left:2px solid var(--p-vio);border-right:2px solid var(--p-vio)} :where(.doc) .cmp.vs th:nth-child(2){border-top:2px solid var(--p-vio);border-radius:12px 12px 0 0;color:var(--p-h)} :where(.doc) .cmp.vs tbody tr:last-child td:nth-child(2){border-bottom:2px solid var(--p-vio);border-radius:0 0 12px 12px} :where(.doc) .cmp.vs + .note{margin-top:16px;margin-bottom:6px} :where(.doc) .pcx .pt{display:flex;flex-direction:column;gap:2px} :where(.doc) .pcx .pa{font:600 var(--fs-intro)/1.2 Poppins,Geist,system-ui,sans-serif;color:var(--p-lab)} :where(.doc) .pcx .pa b{font:700 30px/1 Poppins,Geist,system-ui,sans-serif;margin-right:4px} :where(.doc) .pcx .pj{font:600 var(--fs-body)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-h)} .doc .sec.hc>.lede+.cmp{margin-top:22px} .doc .row.ctrr{margin-top:18px} :where(.doc) .cmp.vs .pr1{font-weight:700;color:var(--p-h)} /* v12ii: Our guarantee, the simple version for every page */ :where(.doc) .gtee{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px} @container doc (max-width:860px){:where(.doc) .gtee{grid-template-columns:repeat(2,minmax(0,1fr))}} @container doc (max-width:520px){:where(.doc) .gtee{grid-template-columns:1fr}} :where(.doc) .gtee>div{padding:16px;border:1px solid var(--p-line);border-top:3px solid var(--p-ok);border-radius:14px;background:var(--p-card);box-shadow:var(--p-sh);text-align:center} :where(.doc) .gtee b{display:block;font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .gtee p{margin:6px 0 0;font:var(--fs-note)/var(--lh-body) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .note.ctrn a{color:var(--p-acc)} /* v12ii: Account, move up or down */ :where(.doc) .mvp{display:grid;gap:10px;margin-top:22px} :where(.doc) .mv{display:grid;grid-template-columns:1.2fr 1fr 1fr 1.4fr;gap:12px;align-items:center;padding:14px 16px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} :where(.doc) .mv.on{border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} :where(.doc) .mv.rs:not(.on){border:1.5px dashed color-mix(in srgb,var(--p-lab) 70%,transparent);box-shadow:none} @container doc (max-width:760px){:where(.doc) .mv{grid-template-columns:1fr 1fr}} :where(.doc) .mvn{display:flex;align-items:center;gap:8px;flex-wrap:wrap} :where(.doc) .mvn b{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .mvd,:where(.doc) .mvp2{display:flex;flex-direction:column;gap:2px;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .mvd b{color:var(--p-lab);font-size:var(--fs-intro)} :where(.doc) .mvp2 span:first-child{color:var(--p-h);font-weight:600} :where(.doc) .mvb{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end} :where(.doc) .mvb button{min-height:36px;border-radius:10px;padding:0 12px} /* v12ii: Account summary tiles */ :where(.doc) .acx{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:8px} @container doc (max-width:900px){:where(.doc) .acx{grid-template-columns:repeat(2,minmax(0,1fr))}} @container doc (max-width:520px){:where(.doc) .acx{grid-template-columns:1fr}} :where(.doc) .acc{display:flex;flex-direction:column;gap:8px;box-shadow:var(--p-sh);min-width:0} :where(.doc) .acc .k{margin:0} :where(.doc) .acc .acv{font:700 24px/1.15 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .acc .acv small{font:500 var(--fs-note)/1 Geist,system-ui,sans-serif;color:var(--p-b);margin-left:4px} :where(.doc) .acc p{margin:0;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acbar{height:6px;border-radius:999px;background:color-mix(in srgb,var(--p-line) 80%,transparent);overflow:hidden} :where(.doc) .acbar i{display:block;height:100%;background:linear-gradient(90deg,#4c1d95,#7c3aed);border-radius:999px} :where(.doc) .acb{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:4px} :where(.doc) .acb button,:where(.doc) .acb a{min-height:36px} :where(.doc) .pcards.p3{grid-template-columns:repeat(3,minmax(0,1fr))} @container doc (max-width:760px){:where(.doc) .pcards.p3{grid-template-columns:1fr}} /* v12ij: Our guarantee, in its own box. Reusable on the App, Academy and website (section.gbx inside .doc). */ :where(.doc) .sec.gbx{border-top:0;padding:30px 28px 22px;margin-top:44px;border:1px solid var(--p-line);border-radius:18px;background:linear-gradient(180deg,color-mix(in srgb,var(--p-ok) 7%,var(--p-card)),var(--p-card) 55%);box-shadow:var(--p-sh);position:relative;overflow:hidden} :where(.doc) .sec.gbx::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,var(--p-ok),var(--p-vio))} :where(.doc) .gbx-h{text-align:center} :where(.doc) .gbx-h .k,:where(.doc) .gbx-h h2{display:block} :where(.doc) .gbx-h .lede{max-width:640px;margin:8px auto 0} :where(.doc) .gbx-g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:26px;border-top:1px solid var(--p-line)} @container doc (max-width:860px){:where(.doc) .gbx-g{grid-template-columns:repeat(2,minmax(0,1fr))}} @container doc (max-width:520px){:where(.doc) .gbx-g{grid-template-columns:1fr}} :where(.doc) .gbx-g>div{padding:22px 18px 8px;text-align:center;border-right:1px solid var(--p-line)} :where(.doc) .gbx-g>div:last-child{border-right:0} :where(.doc) .gbx-n{display:block;font:700 30px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-ok);margin-bottom:6px} :where(.doc) .gbx-g b{display:block;font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .gbx-g p{margin:6px 0 0;font:var(--fs-note)/var(--lh-body) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .gbx-f{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 18px;margin-top:20px;padding-top:14px;border-top:1px solid var(--p-line);font:var(--fs-cap)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .gbx-f a{color:var(--p-acc);font-weight:600;text-decoration:none} :where(.doc) .gbx-h .lede{text-align:center} @container doc (max-width:860px){:where(.doc) .gbx-g>div:nth-child(2n){border-right:0}:where(.doc) .gbx-g>div:nth-child(n+3){border-top:1px solid var(--p-line)}} @container doc (max-width:520px){:where(.doc) .gbx-g>div{border-right:0}:where(.doc) .gbx-g>div+div{border-top:1px solid var(--p-line)}} .doc .din .gbx-h .lede{margin:8px auto 0;text-align:center;max-width:640px} /* v12ik: four-column comparison, both Arguta columns in one purple box */ :where(.doc) .cmp.v4 td:not(:first-child),:where(.doc) .cmp.v4 th:not(:first-child){width:15%} :where(.doc) .cmp.v4 th:nth-child(2),:where(.doc) .cmp.v4 td:nth-child(2){border-right:0} :where(.doc) .cmp.v4 th:nth-child(2){border-radius:12px 0 0 0} :where(.doc) .cmp.v4 tbody tr:last-child td:nth-child(2){border-radius:0 0 0 12px} :where(.doc) .cmp.v4 .hl2{background:color-mix(in srgb,var(--p-vio) 7%,transparent);border-right:2px solid var(--p-vio)} :where(.doc) .cmp.v4 th.hl2{border-top:2px solid var(--p-vio);border-radius:0 12px 0 0;color:var(--p-h)} :where(.doc) .cmp.v4 tbody tr:last-child td.hl2{border-bottom:2px solid var(--p-vio);border-radius:0 0 12px 0} :where(.doc) .cmp.vs small.d1{display:block;font-size:11px;margin-top:2px} /* v12im: Academy Plans and Account (same parts as the App) */ :where(.doc) .nllife{display:grid;grid-template-columns:1.6fr 1fr;gap:20px;align-items:center;margin:8px 0 26px;padding:22px 24px;border:1px solid color-mix(in srgb,var(--p-lab) 55%,transparent);border-radius:16px;background:linear-gradient(135deg,color-mix(in srgb,var(--p-lab) 10%,var(--p-card)),var(--p-card) 60%);box-shadow:var(--p-sh)} @container doc (max-width:760px){:where(.doc) .nllife{grid-template-columns:1fr}} :where(.doc) .nllife h2{margin:4px 0 8px} :where(.doc) .nllife p{margin:0;font:var(--fs-note)/var(--lh-body) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .nll-r{display:flex;flex-direction:column;align-items:flex-start;gap:6px} :where(.doc) .nll-r .pp{font:700 34px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .nll-r .pp s{font:500 var(--fs-intro)/1 Geist,system-ui,sans-serif;color:var(--p-b);margin-right:8px} :where(.doc) .nll-r .pp small{font:500 var(--fs-note)/1 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .nll-r .po{margin:0;font:var(--fs-cap)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .nll-r button{width:100%;min-height:44px;margin-top:4px} :where(.doc) .soonbox{position:relative;margin-top:22px;padding:22px 14px 14px;border:1.5px dashed color-mix(in srgb,var(--p-lab) 70%,transparent);border-radius:16px} :where(.doc) .soonlab{position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--p-card);color:var(--p-lab);border:1px solid color-mix(in srgb,var(--p-lab) 70%,transparent)} :where(.doc) .soonbox .pcx.rs{border-style:solid;border-width:1px;border-color:var(--p-line);background:var(--p-card)} :where(.doc) .soonbox .pcx .tag.rs{display:none} :where(.doc) .pcards.p2{grid-template-columns:repeat(2,minmax(0,1fr))} :where(.doc) .pcards.p5{grid-template-columns:repeat(5,minmax(0,1fr))} @container doc (max-width:980px){:where(.doc) .pcards.p5{grid-template-columns:repeat(3,minmax(0,1fr))}} @container doc (max-width:620px){:where(.doc) .pcards.p2,:where(.doc) .pcards.p5{grid-template-columns:1fr}} :where(.doc) .mxwrap{overflow-x:auto;margin-top:22px} :where(.doc) .cmp.mx{min-width:720px} :where(.doc) .cmp.mx td:not(:first-child),:where(.doc) .cmp.mx th:not(:first-child){text-align:center} :where(.doc) .cmp.mx .hl1{background:color-mix(in srgb,var(--p-vio) 10%,transparent)} :where(.doc) .cmp.mx tr.g td{font:600 var(--fs-label)/1.4 Geist Mono,ui-monospace,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-lab);background:color-mix(in srgb,var(--p-lab) 6%,transparent)} :where(.doc) .cmp.mx s.was{color:var(--p-b);margin-right:4px} :where(.doc) .cmp.mx small.d1{display:block;color:var(--p-lab)} .doc .row.ctrr{display:flex;gap:10px;flex-wrap:wrap} /* v12im: the comparison table base, moved into the master so the Academy matches the App */ :where(.doc) table.cmp{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--cl);border-radius:14px;overflow:hidden;margin-top:10px;font-size:14px} :where(.doc) .cmp th,:where(.doc) .cmp td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--cl);color:var(--ct);vertical-align:top} :where(.doc) .cmp th{background:var(--cb);font-weight:600} :where(.doc) .cmp tr:last-child td{border-bottom:0} :where(.doc) .cmp td:first-child{color:var(--cm)} :where(.doc) .cmp small{color:var(--cm)} :where(.doc) .cmp.mx th,:where(.doc) .cmp.mx td{padding:8px 10px;font-size:13px} :where(.doc) .cmp.vs td:not(:first-child),:where(.doc) .cmp.vs th:not(:first-child),:where(.doc) .cmp.mx td:not(:first-child),:where(.doc) .cmp.mx th:not(:first-child){text-align:center} /* v12in: Academy cards four across like the App; VIP on its own row in the Releasing soon box, with room around it */ :where(.doc) .soonbox.vipbox{margin-top:44px;padding:30px 22px 22px;background:color-mix(in srgb,var(--p-lab) 4%,var(--p-card))} :where(.doc) .vipw{display:grid;grid-template-columns:1fr 1.7fr .9fr;gap:24px;align-items:start} @container doc (max-width:760px){:where(.doc) .vipw{grid-template-columns:1fr}} :where(.doc) .vipw .pn{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h);display:block;margin-bottom:8px} :where(.doc) .vipw .pp{font:700 30px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .vipw .pp small{font:500 var(--fs-note)/1 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .vipw .pt{display:flex;flex-direction:column;gap:2px;margin-top:10px} :where(.doc) .vipw .pa{font:600 var(--fs-intro)/1.2 Poppins,Geist,system-ui,sans-serif;color:var(--p-lab)} :where(.doc) .vipw .pa b{font:700 30px/1 Poppins,Geist,system-ui,sans-serif;margin-right:4px} :where(.doc) .vipw .pj{font:600 var(--fs-body)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .vipw .tk{list-style:none;margin:0;padding:0;display:grid;gap:7px} :where(.doc) .vipw .tk li{position:relative;padding-left:20px;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .vipw .tk li::before{content:"✓";position:absolute;left:0;color:var(--p-ok);font-weight:700} :where(.doc) .vipw .tk b{color:var(--p-h)} :where(.doc) .vw3{display:flex;flex-direction:column;gap:12px} :where(.doc) .vw3 .po{margin:0;font:var(--fs-cap)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .vw3 button{width:100%;min-height:40px} :where(.doc) .plw .pcards+.soonbox{margin-top:44px} :where(.doc) .plw .pp.y{display:none} :where(.doc) .plw.yr .pp.y{display:block} :where(.doc) .plw.yr .pp.m{display:none} :where(.doc) .plw+.note.sp{margin-top:26px} :where(.doc) .vipw .pp s{font:500 var(--fs-intro)/1 Geist,system-ui,sans-serif;color:var(--p-b);margin-right:8px} .doc.acct .din{padding-bottom:22px} /* v12ip: legal footer at the base of the left column (App, Academy, course, Studio, admin) */ .lfoot{margin-top:auto;padding:12px 14px 14px;border-top:1px solid rgba(139,92,246,.18);font:11px/1.5 Geist,system-ui,sans-serif;color:#8f84ab} .lfoot .lfl{display:flex;flex-wrap:wrap;gap:4px 14px;margin-bottom:6px} .lfoot a{color:#c9b8ec;text-decoration:none;font-weight:600} .lfoot a:hover{color:#fff;text-decoration:underline} .lfoot p{margin:0 0 4px} html[data-skin="light"] .lfoot,.lite .lfoot{color:#6b6280;border-top-color:#e9e4ef} html[data-skin="light"] .lfoot a,.lite .lfoot a{color:#5b21b6} /* v12ip: Policies page */ :where(.doc) .poltabs{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:6px auto 22px} :where(.doc) .poltabs button{min-height:34px;padding:0 14px;border-radius:10px;border:1px solid var(--cl);background:transparent;color:var(--ct);font:500 13px/1 Geist,system-ui,sans-serif} :where(.doc) .poltabs button.on{border-color:var(--amb);color:var(--ct);box-shadow:0 0 0 1px var(--amb) inset} :where(.doc) .polbody{max-width:760px;margin:0 auto} :where(.doc) .polsec{color:var(--cm);font:var(--fs-body)/var(--lh-body) Geist,system-ui,sans-serif} :where(.doc) .polsec .polh{font:700 26px/1.2 Poppins,Geist,system-ui,sans-serif;color:var(--ct);margin:0 0 4px;text-align:left} :where(.doc) .polsec h2:not(.polh){font:600 var(--fs-h3)/1.3 Poppins,Geist,system-ui,sans-serif;color:var(--ct);margin:26px 0 8px;text-align:left} :where(.doc) .polsec h3{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--ct);margin:20px 0 6px} :where(.doc) .polsec p,:where(.doc) .polsec li{margin:0 0 10px} :where(.doc) .polsec ul{padding-left:20px;margin:0 0 12px} :where(.doc) .polsec a{color:var(--p-acc)} :where(.doc) .polsec table{width:100%;border-collapse:collapse;margin:8px 0 14px;font-size:13px} :where(.doc) .polsec th,:where(.doc) .polsec td{border-bottom:1px solid var(--cl);padding:8px;text-align:left;vertical-align:top} :where(.doc) .polsec button{min-height:38px;padding:0 16px;border-radius:10px} .doc .dtool .poltabs{margin:0} .doc .din.pol .polbody{margin-top:26px} /* v12ip: Studio policies overlay over the stage */ .polo{position:absolute;inset:0;z-index:30;overflow:auto;background:#140d1f;border-radius:16px} html[data-skin="light"] .polo{background:#fff} .polo .polx{position:sticky;top:12px;float:right;margin:12px 14px 0 0;z-index:2;min-height:34px;padding:0 14px;border-radius:10px;border:1px solid rgba(139,92,246,.4);background:#1b1229;color:#f3eaff;cursor:pointer} .stage{position:relative} /* v12ir: two lines above the footer on every platform: the panel above it, then the footer's own top line */ aside.left > .lfoot{margin-top:10px} /* v12iw: one Preview as control for every platform (Academy second bar and App second bar), from this sheet only */ .pvas,html.nl .nlbar .viewas{display:inline-flex;align-items:center;gap:8px;margin:0;padding:0;font:400 14px Geist,system-ui,sans-serif;color:#a99cc8;white-space:nowrap} .pvas select,html.nl .nlbar .viewas select{font:400 14px Geist,system-ui,sans-serif;color:#f3eaff;background:#1b1229;border:1px solid #2a1f3d;border-radius:10px;padding:6px 8px;margin:0;height:auto;min-width:177px;cursor:pointer} .lite .pvas,html[data-skin="light"] .pvas{color:#6b6280} .lite .pvas select,html[data-skin="light"] .pvas select{background:#fff;color:#1b1325;border-color:#e3dcec} /* v12ix: Connect your crew panel on Account (Academy), from the master sheet */ :where(.doc) .acnx{display:grid;gap:12px;margin:8px 0 12px;padding:18px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} :where(.doc) .acnx.cx-todo{border-color:#f7931a;box-shadow:0 0 0 1px rgba(247,147,26,.35),0 0 28px rgba(247,147,26,.22)} :where(.doc) .acnx.cx-on{border-color:rgba(46,204,113,.55)} :where(.doc) .acnx .cxh{display:grid;gap:6px} :where(.doc) .acnx .k{margin:0} :where(.doc) .acnx p{margin:0;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acnx .acv{display:flex;align-items:center;gap:8px} :where(.doc) .acnx .cxd{width:10px;height:10px;border-radius:50%;background:#f7931a;flex:none} :where(.doc) .acnx.cx-on .cxd{background:#2ecc71} :where(.doc) .acnx.cx-off .cxd{background:#ff6b6b} :where(.doc) .acnx .cxs{margin:0;padding-left:20px;display:grid;gap:6px;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acnx .cxl{display:grid;gap:8px;padding:12px;border:1px solid rgba(46,204,113,.6);border-radius:12px} :where(.doc) .acnx .cxl code{display:block;word-break:break-all;font-size:13px;padding:10px;border-radius:10px;background:#0d0a12;border:1px solid rgba(163,91,255,.5);color:#f3eaff} :where(.doc) .acnx .acb{display:flex;flex-wrap:wrap;gap:8px} :where(.doc) .acnx form{margin:0} /* v12iz: Account, the licence to accept (under Connect your crew) and the tidy records rows */ :where(.doc) .acag{display:grid;gap:12px;margin:0 0 12px;padding:18px;background:var(--p-card);border:1px solid #f7931a;border-radius:14px;box-shadow:0 0 0 1px rgba(247,147,26,.35),0 0 28px rgba(247,147,26,.22)} :where(.doc) .acag .cxh{display:grid;gap:6px} :where(.doc) .acag .k{margin:0} :where(.doc) .acag .acv{display:flex;align-items:center;gap:8px;font:700 24px/1.15 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .acag .cxd{width:10px;height:10px;border-radius:50%;background:#f7931a;flex:none} :where(.doc) .acag p,:where(.doc) .agc{margin:0;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .agt{max-height:260px;overflow:auto;padding:12px 14px;border:1px solid var(--p-line);border-radius:12px;background:color-mix(in srgb,var(--p-card) 60%,transparent);display:grid;gap:8px} :where(.doc) .agt p{margin:0;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .agc{display:flex;align-items:center;gap:10px;color:var(--p-h);font-weight:600;cursor:pointer} :where(.doc) .agc input{width:20px;height:20px;accent-color:var(--p-vio);flex:none} :where(.doc) .acag .agn{font-size:12px;opacity:.8} :where(.doc) .acwarn{color:#f7931a!important;font-weight:600} :where(.doc) .acrec{display:grid;gap:8px;margin-top:12px} :where(.doc) .acnote{padding:12px 16px;border:1px solid rgba(247,147,26,.55);border-radius:14px;background:var(--p-card);font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acrow{background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} :where(.doc) .acrow>summary{display:flex;align-items:center;gap:12px;padding:12px 16px;cursor:pointer;list-style:none;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acrow>summary::-webkit-details-marker{display:none} :where(.doc) .acrow>summary::after{content:"+";margin-left:auto;font-size:18px;color:var(--p-lab)} :where(.doc) .acrow[open]>summary::after{content:"\2212"} :where(.doc) .acrow>summary b{color:var(--p-h);font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif} :where(.doc) .acrb{display:grid;gap:8px;padding:0 16px 14px} :where(.doc) .acrn{margin:0;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acgr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px 16px} @container doc (max-width:760px){:where(.doc) .acgr{grid-template-columns:1fr 1fr}} @container doc (max-width:520px){:where(.doc) .acgr{grid-template-columns:1fr}} :where(.doc) .acgr div{display:flex;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px solid var(--p-line);font:var(--fs-note)/1.3 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acgr b{color:var(--p-h)} :where(.doc) .aud{display:grid;grid-template-columns:150px 1fr;gap:12px;padding:7px 0;border-bottom:1px solid var(--p-line);font:var(--fs-note)/1.35 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .aud b{color:var(--p-h)} :where(.doc) .aud small{display:block;opacity:.75;font-family:ui-monospace,monospace;font-size:11px} :where(.doc) .audk>summary{cursor:pointer;list-style:none} :where(.doc) .audk>summary::-webkit-details-marker{display:none} :where(.doc) .audk>.aud{padding-left:24px} @container doc (max-width:520px){:where(.doc) .aud{grid-template-columns:1fr;gap:2px}} :where(.doc) .acdev{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;border:1px solid var(--p-line);border-radius:10px;font:var(--fs-note)/1.35 Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .acdev small{display:block;color:var(--p-b)} :where(.doc) .acdev button{min-height:32px} /* v12ja (Richard, 9 Nov 2026): SPACING RULE for every page. A heading group (label, title, intro line) always has clear space before the blocks under it. Set here once so no page needs it by hand. */ .doc{--sp-head:24px;--sp-block:16px;--sp-sec:48px} :where(.doc) .pgh{margin-bottom:var(--sp-head)} :where(.doc) .din :is(h1,h2,.lede,.lead)+:is(div,section,form,details,table,ul,ol,nav,figure,iframe){margin-top:var(--sp-head)} :where(.doc) .din .sec>:is(.lede,h2):last-child{margin-bottom:var(--sp-head)} :where(.doc) .din .sec>.k+h2{margin-top:6px} :where(.doc) .din .sec>h2+.lede{margin-top:8px} :where(.doc) .sec{margin-top:var(--sp-sec)} :where(.doc) .acnx,:where(.doc) .acag{margin:0 0 var(--sp-block)} :where(.doc) .acrec{margin-top:var(--sp-block);gap:10px} .doc.acct .din{padding-bottom:64px} /* v12jb: Feed. The To do box, the plan and price tiles, the news posts */ :where(.doc) .fdo{display:grid;gap:0;margin:0 0 var(--sp-block);box-shadow:0 0 0 1px rgba(247,147,26,.3),0 0 24px rgba(247,147,26,.18)} :where(.doc) .fdo>.k{margin:0 0 6px} :where(.doc) .tdr{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;padding:12px 0;border-top:1px solid var(--p-line)} :where(.doc) .tdr:first-of-type{border-top:0} :where(.doc) .tdr>span:first-child{display:grid;gap:2px;min-width:0;flex:1 1 260px} :where(.doc) .tdr b{font:600 var(--fs-h4)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .tdr small{font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .tdr .acb{margin:0;padding:0} :where(.doc) .fdt{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:0} :where(.doc) .flp{display:grid;gap:6px} :where(.doc) .flp div{display:grid;grid-template-columns:1fr auto;align-items:baseline;gap:2px 10px;padding:6px 0;border-bottom:1px solid var(--p-line);font:var(--fs-note)/1.3 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .flp b{color:var(--p-h);font:700 18px/1 Poppins,Geist,system-ui,sans-serif} :where(.doc) .flp b s{font-weight:400;font-size:13px;color:var(--p-b);margin-right:4px} :where(.doc) .flp small{grid-column:2;text-align:right;font-size:11px} :where(.doc) .ctrb{justify-content:center} :where(.doc) .pgh .ctrb{margin-top:14px} :where(.doc) .flist{display:grid;gap:14px} :where(.doc) .fit.fhide{display:none} :where(.doc) .fpost{display:grid;gap:10px;padding:18px 20px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh)} :where(.doc) .fpost.pin{border-color:color-mix(in srgb,var(--p-vio) 55%,var(--p-line))} :where(.doc) .fph{display:flex;align-items:center;gap:10px;flex-wrap:wrap} :where(.doc) .fav{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#7c3aed,#4c1d95);color:#fff;font:700 12px/1 Poppins,Geist,system-ui,sans-serif;flex:none} :where(.doc) .fwho{display:flex;align-items:center;gap:8px} :where(.doc) .fwho b{color:var(--p-h);font:600 var(--fs-note)/1.2 Geist,system-ui,sans-serif} :where(.doc) .fwho i{font-style:normal;font:500 11px/1 Geist,system-ui,sans-serif;padding:3px 8px;border-radius:999px;border:1px solid var(--p-line);color:var(--p-lab)} :where(.doc) .fph small{color:var(--p-b);font-size:12px} :where(.doc) .fpin{margin-left:auto;font:500 var(--fs-label)/1.4 Geist Mono,ui-monospace,monospace;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--amb)} :where(.doc) .fpost h3{margin:0} :where(.doc) .fpost p{margin:0;font:var(--fs-note)/var(--lh-body) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fpost ul{margin:0;padding-left:18px;display:grid;gap:4px;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fpost .acb{margin:0;padding:0} :where(.doc) .fvid{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--p-line);max-width:640px} :where(.doc) .fvid video{display:block;width:100%;height:auto} :where(.doc) .fvid .fsnd{position:absolute;right:10px;bottom:10px;min-height:32px;padding:0 12px;border-radius:999px;background:rgba(13,10,18,.75);color:#fff;border:1px solid rgba(255,255,255,.25)} :where(.doc) .fmore{margin-top:var(--sp-block)} .doc.feed .din{padding-bottom:64px} /* v12jc: Feed welcome film with read-along beside it, and the Archive view */ :where(.doc) .fvw{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:16px;align-items:start} @container doc (max-width:760px){:where(.doc) .fvw{grid-template-columns:1fr}} :where(.doc) .fvw .fvid{max-width:none} :where(.doc) .frd{display:grid;gap:10px;padding:14px 16px;border:1px solid var(--p-line);border-radius:12px;background:color-mix(in srgb,var(--p-card) 60%,transparent)} :where(.doc) .frd .k{margin:0} :where(.doc) .frd ol{margin:0;padding:0;list-style:none;display:grid;gap:10px} :where(.doc) .frd li{display:grid;grid-template-columns:38px 1fr;gap:8px;font:var(--fs-note)/var(--lh-ui) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .frd li b{font:500 12px/1.6 Geist Mono,ui-monospace,monospace;color:var(--p-lab)} :where(.doc) .nlfa[hidden],:where(.doc) .nlfv[hidden]{display:none} /* v12jd (Richard, 9 Nov 2026): NEW-LOOK SKIN for every Academy page not yet rebuilt one by one. The page keeps all its parts and buttons; the master sheet gives it the new look, the same column width as Account and Feed, and the spacing rule. Scoped to #center.nlsk (set by newlook.js). */ html.nl #center.nlsk{padding:36px 0 64px;box-sizing:border-box;background:none;color:var(--txt)} html.nl #center.nlsk>*{box-sizing:border-box;width:100%;max-width:none;margin-left:0;margin-right:0} html.nl #center.nlsk>.hero{max-width:780px;margin-left:auto;margin-right:auto} html.nl #center.nlsk .hero{background:none;border:0;box-shadow:none;padding:0;margin:0 auto var(--sp-head);text-align:center;max-width:780px;display:grid;justify-items:center;gap:6px} html.nl #center.nlsk .hero::before,html.nl #center.nlsk .hero::after{display:none} html.nl #center.nlsk .hero h1{font:700 clamp(26px,3.2vw,38px)/1.15 Poppins,Geist,system-ui,sans-serif;color:var(--p-h);margin:4px 0 6px} html.nl #center.nlsk .hero h1 em{font-style:normal;color:#b794ff} html.nl #center.nlsk .hero>p,html.nl #center.nlsk .hero .mute{font:var(--fs-intro,16px)/var(--lh-body,1.6) Geist,system-ui,sans-serif;color:var(--p-b);max-width:680px;margin:0} html.nl #center.nlsk .hero>div{justify-content:center} html.nl #center.nlsk .kick{font:500 var(--fs-label,11px)/1.4 Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:var(--ls-label,.12em);text-transform:uppercase;color:var(--amb)} html.nl #center.nlsk .card{box-shadow:var(--p-sh);margin:0 auto var(--sp-block)} html.nl #center.nlsk .card.mustdo{border-color:#f7931a;box-shadow:0 0 0 1px rgba(247,147,26,.3),0 0 24px rgba(247,147,26,.18)} html.nl #center.nlsk .card h1,html.nl #center.nlsk .card h2{font-family:Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} html.nl #center.nlsk .card h1{font-size:24px;line-height:1.2;margin:4px 0 8px} html.nl #center.nlsk .card h2{font-size:20px;line-height:1.25;margin:4px 0 8px} html.nl #center.nlsk .card>.kick+h1,html.nl #center.nlsk .card>.kick+h2{margin-top:6px} html.nl #center.nlsk .card>p,html.nl #center.nlsk .card .mute{color:var(--p-b)} html.nl #center.nlsk .card h1+p,html.nl #center.nlsk .card h2+p,html.nl #center.nlsk .card .head+p{margin-bottom:12px} html.nl #center.nlsk .btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:#7c3aed;border:1px solid #7c3aed;color:#fff;text-decoration:none;box-shadow:none} html.nl #center.nlsk .btn:hover{background:#6d28d9;border-color:#c4a8ff} html.nl #center.nlsk .btn.gh{background:#1b1229;border-color:var(--p-line);color:var(--p-h)} html.nl #center.nlsk .btn.gh:hover{border-color:var(--p-vio)} html.nl #center.nlsk a{color:#fff} html.nl #center.nlsk details>summary{cursor:pointer} html.nl #center.nlsk details[open]>summary{margin-bottom:10px} html.nl #center.nlsk .drow,html.nl #center.nlsk .arow2{border-color:var(--p-line)} html[data-skin="light"].nl #center.nlsk .btn.gh{background:#fff} html[data-skin="light"].nl #center.nlsk a:not(.btn){color:#7c3aed} @media (max-width:760px){html.nl #center.nlsk{padding:24px 0 48px}} /* v12jd: links shown as buttons are always white on purple (Richard: the App link text was too dark) */ :where(.doc) a.cmain,:where(.doc) a.main{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 14px;border-radius:10px;background:#7c3aed;border:1px solid #7c3aed;color:#fff!important;font-weight:600;text-decoration:none} :where(.doc) a.cmain:hover{background:#6d28d9;border-color:#c4a8ff} :where(.doc) .fvid .fbtns{position:absolute;right:10px;bottom:10px;display:flex;gap:6px} :where(.doc) .fvid .fbtns .fsnd{position:static} /* v12je: Your first 7 days, seven day cards with progress */ html.nl #center.nlsk .f7{display:grid;gap:var(--sp-block)} html.nl #center.nlsk .f7top{display:grid;gap:6px;padding:16px 20px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px} html.nl #center.nlsk .f7top b{font:700 20px/1.2 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} html.nl #center.nlsk .f7g{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px} html.nl #center.nlsk .f7c{display:flex;flex-direction:column;gap:8px;padding:16px 18px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;min-width:0} html.nl #center.nlsk .f7c.ok{border-color:rgba(46,204,113,.55)} html.nl #center.nlsk .f7d{font:500 var(--fs-label,11px)/1.4 Geist Mono,ui-monospace,monospace;letter-spacing:var(--ls-label,.12em);text-transform:uppercase;color:var(--amb)} html.nl #center.nlsk .f7c.ok .f7d{color:#2ecc71} html.nl #center.nlsk .f7c b{font:600 var(--fs-h4,16px)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} html.nl #center.nlsk .f7c p{margin:0;font:var(--fs-note,13px)/var(--lh-ui,1.5) Geist,system-ui,sans-serif;color:var(--p-b)} html.nl #center.nlsk .f7b{margin-top:auto;padding-top:6px} html.nl #center.nlsk .nlnews{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;border-color:var(--p-vio);box-shadow:0 0 0 1px rgba(124,58,237,.35),0 0 28px rgba(124,58,237,.22);padding:22px 24px} html.nl #center.nlsk .nlnews>div:first-child{flex:1 1 380px;display:grid;gap:6px} html.nl #center.nlsk .nlnews h2{font-size:22px;margin:0} html.nl #center.nlsk .nlnews p{margin:0} @media (min-width:761px){html.nl #center.nlsk .nlnt .tgl{transform:scale(1.15);transform-origin:right center}} html.nl #center.nlsk .nlnt .tgl{font-weight:600;max-width:100%} /* v12jf: sign-up box on the coming-soon pages and 1:1, four session cards across the width */ html.nl #center.nlsk .hero.soonc{margin-bottom:var(--sp-head)} html.nl #center.nlsk .nlnewsv{display:grid;gap:8px} html.nl #center.nlsk .nlnewsv>b{font:700 22px/1.25 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} html.nl #center.nlsk .grid.nlg4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px} html.nl #center.nlsk .grid.nlg4>.card{margin:0;display:flex;flex-direction:column;gap:6px} html.nl #center.nlsk .grid.nlg4>.card b{font:600 var(--fs-h4,16px)/1.35 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} @media (max-width:1100px){html.nl #center.nlsk .grid.nlg4{grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:560px){html.nl #center.nlsk .grid.nlg4{grid-template-columns:1fr}} /* v12jf: Server status, rebuilt */ html.nl #center.nlsk .sbig{display:inline-block;width:18px;height:18px;border-radius:50%;background:var(--sc);box-shadow:0 0 0 5px color-mix(in srgb,var(--sc) 22%,transparent),0 0 22px var(--sc);margin-right:14px;vertical-align:middle;position:relative;top:-3px} html.nl #center.nlsk .sgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-bottom:var(--sp-block)} html.nl #center.nlsk .stile{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 10px;padding:16px 18px;background:var(--p-card);border:1px solid var(--p-line);border-radius:14px} html.nl #center.nlsk .stile .sdot{width:10px;height:10px;border-radius:50%;background:var(--sc);box-shadow:0 0 10px var(--sc)} html.nl #center.nlsk .stile b{font:600 var(--fs-h4,16px)/1.3 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} html.nl #center.nlsk .stile .sw{grid-column:2;font:600 13px/1.3 Geist,system-ui,sans-serif;color:var(--sc)} html.nl #center.nlsk .stile small{grid-column:2;font:12px/1.4 Geist,system-ui,sans-serif;color:var(--p-b)} html.nl #center.nlsk .s2{display:grid;grid-template-columns:1fr 1fr;gap:12px} html.nl #center.nlsk .s2>.card{margin:0;display:grid;gap:8px;align-content:start} @media (max-width:760px){html.nl #center.nlsk .s2{grid-template-columns:1fr}} html.nl #center.nlsk .srow{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-top:1px solid var(--p-line);font:var(--fs-note,13px)/1.4 Geist,system-ui,sans-serif;color:var(--p-b)} html.nl #center.nlsk .srow:first-of-type{border-top:0} html.nl #center.nlsk .srow b{color:var(--p-h)} html.nl #center.nlsk .srow small{display:block;opacity:.85} html.nl #center.nlsk .snow{font-style:normal;color:#d8c2ff;font-weight:600} html.nl #center.nlsk .snote{margin-top:var(--sp-block)} html.nl #center.nlsk .snote p{margin:0} html.nl #center.nlsk .sowner{margin-top:var(--sp-sec);display:grid;gap:var(--sp-block)} html.nl #center.nlsk .sowner>.card{margin:0} /* v12jf: course pages (Course 1, masterclasses): centred heading like every other page, lessons as clean rows */ html.nl #center.nlsk .card.crhead{background:none;border:0;box-shadow:none;padding:0;text-align:center;display:grid;justify-items:center;gap:8px;margin-bottom:var(--sp-head)} html.nl #center.nlsk .crhead>.crbackbtn{justify-self:start} html.nl #center.nlsk .crhead .crcover{display:grid;justify-items:center;gap:10px;margin-top:4px!important} html.nl #center.nlsk .crhead .crcover>span{display:grid;justify-items:center;gap:6px} html.nl #center.nlsk .crhead h1{font:700 clamp(26px,3.2vw,38px)/1.15 Poppins,Geist,system-ui,sans-serif!important;color:var(--p-h);margin:0!important} html.nl #center.nlsk .crhead>p{max-width:680px;margin:0!important;color:var(--p-b)} html.nl #center.nlsk .crhead>p.mute{font-size:var(--fs-intro,16px);line-height:var(--lh-body,1.6)} html.nl #center.nlsk .crhead ul.crout{text-align:left;justify-self:center;max-width:680px} html.nl #center.nlsk .crhead .crbar{width:100%;max-width:520px;height:6px;border-radius:999px;background:color-mix(in srgb,var(--p-line) 80%,transparent);overflow:hidden;margin-top:8px} html.nl #center.nlsk .crhead .crbar>div{height:100%;background:linear-gradient(90deg,#4c1d95,#7c3aed);border-radius:999px} html.nl #center.nlsk .crhead .crdonebar{justify-self:center;text-align:left;border-radius:14px} html.nl #center.nlsk .crhead .crbtnrow{justify-content:center} html.nl #center.nlsk .crles{display:flex;align-items:center;gap:12px;width:100%;padding:12px 4px;background:none;border:0;border-top:1px solid var(--p-line);border-radius:0;text-align:left;color:var(--p-h)} html.nl #center.nlsk .crles:first-child{border-top:0} html.nl #center.nlsk .crles:hover{background:color-mix(in srgb,var(--p-vio) 8%,transparent)} html.nl #center.nlsk .crles .crlt{flex:1;display:grid;gap:2px} html.nl #center.nlsk .crles .crlt b{font:600 var(--fs-h4,16px)/1.3 Poppins,Geist,system-ui,sans-serif} html.nl #center.nlsk .crles .crlt small{color:var(--p-b)} /* v12jf: the Overview panel in the new look: one card style, calm labels, soft number tiles */ html.nl .nlob .col{display:grid;gap:12px} html.nl .nlob .card{margin:0;box-shadow:none} html.nl .nlob a.card{text-decoration:none;color:inherit} html.nl .nlob a.card:hover{border-color:#7c3aed!important} html.nl .nlob .kick{font:500 10.5px/1.4 Geist Mono,ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#F7931A} html.nl .nlob .osh,html.nl .nlob .dkr{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:10px} html.nl .nlob .osn{font:700 22px/1 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} html.nl .nlob .dkb{display:inline-block;margin-top:6px;font:600 12px/1.3 Geist,system-ui,sans-serif;color:#f7931a} html.nl .nlob .osn small{font:500 12px Geist,system-ui,sans-serif;color:#a99cc8;margin-left:4px} html.nl .nlob .osgrid{gap:6px;margin-bottom:6px} html.nl .nlob .ost{background:#1f172f;border:1px solid #2a1f3d!important;border-radius:10px;padding:8px 6px} html.nl .nlob .ost b{font:700 16px/1.1 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} html.nl .nlob .ost span{font-size:10.5px;color:#a99cc8} html.nl .nlob .ost.z{opacity:.55!important} html.nl .nlob p,html.nl .nlob .sm,html.nl .nlob .osl{color:#a99cc8} html.nl .nlob .note{font-size:11px;color:#a99cc8;padding:0 4px} html[data-skin="light"].nl .nlob .card{background:#fff;border-color:#e9e4ef!important} html[data-skin="light"].nl .nlob .ost{background:#f6f3fa} html[data-skin="light"].nl .nlob .osn,html[data-skin="light"].nl .nlob .ost b{color:#1b1325} /* v12jg: course back buttons as plain ghost buttons; course and masterclass cards one size, three across */ html.nl #center.nlsk .crbackbtn{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:10px;border:1px solid var(--p-line);background:#1b1229;color:var(--p-h);font:600 13px/1 Geist,system-ui,sans-serif} html.nl #center.nlsk .crbackbtn:hover{border-color:var(--p-vio)} html.nl #center.nlsk .crbackbtn>span{color:var(--p-b)} html.nl #center.nlsk .crbackbtn.crgo{background:#7c3aed;border-color:#7c3aed;color:#fff} html.nl #center.nlsk .crbackbtn.crgo>span{color:#fff} html[data-skin="light"].nl #center.nlsk .crbackbtn:not(.crgo){background:#fff} html.nl #center.nlsk .grid:has(> .crcard){display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} html.nl #center.nlsk .grid:has(> .crcard)>.crcard{width:auto;min-width:0;margin:0} @media (max-width:900px){html.nl #center.nlsk .grid:has(> .crcard){grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:560px){html.nl #center.nlsk .grid:has(> .crcard){grid-template-columns:1fr}} html.nl #center.nlsk .nlnews .nlnt .btn{} /* v12ji: Account keeps its new box at the top; the parts below it (payments, certificate, emails, close account) wear the skin too */ html.nl #center.nlsk.nlmix{padding:0 0 64px} html.nl #center.nlsk.nlmix>.nlpx+*{margin-top:0} /* v12ji: phone width and reading pages (guides, lessons, white paper) */ @container doc (max-width:640px){:where(.doc) table.cmp{display:block;overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch}} html.nl #center.nlsk table{max-width:100%} html.nl #center.nlsk .wt,html.nl #center.nlsk .wp table{display:block;overflow-x:auto;max-width:100%} html.nl #center.nlsk .card.nlgh{background:none;border:0;box-shadow:none;padding:0;text-align:center;display:grid;justify-items:center;gap:6px;margin-bottom:var(--sp-head)} html.nl #center.nlsk .card.nlgh>button:first-child,html.nl #center.nlsk .card.nlgh>.crbackbtn{justify-self:start;margin-bottom:10px} html.nl #center.nlsk .card.nlgh h1{font:700 clamp(26px,3.2vw,38px)/1.15 Poppins,Geist,system-ui,sans-serif!important;color:var(--p-h);margin:4px 0!important} html.nl #center.nlsk .card.nlgh>p{max-width:680px;font-size:var(--fs-intro,16px);line-height:var(--lh-body,1.6)} html.nl #center.nlsk .crbackbtn>span{background:none!important;border:0!important;width:auto!important;height:auto!important;padding:0!important} html.nl #center.nlsk :is(.wp,.card) :is(h2,h3){font-family:Poppins,Geist,system-ui,sans-serif;color:var(--p-h);margin:22px 0 8px} html.nl #center.nlsk :is(.wp,.card) h2{font-size:20px} html.nl #center.nlsk :is(.wp,.card) h3{font-size:17px} html.nl #center.nlsk :is(.wp,.card)>:is(h2,h3):first-child{margin-top:0} html.nl #center.nlsk .wp :is(p,li){font-size:14px;line-height:1.7;color:var(--p-b)} html.nl #center.nlsk .wp b,html.nl #center.nlsk .wp strong{color:var(--p-h)} html.nl #center.nlsk .wp :is(ol,ul){padding-left:22px;display:grid;gap:6px;margin:8px 0 14px} html.nl #center.nlsk .wp{padding:24px 28px} @media (max-width:760px){html.nl #center.nlsk .wp{padding:18px 16px}html.nl #center.nlsk .card{}} /* v12jk: Feed "Your plan" welcome box (first 3 visits) */ :where(.doc) .fplan{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:20px;align-items:center;margin:0 0 var(--sp-block);padding:22px 24px;background:var(--p-card);border:1px solid var(--p-vio);border-radius:14px;box-shadow:0 0 0 1px rgba(124,58,237,.35),0 0 28px rgba(124,58,237,.2)} :where(.doc) .fplan:not(:has(.fprs)){grid-template-columns:1fr} @container doc (max-width:760px){:where(.doc) .fplan{grid-template-columns:1fr;padding:18px}} :where(.doc) .fpl{display:grid;gap:8px} :where(.doc) .fpl .k{margin:0} :where(.doc) .fpl h2{margin:0;font:700 22px/1.25 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fpl p{margin:0;font:var(--fs-note)/var(--lh-body) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fpl .acb{margin:4px 0 0;padding:0} :where(.doc) .fpn{font:12px/1.4 Geist,system-ui,sans-serif;color:var(--p-b);opacity:.75} :where(.doc) .fprs{display:grid;gap:8px} :where(.doc) .fpr{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;border:1px solid var(--p-line);border-radius:12px;background:color-mix(in srgb,var(--p-card) 60%,transparent)} :where(.doc) .fpr.me{border-color:var(--p-vio)} :where(.doc) .fpr>span:first-child{display:grid;gap:2px} :where(.doc) .fpr b{font:600 15px/1.2 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fpr small{font:12px/1.3 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fpv{display:grid;justify-items:end;font:700 20px/1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fpv s{font:400 12px/1 Geist,system-ui,sans-serif;color:var(--p-b);margin-bottom:2px} /* v12jl: film buttons sit under the read-along (or under the film), never over the picture */ :where(.doc) .fvw .fbtns{position:static;display:flex;flex-wrap:wrap;gap:8px;margin-top:4px} :where(.doc) .fvw .fbtns button{min-height:36px;padding:0 14px;border-radius:10px} /* v12jo: flagship course player in the new look: Next is the purple primary button, Close course a calm ghost button */ html.nl #next.btn.o{background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;background-image:none!important;box-shadow:none!important} html.nl #next.btn.o:hover{background:#6d28d9!important} html.nl .nlbb .nlclose{background:#1b1229!important;border:1px solid #2a1f3d!important;color:#f3eaff!important} html.nl .nlbb .nlclose:hover{border-color:#7c3aed!important} html[data-skin="light"].nl .nlbb .nlclose{background:#fff!important;border-color:#e3dcec!important;color:#1b1325!important} /* v12jp (Richard): flagship player: the Back / Next bar lines up exactly with the lesson column above it (same width, same edges) */ html.nl .rail .rail-in{max-width:1120px!important;width:100%;padding:0 32px!important;box-sizing:border-box;margin:0 auto!important} @media (max-width:760px){html.nl .rail .rail-in{padding:0 72px 0 16px!important}} /* v12jy (Richard): never fake bold or italics anywhere: only real font weights are drawn */ html{font-synthesis:none} /* v12ka (Richard, 9 Nov 2026): the Recommended plan card has the purple outline, as in the App */ .pcx.rec{border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} /* v12ke (Richard, 9 Nov 2026): no rainbow bars. Progress bars and meters in shades of purple, light to dark */ html.nl :is(.msb i,.bar i,.crbar>div,.acbar i,#acg .acgbar span.on,#acc .acgbar span.on){background:linear-gradient(90deg,#c4a6ff,#7c3aed)!important} :where(.doc) .acbar i,.crbar>div{background:linear-gradient(90deg,#c4a6ff,#7c3aed)} /* v12kz (Richard, 9 Nov 2026): one panel header button style for every secondary panel (course, Academy, Studio): Pin and close, 13px, 6px 10px, 8px apart */ html.nl .nloh button,.sover .sohd .sohb button{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:6px 10px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:500 13px Geist,system-ui,sans-serif;line-height:normal;cursor:pointer} html.nl .nloh button:hover,.sover .sohd .sohb button:hover{border-color:#7c3aed} html.nl .nloh button.on,.sover .sohd .sohb button.on{border-color:#F7931A;color:#F7931A} .sover .sohd .sohb{display:flex;align-items:center;gap:8px} /* v12lb (Richard, 9 Nov 2026): one thin scrollbar everywhere (Academy, course, App, Studio), the course's style */ *{scrollbar-width:thin;scrollbar-color:#4a3878 transparent} *::-webkit-scrollbar{width:8px;height:8px} *::-webkit-scrollbar-track{background:transparent} *::-webkit-scrollbar-thumb{background:#4a3878;border-radius:999px;border:2px solid transparent;background-clip:padding-box} *::-webkit-scrollbar-thumb:hover{background:#A35BFF;background-clip:padding-box} .apnav{scrollbar-width:none} /* v12ld (Richard, 9 Nov 2026): the course slide-out lines up exactly like Studio: header bar the same height as the page bar so the dividers meet, and no extra outline on the page panel, so the gaps round the panels are equal (12px) */ html.nl .nlpanel{box-shadow:none!important} html.nl .nlover .nloh{box-sizing:border-box;height:var(--nlbh,49px);padding-top:0!important;padding-bottom:0!important} /* v12lf (Richard, 9 Nov 2026): the course slide-out follows Studio exactly: 380px including its border, 12px from every edge, the same header bar, and the same inner spacing */ html.nl .nlover{box-sizing:border-box!important;width:380px!important;top:12px!important;right:12px!important;bottom:12px!important} html.nl .nlover .nloh{padding-left:18px!important;padding-right:12px!important;gap:8px!important} html.nl .nlover .nlprof.nlxpanel{padding:16px 18px 28px 20px!important;margin:0!important;flex:1;min-height:0;overflow:auto} html.nl .nlover .nlxpanel .w13rafin{padding:4px 0 12px!important} @media (min-width:1101px) and (hover:hover), (min-width:1401px){html.nl .main.nlpinned .nlpanel{margin-right:392px!important}} /* v12li (Richard, 9 Nov 2026): Going live (course Lesson 13.2, its 20i panel, Lesson 13.3, and Studio's Going live) is styled here and only here. The course file and Studio carry no copies. Values are Studio's. */ .gl13{display:grid;gap:18px;font:14px/1.55 Geist,system-ui,sans-serif;color:#f3eaff;--line:#2a1f3d;--line2:#2a1f3d;--ok:#3ddc97;--dim:#a99cc8} .gl13>*{max-width:100%;min-width:0} .gl13 .lhead{display:grid!important;gap:8px!important;margin:0!important} .gl13 .lhead h1{margin:0!important;font:600 clamp(26px,3.2vw,36px)/1.15 Poppins,Geist,system-ui,sans-serif!important;letter-spacing:-.01em;color:#f3eaff} .gl13 .lhead h1 em{font-style:normal;color:#a78bfa;background:none;-webkit-text-fill-color:currentColor} .gl13 .lhead p{margin:0!important;max-width:none!important;font:15.5px/1.65 Geist,system-ui,sans-serif!important;color:#d8cdef} .gl13 .eyebrow{font:500 11px/1.4 'Geist Mono',ui-monospace,monospace!important;letter-spacing:.18em!important;text-transform:uppercase!important;color:#F7931A!important} .gl13 .small{font:13px/1.5 Geist,system-ui,sans-serif!important;color:#a99cc8} .gl13 .btn{appearance:none;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;border-radius:10px!important;padding:12px 20px!important;font:600 15px Geist,system-ui,sans-serif!important;cursor:pointer;border:1px solid #2a1f3d!important;min-height:46px!important;text-decoration:none;background:#1b1229!important;background-image:none!important;color:#f3eaff!important;box-shadow:none!important} .gl13 .btn.o{background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important}.gl13 .btn.o:hover{background:#6d28d9!important} .gl13 .pill{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:10px!important;padding:8px 14px;min-height:0;height:auto;font:600 13px Geist,system-ui,sans-serif;letter-spacing:0;text-transform:none;cursor:pointer;border:1px solid #2a1f3d!important;background:#1b1229!important;color:#f3eaff!important;text-decoration:none} .gl13 .pill:hover{border-color:#7c3aed!important} .gl13 .tg{appearance:none;width:58px;height:32px;border-radius:999px;border:1px solid #2a1f3d;background:#241b3a;position:relative;cursor:pointer;flex:none;transition:background .25s} .gl13 .tg::after{content:"";position:absolute;top:3px;left:3px;width:24px;height:24px;border-radius:50%;background:#cbbdf0;transition:transform .25s,background .25s} .gl13 .tg[aria-checked="true"]{background:linear-gradient(90deg,#1f8f63,#2fbf7f);border-color:#3ddc97}.gl13 .tg[aria-checked="true"]::after{transform:translateX(26px);background:#fff} .gl13 .pn,.gl13 .pp{display:block} .gl13 .w13ref .pill,.gl13 .w13ava [data-glshow],.gl13 #w13show{justify-self:start} .gl13>.w13fn{margin:10px 0 0!important} .w13rafin.gl13{gap:14px;padding:4px 0 12px!important} /* v12lj: the .86 zoom on Going live is gone; the master lock below sets every size */ .nlav{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#7c3aed,#b794ff);color:#fff;font:700 12px/1 Poppins,Geist,system-ui,sans-serif} .w13x{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;align-items:stretch} @media (max-width:900px){.w13x{grid-template-columns:1fr}} .w13go,.w13how{display:grid;gap:12px;align-content:start;padding:20px 22px;border-radius:14px;border:1px solid #2a1f3d;background:#1a1228} .w13go{border-color:#7c3aed;box-shadow:0 0 0 1px rgba(124,58,237,.35),0 0 28px rgba(124,58,237,.2)} .w13st{font:15px/1.55 Geist,system-ui,sans-serif;color:#f3eaff;padding:12px 14px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d} .w13big{width:100%;min-height:54px!important;font-size:17px!important} .w13sub{display:flex;align-items:center;gap:10px;flex-wrap:wrap} .w13how ol{list-style:none;margin:0;padding:0;display:grid;gap:8px} .w13how li{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d;font:14px/1.45 Geist,system-ui,sans-serif;color:#d8cdef} .w13how li b{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#7c3aed;color:#fff;font:700 12px/1 Geist,system-ui,sans-serif} .w13how li strong{color:#f3eaff;font-weight:600} html[data-skin=light] :is(.w13go,.w13how){background:#fff} html[data-skin=light] :is(.w13st,.w13how li){background:#faf8fd;border-color:#e9e4ef;color:#1b1325} html[data-skin=light] .w13how li strong{color:#1b1325} .w13cards.w2{grid-template-columns:repeat(2,minmax(0,1fr))} @media (max-width:900px){.w13cards.w2{grid-template-columns:1fr}} .w13c.rec{border-color:#7c3aed;box-shadow:0 0 0 1px #7c3aed} .w13need,.w13ava{display:grid;gap:10px;margin-top:12px;padding:16px 18px;border-radius:14px;border:1px solid #2a1f3d;background:#1a1228} .w13needr{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px} @media (max-width:700px){.w13needr{grid-template-columns:1fr 1fr}} .w13needr div{display:grid;gap:2px;padding:10px 12px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d;font:13px/1.45 Geist,system-ui,sans-serif;color:#a99cc8} .w13needr b{color:#f3eaff;font-weight:600} .w13ava{border-color:color-mix(in srgb,#7c3aed 55%,#2a1f3d)} .w13avat{display:flex;align-items:center;gap:12px} .w13avat .nlav{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#7c3aed!important;background-image:none!important;color:#fff;font:700 14px/1 Poppins,Geist,system-ui,sans-serif;flex:none} .w13ref{background:transparent!important;border:0!important;padding:0!important} .w13ref .pill{display:block;padding:10px 12px} .w13ava h3{margin:2px 0 0;font:600 18px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .w13ava>p{margin:0;font:14px/1.55 Geist,system-ui,sans-serif;color:#d8cdef} .w13ava .tk{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:6px 16px} @media (max-width:700px){.w13ava .tk{grid-template-columns:1fr}} .w13ava .tk li{position:relative;padding-left:20px;font:14px/1.45 Geist,system-ui,sans-serif;color:#d8cdef} .w13ava .tk li::before{content:"✓";position:absolute;left:0;color:#3ddc97;font-weight:700} .w13ava #w13show{justify-self:start} .w13demo{display:grid;gap:8px;padding:12px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d;max-width:560px} .w13demo[hidden]{display:none} .w13msg{max-width:85%;padding:9px 12px;border-radius:12px;font:14px/1.5 Geist,system-ui,sans-serif} .w13msg.u{justify-self:end;background:#7c3aed;color:#fff} .w13msg.a{justify-self:start;background:#1a1228;border:1px solid #2a1f3d;color:#d8cdef} .w13msg.a b{display:block;font:600 12px/1.4 Geist,system-ui,sans-serif;color:#F7931A;margin-bottom:2px} .w13avasw{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 12px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d} .w13avasw.on{border-color:#7c3aed} .w13avasw div{display:grid;gap:2px;font:13px/1.45 Geist,system-ui,sans-serif;color:#a99cc8} .w13avasw b{color:#f3eaff;font-weight:600;font-size:14px} .w13avasw .tg{flex:none} .w13what{margin-left:6px;font:500 12px/1 Geist,system-ui,sans-serif;color:#b794ff;text-decoration:none} .w13what:hover{text-decoration:underline} .w13avaf{display:grid;grid-template-columns:1fr 1fr;gap:8px} @media (max-width:700px){.w13avaf{grid-template-columns:1fr}} .w13avaf div{display:grid;gap:2px;padding:10px 12px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d;font:13px/1.5 Geist,system-ui,sans-serif;color:#a99cc8} .w13avaf b{color:#f3eaff;font-weight:600;font-size:14px} .w13ways{display:grid;gap:10px;margin:0 0 14px;padding:16px 18px;border-radius:14px;border:1px solid #2a1f3d;background:#1a1228} .w13ways .small{margin:0} .w13needr.w3{grid-template-columns:repeat(3,minmax(0,1fr))} @media (max-width:700px){.w13needr.w3{grid-template-columns:1fr}} html[data-skin=light] :is(.w13avaf div){background:#faf8fd;border-color:#e9e4ef} html[data-skin=light] .w13ways{background:#fff;border-color:#e9e4ef} html[data-skin=light] .w13avaf b{color:#1b1325} html[data-skin=light] :is(.w13need,.w13ava){background:#fff;border-color:#e9e4ef} html[data-skin=light] :is(.w13needr div,.w13demo,.w13avasw){background:#faf8fd;border-color:#e9e4ef} html[data-skin=light] :is(.w13needr b,.w13ava h3,.w13avasw b){color:#1b1325} html[data-skin=light] :is(.w13ava>p,.w13ava .tk li){color:#3b3047} .w13go{box-shadow:none!important} .w13own{padding:10px 14px;border-radius:12px;border:1px dashed #F7931A;color:#F7931A;font:13px/1.5 Geist,system-ui,sans-serif} .w13cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:stretch;margin-top:12px} @media (max-width:900px){.w13cards{grid-template-columns:1fr}} .w13c{position:relative;display:flex;flex-direction:column;gap:8px;min-width:0;padding:22px 16px 16px;background:#1a1228;border:1px solid #2a1f3d;border-radius:14px;color:#f3eaff} .w13c.hi{border-color:#7c3aed;box-shadow:0 0 0 1px #7c3aed} .w13c .tag{position:absolute;top:-10px;left:14px;background:#F7931A;color:#1b0f02} .w13c.hi .tag{background:#7c3aed;color:#fff} .w13pl{font:600 12px/1.3 Geist,system-ui,sans-serif;color:#F7931A} .w13c .pn,.w13add .pn{font:600 18px/1.35 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .w13c .pp,.w13add .pp{font:700 30px/1.1 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .w13c .pp small,.w13add .pp small{font:500 13px/1 Geist,system-ui,sans-serif;color:#a99cc8} .w13c .po,.w13add .po{margin:0;font:13px/1.5 Geist,system-ui,sans-serif;color:#a99cc8;padding-bottom:10px;border-bottom:1px solid #2a1f3d} .w13add .po{border:0;padding:0} .w13c .tk{list-style:none;margin:2px 0 6px;padding:0;display:grid;gap:7px} .w13c .tk li{position:relative;padding-left:20px;font:14px/1.45 Geist,system-ui,sans-serif;color:#d8cdef} .w13c .tk li::before{content:"✓";position:absolute;left:0;top:0;color:#3ddc97;font-weight:700} .w13c .w13pick{width:100%;margin-top:auto} .w13ref{display:grid;gap:6px;padding:10px 12px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d} .w13ref .pill{text-align:center;text-decoration:none} .w13ref span{font:12px/1.45 Geist,system-ui,sans-serif;color:#a99cc8} .w13add{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px;align-items:center;margin-top:14px;padding:16px 18px;background:#1a1228;border:1px solid #2a1f3d;border-radius:14px} .w13add.on{border-color:#7c3aed} .w13add>div:first-child{display:grid;gap:4px} .w13addp{display:grid;gap:6px;justify-items:end} @media (max-width:700px){.w13add{grid-template-columns:1fr}.w13addp{justify-items:start}} .w13fn{margin-top:10px} .w13path{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 12px;padding:10px 14px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d;font:14px/1.45 Geist,system-ui,sans-serif;color:#d8cdef} .w13path b{color:#f3eaff;font-weight:600} .w13lk{max-width:760px} .w13lkl{list-style:none;margin:4px 0;padding:0;display:grid;gap:6px} .w13lkl li{padding:8px 12px;border-radius:10px;background:#140d1f;border:1px solid #2a1f3d;font:14px/1.45 Geist,system-ui,sans-serif;color:#d8cdef} .w13lkl b{color:#F7931A;font-weight:600;margin-right:6px} .w13lk .wbtns{display:flex;gap:10px;flex-wrap:wrap} html[data-skin=light] :is(.w13c,.w13add){background:#fff;border-color:#e9e4ef;color:#1b1325} html[data-skin=light] :is(.w13c .pn,.w13add .pn,.w13c .pp,.w13add .pp,.w13path b){color:#1b1325} html[data-skin=light] :is(.w13ref,.w13path,.w13lkl li){background:#faf8fd;border-color:#e9e4ef;color:#1b1325} html[data-skin=light] .w13c .tk li{color:#3b3047} .w13rafbg{position:absolute;inset:0;background:rgba(11,7,17,.6)} .w13rafp{position:absolute;top:0;right:0;bottom:0;width:min(420px,100%);overflow:auto;display:grid;align-content:start;gap:14px;padding:22px 20px;background:#1a1228;border-left:1px solid #2a1f3d;color:#f3eaff} .w13rafh{display:flex;align-items:flex-start;justify-content:space-between;gap:12px} .w13rafh h3{margin:2px 0 0;font:600 20px/1.3 Poppins,Geist,system-ui,sans-serif} .w13rafp .small{margin:0;font:13px/1.55 Geist,system-ui,sans-serif;color:#a99cc8} .w13rafl{display:grid;gap:12px} .w13rafi{position:relative;display:grid;gap:4px;padding:16px 14px 14px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d;text-decoration:none;color:#f3eaff;cursor:pointer} .w13rafi:hover{border-color:#7c3aed} .w13rafi.rec{border-color:#7c3aed;box-shadow:0 0 0 1px #7c3aed} .w13rafi .tag{position:absolute;top:-10px;left:12px;background:#F7931A;color:#1b0f02} .w13rafi b{font:600 15px/1.35 Geist,system-ui,sans-serif} .w13rafi,.w13rafi.big{display:grid!important;grid-template-columns:minmax(0,1fr)!important;grid-auto-flow:row!important} .w13rafi>*{min-width:0} .w13rafin .w13pl{color:#F7931A} .w13rafgo{justify-self:stretch} .w13rafs2{gap:10px!important} .w13rafs2 li{display:grid;gap:4px;padding-left:28px!important} .w13rafs2 li b{font:600 14px/1.4 Geist,system-ui,sans-serif!important;color:#f3eaff} .w13rafs2 li>span:not(.w13rafr){font:13px/1.5 Geist,system-ui,sans-serif;color:#a99cc8} .w13rafs2 .w13rafr{padding:6px 8px;border-radius:8px;background:#140d1f;border:1px solid #2a1f3d} .w13rafs2 .w13rafgo{margin:2px 0;text-decoration:none!important} html[data-skin=light] .w13rafs2 li b{color:#1b1325} html[data-skin=light] .w13rafs2 .w13rafr{background:#faf8fd;border-color:#e9e4ef} .w13rafh2{display:grid;gap:6px;padding:14px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d} .w13rafh2 b{font:600 16px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .w13rafh2 .btn{width:100%;margin-top:4px} html[data-skin=light] .w13rafh2{background:#faf8fd;border-color:#e9e4ef} html[data-skin=light] .w13rafh2 b{color:#1b1325} .w13rafi.big{gap:10px;padding:22px 16px 16px;margin-top:6px} .w13rafi.big b{font:600 18px/1.3 Poppins,Geist,system-ui,sans-serif} .w13rafs{list-style:none;counter-reset:r;margin:2px 0;padding:10px 12px;display:grid;gap:6px;border-radius:10px;background:#1a1228;border:1px solid #2a1f3d} .w13rafs li{counter-increment:r;position:relative;padding-left:26px;font:13px/1.5 Geist,system-ui,sans-serif;color:#d8cdef} .w13rafs li::before{content:counter(r);position:absolute;left:0;top:1px;width:18px;height:18px;border-radius:50%;display:grid;place-items:center;background:#7c3aed;color:#fff;font:700 11px/1 Geist,system-ui,sans-serif} html[data-skin=light] .w13rafs{background:#fff;border-color:#e9e4ef} html[data-skin=light] .w13rafs li{color:#3b3047} .w13rafin{display:grid;gap:14px;padding:4px 2px 12px} .w13rafin .small{margin:0;font:13px/1.55 Geist,system-ui,sans-serif;color:#a99cc8} .w13rafc{display:grid;gap:8px;padding:12px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d} .w13rafr{display:flex;align-items:center;justify-content:space-between;gap:10px} .w13rafr>span{display:grid;gap:2px;min-width:0} .w13rafr b{font:600 13px/1.3 Geist,system-ui,sans-serif;color:#f3eaff} .w13rafr code{font:12px/1.4 'Geist Mono',ui-monospace,monospace;color:#c4a6ff;overflow-wrap:anywhere} .w13rafr .pill{flex:none;padding:6px 10px;font-size:12px} html[data-skin=light] .w13rafc{background:#faf8fd;border-color:#e9e4ef} html[data-skin=light] .w13rafr b{color:#1b1325} .w13rafi .tk{list-style:none;margin:4px 0;padding:0;display:grid;gap:5px} .w13rafi .tk li{position:relative;padding-left:18px;font:13px/1.5 Geist,system-ui,sans-serif;color:#d8cdef} .w13rafi .tk li::before{content:"✓";position:absolute;left:0;color:#3ddc97;font-weight:700} .w13rafgo{display:block;margin-top:6px;padding:10px 12px;border-radius:10px;background:#7c3aed;color:#fff!important;text-align:center;font:600 14px/1.2 Geist,system-ui,sans-serif!important} .w13rafi span:not(.tag){font:13px/1.5 Geist,system-ui,sans-serif;color:#a99cc8} html[data-skin=light] .w13rafp{background:#fff;border-color:#e9e4ef;color:#1b1325} html[data-skin=light] .w13rafi{background:#faf8fd;border-color:#e9e4ef;color:#1b1325} /* v12li: Studio slide-out header (moved from studio-golive.js into the master sheet) */ /* v12ky (Richard, 9 Nov 2026): every Studio slide-out has the course panel header: a bar the same height as the page bar, title on the left, Pin and close on the right, and the divider in line with the page bar divider */.stage .sover{display:flex!important;flex-direction:column;padding:0!important;overflow:hidden!important;top:var(--sotop,12px)!important;bottom:var(--sobot,12px)!important}.stage .sover[hidden]{display:none!important}.sover .sohd{flex:none;box-sizing:border-box;height:var(--glh,48px);display:flex;align-items:center;gap:8px;padding:0 12px 0 18px;border-bottom:1px solid #2a1f3d;background:rgba(20,13,31,.94)}.sover .sohd .soh{flex:1;margin:0!important;font:700 16px/1.3 Poppins,Geist,system-ui,sans-serif!important;color:#f3eaff}.sover .sohd .ppin,.sover .sohd .px{position:static!important;float:none!important;margin:0!important;width:auto!important;height:auto!important}.sover .sobody{flex:1;min-height:0;overflow:auto;padding:16px 18px 28px 20px} @media (min-width:1101px) and (hover:hover), (min-width:1401px){.stage.glpin .spanel{margin-right:392px}.stage.glpin .sover.glso{box-shadow:none;animation:none}}.sover.glso .glhost{display:block;clear:both} /* v12li: Studio navigation and Studio pages (moved from studio-nav.js into the master sheet) */ .top .devs [data-sv="work"]{color:#f3eaff!important}.stool{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px}.stool .state{justify-self:start;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stool .sdevs{justify-self:center;display:inline-flex}.stool .sdevs .nav{display:flex;gap:4px}.stool .stb{justify-self:end}.stool:not(.snwork){display:block!important;padding:0!important}.stool:not(.snwork)>.state,.stool:not(.snwork)>.sdevs,.stool:not(.snwork)>.stb{display:none!important}.snbar{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:8px;padding:10px 22px;width:100%}.snbar[hidden]{display:none}.snbar .sub{grid-column:2;margin:0;justify-content:center}.snbar .by{grid-column:1;justify-self:start;font:500 13px/1.3 Geist,system-ui,sans-serif;color:#a99cc8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.snbar .dbtn{grid-column:3;justify-self:end;display:flex;align-items:center;gap:6px}.stage.spinned .stool:not(.snwork)>.state,.stage.spinned .stool:not(.snwork)>.sdevs,.stage.spinned .stool:not(.snwork)>.stb{display:none!important}.stool.snlite:not(.snwork){background:#fff!important;border-bottom-color:#eee8f3!important}.stool.snlite .by{color:#6b6280}.sntitle{font:600 14px/1.3 Geist,system-ui,sans-serif;color:#f3eaff}.spanel{display:flex;flex-direction:column}.snhost{flex:1;min-height:0;overflow:hidden}.snhost[hidden],.sview[hidden]{display:none!important} .snd .pgh .acb{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:6px}.snd .acb button{cursor:pointer;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff}.snd .acb button:hover{border-color:#7c3aed}*{scrollbar-width:thin;scrollbar-color:#4a3878 transparent}.snd{display:block;height:100%;overflow:auto;scrollbar-gutter:stable both-edges;background:radial-gradient(900px 500px at 80% 0,rgba(139,92,246,.14),transparent 70%),#140d1f;color:#f3eaff;padding-bottom:48px}.snd.lite{background:radial-gradient(900px 500px at 80% 0,rgba(124,58,237,.07),transparent 70%),#fff;color:#1b1325}.snd.lite .sncard,.snd.lite .snp,.snd.lite .snfaq details{background:#fff;border-color:#e9e4ef;color:#3b3047}.snd.lite h1,.snd.lite .sncard b,.snd.lite .snl,.snd.lite .snpp{color:#1b1325}.snin{padding:0 4px!important}.snwrap{padding:0 28px 56px}.snin{max-width:1040px;margin:0 auto;display:grid;gap:16px;padding-top:0}.snk{font:600 12px/1.3 Geist,system-ui,sans-serif;color:#F7931A}.snin h1{margin:0;font:600 clamp(26px,3.2vw,36px)/1.15 Poppins,Geist,system-ui,sans-serif;color:#f3eaff}.snin h1 em{font-style:normal;color:#a78bfa}.snlead{margin:0;max-width:72ch;font:15.5px/1.65 Geist,system-ui,sans-serif;color:#d8cdef}.snbtns{display:flex;gap:10px;flex-wrap:wrap;margin:4px 0}.sngrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.sngrid.two{grid-template-columns:repeat(2,minmax(0,1fr))}@media(max-width:900px){.sngrid,.sngrid.two,.sncards{grid-template-columns:1fr!important}}.sncard{display:grid;gap:6px;align-content:start;font:14px/1.55 Geist,system-ui,sans-serif;color:#d8cdef}.sncard b{font:600 16px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff}.sncard a{color:#b794ff}.sncard code{font-family:"Geist Mono",ui-monospace,monospace;color:#c4a6ff}.sncard.soon{border-style:dashed}.sncards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:8px}.snp{position:relative;display:grid;gap:8px;align-content:start;padding:22px 16px 16px;border-radius:14px;background:#1a1228;border:1px solid #2a1f3d;font:13px/1.5 Geist,system-ui,sans-serif;color:#a99cc8}.snp.rec{border-color:#7c3aed;box-shadow:0 0 0 1px #7c3aed}.snp p{margin:0}.snl{font:600 18px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff}.snpp{font:700 30px/1.1 Poppins,Geist,system-ui,sans-serif;color:#f3eaff}.snpp small{font:500 13px/1 Geist,system-ui,sans-serif;color:#a99cc8}.sntag{position:absolute;top:-10px;left:14px;background:#F7931A;color:#1b0f02;font:600 12px/1.4 Geist,system-ui,sans-serif;padding:2px 9px;border-radius:999px}.sntk{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:6px}.sntk li{position:relative;padding-left:20px;font:14px/1.45 Geist,system-ui,sans-serif;color:#d8cdef}.sntk li::before{content:"✓";position:absolute;left:0;color:#3ddc97;font-weight:700}.snfine{margin:0;font:12.5px/1.5 Geist,system-ui,sans-serif;color:#a99cc8}.snfaq{display:grid;gap:8px}.snfaq details{padding:12px 16px;border-radius:12px;background:#1a1228;border:1px solid #2a1f3d}.snfaq summary{cursor:pointer;font:600 15px/1.4 Geist,system-ui,sans-serif;color:#f3eaff}.snfaq p{margin:8px 0 0;font:14px/1.55 Geist,system-ui,sans-serif;color:#d8cdef}.snbtns button{min-height:40px;padding:0 18px;border-radius:10px;font:600 14px/1 Geist,system-ui,sans-serif;cursor:pointer;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff}.snbtns button.main{background:#7c3aed;border-color:#7c3aed;color:#fff} /* ===== MASTER TYPE AND SPACING LOCK (v12lj, 9 Nov 2026). Richard: one size for every heading, kicker and gap on every platform (Academy, course, Admin, App, Studio). This block is last in the file and wins. Small, medium and large come only from the html zoom map; nothing below may add its own zoom. ===== */ :root{--t-wel:46px;--t-h1:38px;--t-h2:26px;--t-h3:16px;--t-h4:15px;--t-h5:14px;--t-h6:13px;--t-k:11px;--g-kh:10px;--g-hl:10px;--g-hd:4px} /* kickers: every small orange label */ :is(.doc,.nlbrain,.gl13,.scene,#center,#right,.nlover,.sover) :is(.k,.kick,.snk,.eyebrow){font:500 var(--t-k)/1.4 Geist Mono,ui-monospace,Menlo,monospace!important;letter-spacing:.12em!important;text-transform:uppercase!important} /* a kicker above a page H1 sits on its own line, one fixed gap above the H1 */ :is(.doc,.nlbrain,.gl13,.scene,#center) :is(.k,.kick,.snk,.eyebrow):has(+h1){display:block!important;margin:0 0 var(--g-kh)!important} /* page H1: one size everywhere */ .doc .din h1,.doc .hx h1,.doc .crh h1,.doc .arghero h1,.doc .about2 h1,#center.nlsk .hero h1,#center.nlsk .crhead h1,#center.nlsk .card.nlgh h1,.nlbrain h1,.snd h1,.gl13 .lhead h1,.scene .lhead h1{font:700 var(--t-h1)/1.15 Poppins,Geist,system-ui,sans-serif!important;letter-spacing:-.01em!important;margin:0 0 var(--g-hl)!important} /* the welcome H1 (Good afternoon, Richard / Richard, what shall we work on today) is the one larger heading */ .doc h1.wel{font-size:var(--t-wel)!important} /* H2 to H6 inside page content */ :is(.doc,.nlbrain,.scene,.gl13) h2{font-family:Poppins,Geist,system-ui,sans-serif!important;font-size:var(--t-h2)!important;font-weight:700!important;line-height:1.2!important} :is(.doc,.nlbrain,.scene,.gl13) h3{font-family:Poppins,Geist,system-ui,sans-serif!important;font-size:var(--t-h3)!important;font-weight:600!important;line-height:1.35!important} :is(.doc,.nlbrain,.scene,.gl13) h4{font-family:Poppins,Geist,system-ui,sans-serif!important;font-size:var(--t-h4)!important;font-weight:600!important} :is(.doc,.nlbrain,.scene,.gl13) h5{font-family:Poppins,Geist,system-ui,sans-serif!important;font-size:var(--t-h5)!important;font-weight:600!important} :is(.doc,.nlbrain,.scene,.gl13) h6{font-family:Poppins,Geist,system-ui,sans-serif!important;font-size:var(--t-h6)!important;font-weight:600!important} /* page header blocks: the same small top padding, start at the top, no extra gaps */ .doc :is(.pgh,.hx,.crh,.about2),#center.nlsk .hero,.gl13 .lhead,.scene .lhead{padding-top:var(--g-hd)!important} #center.nlsk .hero,.gl13 .lhead{gap:0!important} .doc :is(.hx,.crh){align-items:start!important} /* v12nn (Richard, 9 Nov 2026): Meet Arguta, the space above the picture and the orange line matches the 22px at the side (it was 3px) */ .doc .arghero{padding-top:22px!important} /* Academy centre column: the scroll area already gives the top gap, so the column adds none (it doubled the gap on Help, Skill Bank, First 7 days and the rest) */ #center.nlsk{padding-top:0!important} #center.nlsk .crhead{padding-top:var(--g-hd)!important} #center.nlsk .crhead .crcover>span{gap:0!important} /* course lesson header (crumb, then kicker and H1) starts at the same gap */ #stage>.lhead{padding-top:var(--g-hd)!important} /* course lesson heading block: kicker to H1 and H1 to text use the same gaps as every other page */ .scene .lhead{gap:0!important} .scene .lhead>*+*{margin-top:8px} .scene .lhead>h1+*{margin-top:0!important} /* a lesson's crew tags (mk-row) sit under the heading text, so the kicker stays one fixed gap above the H1 */ .scene .lhead>.mk-row{order:9} :is(.scene,.gl13) .eyebrow:has(+.mk-row+h1){display:block!important;margin:0 0 var(--g-kh)!important} .scene .lhead>.mk-row+h1{margin-top:0!important} /* App and Studio workspace: the welcome H1 has no kicker, so it starts where a kicker would */ .doc .wsl .din{padding-top:calc(36px + var(--g-hd))!important} /* Academy Admin: page title is a page H1; the orange card titles are kickers */ html.nl .main .mainin .phd{padding-top:var(--g-hd)!important} html.nl .main .mainin .phd h1{font:700 var(--t-h1)/1.15 Poppins,Geist,system-ui,sans-serif!important;letter-spacing:-.01em!important;margin:0 0 var(--g-hl)!important} html.nl .main .mainin .card h2{font:500 var(--t-k)/1.4 Geist Mono,ui-monospace,Menlo,monospace!important;letter-spacing:.12em!important;text-transform:uppercase!important} /* no extra zoom inside a page: Going live and the course lessons follow the html size like every other page */ .snd .gl13:not(.w13rafin),.scene{zoom:1!important} /* ===== ACADEMY ADMIN IN THE NEW LOOK (v12lk, 9 Nov 2026). Richard: no old orange pills, orange buttons or purple-to-orange bars in the admin; every control has a hover. Covers the parts drawn by the shared report and Meta libraries, which are not in admin.php. ===== */ body.adm .mainin :is(button,input[type=submit]):not(.lnkb):not(.gh):not(.btn2):not(.ghost):not([data-ts]){background:#7c3aed!important;background-image:none!important;border:1px solid #7c3aed!important;color:#fff!important;border-radius:10px!important;font-weight:600;cursor:pointer} body.adm .mainin :is(button,input[type=submit]):not(.lnkb):not(.gh):not(.btn2):not(.ghost):not([data-ts]):hover{background:#6d28d9!important;border-color:#c4a8ff!important} body.adm .mainin :is(button,input[type=submit]):disabled{opacity:.55;cursor:default} body.adm .mainin .rp-pill{background:transparent!important;background-image:none!important;border:1px solid #2a1f3d!important;border-radius:10px!important;color:#c4b8e0!important;font-weight:500} body.adm .mainin .rp-pill:hover{border-color:#8b5cf6!important;color:#f3eaff!important} body.adm .mainin .rp-pill.on{background:#24183a!important;border-color:#8b5cf6!important;color:#f3eaff!important;font-weight:600} body.adm .mainin .rp-cols>div{background:linear-gradient(0deg,#4c1d95,#7c3aed)!important} body.adm .mainin .rp-dot.a,body.adm .mainin em>i.m{background:#7c3aed!important} /* App left column: the page or job you are on is outlined, the same as the Studio pages list (v12lk, Richard 9 Nov 2026) */ .left .pnl .brainb.on,.left .list li.on{background:#24183a!important;border:1px solid #8b5cf6!important;color:#f3eaff} /* ===== FRAME AND LABEL LOCK (v12ll, 9 Nov 2026). Richard: every element constant across the Academy, course, Admin, App and Studio. ===== */ /* every small orange (or status) label in mono capitals is one kicker size and weight */ :is(.list li.gh,.doc .jn,.doc .ej small,.doc .lv .lt,.doc .crport>span,.doc .cmp.mx tr.g td,.doc .fpin,#center .f7d,.nlob .kick,.kick,.crdivide span,.nlbrain .k,.scene .kf-st,#stage .crumb .chip,.mnav .mn-lab){font-family:Geist Mono,ui-monospace,Menlo,monospace!important;font-size:var(--t-k,11px)!important;font-weight:500!important;letter-spacing:.12em!important} /* left column menu rows: one height, one radius, one active look on every platform (side columns stay 340, slide-outs 380) */ :is(html.nl .side .sp,.left .list li:not(.gh):not([data-k]):not([data-prof]),.left .pnl .brainb){min-height:36px!important;padding-top:0!important;padding-bottom:0!important;border-radius:10px!important;box-sizing:border-box!important} html.nl .side .sp.on{background:#24183a!important;border-color:#8b5cf6!important} /* course lesson list: rows match the menu rows on every platform */ #side button.li{min-height:36px!important;padding-top:0!important;padding-bottom:0!important;border-radius:10px!important;border:1px solid transparent!important;box-sizing:border-box!important} #side button.li>span:not(.ck):not(.lm){font-size:14px!important} #side button.li:hover{border-color:#8b5cf6!important} #side button.li.now{background:#24183a!important;border-color:#8b5cf6!important;color:#f3eaff!important} /* the bar at the top of the centre panel is one height on every platform and every view (Studio's workspace bar was shorter) */ :is(.dtool,.stage .stool,html.nl .nlbar:not([hidden])){min-height:59.3px!important;box-sizing:border-box!important} /* one orange everywhere: the App and Studio base sheet sets --amb to #f59e0b on :root; this wins (v12lm) */ html:root{--amb:#F7931A} /* Academy admin: the centre content is twice as wide (2240 instead of 1120); on smaller screens it fills the panel (Richard, 9 Nov 2026). The core admin gets the same when it moves to this design. */ html.nl body.adm:has(.hnav) .main .mainin{max-width:2240px!important} /* ===== Going live (course 13.2 and Studio): balanced path cards, a clear 20i button, and Ava shown properly (v12ls, Richard 9 Nov 2026) ===== */ .gl13 .w13cards.w2{align-items:stretch} .gl13 .w13c{display:flex!important;flex-direction:column;gap:10px} .gl13 .w13c .tk{flex:none} .gl13 .w13c .w13avasw{min-height:64px;box-sizing:border-box} .gl13 .w13acts{margin-top:auto;display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:8px} .gl13 .w13acts>*{width:100%;margin:0!important} .gl13 .w13go20{display:flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:0 14px;border-radius:10px;border:1px solid #F7931A;background:rgba(247,147,26,.12);color:#f3eaff;font:600 14px/1 Geist,system-ui,sans-serif;cursor:pointer} .gl13 .w13go20:hover{background:rgba(247,147,26,.22)} /* ===== Meet Ava on Going live (v12lu, Richard 9 Nov 2026): room to breathe, and Ava's panel built exactly like the Arguta panel in the right column (same orb format, chips, bubbles, text box, Speak and Send, same font sizes) ===== */ .gl13 .w13ava3{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:44px;align-items:start;margin-top:28px;padding:36px 36px 40px;border-radius:14px;border:1px solid #2a1f3d;background:#140d1f} .gl13 .w13avl{display:grid;gap:22px;min-width:0;align-content:start} .gl13 .w13avl>.eyebrow{margin-bottom:-14px!important} .gl13 .w13avl h2{margin:0!important} .gl13 .w13avl h2 em{font-style:normal;color:#b794ff} .gl13 .w13avlead{margin:0;max-width:680px;font:16px/1.65 Geist,system-ui,sans-serif;color:#d8cdef} .gl13 .w13vs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;padding-top:22px;border-top:1px solid #2a1f3d} .gl13 .w13vs>div,.gl13 .w13avaf>div{display:grid;gap:12px;align-content:start} .gl13 .w13vs ul{list-style:none;margin:0;padding:0;display:grid;gap:10px} .gl13 .w13vs li{position:relative;padding-left:22px;font:14px/1.55 Geist,system-ui,sans-serif;color:#d8cdef} .gl13 .w13vs .vsold li{color:#a99cc8} .gl13 .w13vs .vsold li::before{content:"×";position:absolute;left:2px;color:#7f739c;font-weight:700} .gl13 .w13vs .vsnew li::before{content:"✓";position:absolute;left:0;color:#3ddc97;font-weight:700} .gl13 .w13avaf{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:32px;padding-top:22px;border-top:1px solid #2a1f3d} .gl13 .w13avaf p{margin:0;font:14px/1.55 Geist,system-ui,sans-serif;color:#a99cc8} .gl13 .w13try{margin:0;font:600 14px/1.5 Geist,system-ui,sans-serif;color:#b794ff} /* Ava's panel: the right-column Arguta panel, measured and copied */ .gl13 .avx{--bright:#a35bff;--deep:#4c1d95;display:flex;flex-direction:column;gap:12px;box-sizing:border-box;padding:16px;border-radius:14px;border:1px solid #2a1f3d;background:#0f0a18;color:#f3eaff;font:14px/1.45 Geist,system-ui,sans-serif} .gl13 .avx button{font-family:inherit;cursor:pointer} .gl13 .avx-h{display:flex;align-items:center;gap:10px} .gl13 .avx-h>div{flex:1 1 0%;min-width:0;display:grid} .gl13 .avx-h b{font:600 14px/1.3 Geist,system-ui,sans-serif;color:#f3eaff} .gl13 .avx-h small{font:300 12px/1.4 Geist,system-ui,sans-serif;color:#a99cc8} .gl13 .avx-hb{height:38px;padding:0 14px;border-radius:10px;border:1px solid rgba(243,234,255,.18);background:rgba(11,7,17,.25);color:#f3eaff;font:500 13px Geist,system-ui,sans-serif} .gl13 .avx-hb:hover{border-color:#8b5cf6} .gl13 .avx-mini,.gl13 .avx-orb{position:relative;display:block;flex:none} .gl13 .avx-mini{width:30px;height:30px} .gl13 .avx-mini span,.gl13 .avx-orb span{position:absolute;inset:0;border-radius:50%} .gl13 .avx-mini .o1{border:1.5px solid var(--bright);animation:axr 7s linear infinite;border-radius:46% 54% 52% 48%} .gl13 .avx-mini .core{inset:9px;background:radial-gradient(circle,#fff,var(--bright) 60%,transparent 72%)} .gl13 .avx-stage{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 0 4px} .gl13 .avx-orb{width:140px;height:140px;border:0;background:none;padding:0;filter:drop-shadow(0 0 20px color-mix(in srgb,var(--bright) 55%,transparent))} .gl13 .avx-orb .o1{border:1.5px solid color-mix(in srgb,var(--bright) 75%,#fff);animation:axr 7s linear infinite;border-radius:46% 54% 52% 48%} .gl13 .avx-orb .o2{inset:7px;border:1.5px solid color-mix(in srgb,var(--deep) 30%,#fff 40%);animation:axr 9s linear infinite reverse;border-radius:52% 48% 45% 55%;opacity:.7} .gl13 .avx-orb .o3{inset:15px;border:1px solid color-mix(in srgb,var(--bright) 60%,transparent);animation:axr 5s linear infinite;border-radius:49% 51% 55% 45%} .gl13 .avx-orb .core{inset:45px;background:radial-gradient(circle at 40% 35%,#fff,color-mix(in srgb,var(--bright) 70%,#fff) 35%,transparent 72%);filter:blur(1px);animation:axb 3.2s ease-in-out infinite} @keyframes axr{100%{transform:rotate(360deg)}} @keyframes axb{50%{transform:scale(1.18);opacity:.75}} .gl13 .avx[data-mode=listen] .avx-orb .o1,.gl13 .avx[data-mode=speak] .avx-orb .o1{animation-duration:2s} .gl13 .avx[data-mode=listen] .avx-orb .core,.gl13 .avx[data-mode=speak] .avx-orb .core{animation-duration:.8s} .gl13 .avx[data-mode=think] .avx-orb .o2{animation-duration:1.6s} .gl13 .avx-hi{margin-top:6px;font:600 19px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .gl13 .avx-st{font:300 13px/1.4 Geist,system-ui,sans-serif;color:#a99bbd} .gl13 .avx-log{flex:1 1 auto;max-height:260px;overflow:auto;display:flex;flex-direction:column;gap:10px} .gl13 .avx-b{max-width:88%;padding:9px 11px;border-radius:12px;border:1px solid #2a1f3d;font:400 14px/1.45 Geist,system-ui,sans-serif} .gl13 .avx-b.a{align-self:flex-start;background:rgba(62,50,80,.92);color:#f3eaff} .gl13 .avx-b.u{align-self:flex-end;background:#7c3aed;border-color:#7c3aed;color:#fff} .gl13 .avx-b.w{opacity:.7} .gl13 .avx-chips{display:flex;flex-wrap:wrap;gap:6px} .gl13 .avx-chips button{padding:5px 9px;border-radius:999px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:400 12px/1.35 Geist,system-ui,sans-serif} .gl13 .avx-chips button:hover{border-color:#8b5cf6} .gl13 .avx-in{display:grid;gap:8px} .gl13 .avx-ta{width:100%;box-sizing:border-box;height:78px;resize:none;padding:8px 10px;border-radius:10px;border:1px solid #2a1f3d;background:#0f0a18;color:#f3eaff;font:300 14px/1.4 Geist,system-ui,sans-serif;outline:none} .gl13 .avx-ta:focus{border-color:#8b5cf6} .gl13 .avx-row{display:flex;align-items:center;gap:8px} .gl13 .avx-note{flex:1 1 auto;min-width:0;text-align:center;font:300 12px/1.4 Geist,system-ui,sans-serif;color:#a99cc8} .gl13 .avx-speak,.gl13 .avx-send{height:38px;padding:0 13px;border-radius:10px;font-size:14px} .gl13 .avx-speak{border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font-weight:400} .gl13 .avx-speak:hover{border-color:#8b5cf6} .gl13 .avx-send{border:1px solid #7c3aed;background:#7c3aed;color:#fff;font-weight:600} .gl13 .avx-send:hover{background:#6d28d9;border-color:#c4a8ff} .gl13 .avx-f{margin:0;font:300 12px/1.4 Geist,system-ui,sans-serif;color:#7f739c} @media (prefers-reduced-motion:reduce){.gl13 .avx-orb span,.gl13 .avx-mini span{animation:none}} @media(max-width:1100px){.gl13 .w13ava3{grid-template-columns:1fr}.gl13 .avx{max-width:380px}} @media(max-width:700px){.gl13 .w13vs,.gl13 .w13avaf{grid-template-columns:1fr}.gl13 .w13ava3{padding:22px 18px}} /* ===== Centred page headers everywhere (v12lu, Richard 9 Nov 2026): Business Brain and the Studio feed sections match Agents, Skill Bank and Downloads ===== */ .snd:not(.snapp) .sec>:is(.k,.snk,.eyebrow,h2,.snlead){text-align:center!important} .snd:not(.snapp) .sec>:is(.k,.snk,.eyebrow){display:block} .snd:not(.snapp) .sec>.snlead{max-width:680px;margin-left:auto!important;margin-right:auto!important} .snd:not(.snapp) .sec>.snbtns{display:flex;justify-content:center;flex-wrap:wrap;gap:10px} /* v12lv: Studio Going live header and the App workspace welcome centred like every other App and Studio page header. The course keeps its left-aligned lesson headers. */ .snd .gl13 .lhead{text-align:center!important;display:grid;justify-items:center} .snd .gl13 .lhead>p{max-width:680px;margin-left:auto!important;margin-right:auto!important} .ws .din:not(.thr)>:is(h1.wel,p.lead){text-align:center!important} .ws .din:not(.thr)>p.lead{max-width:680px;margin-left:auto!important;margin-right:auto!important} .gl13 .avx-log:empty{display:none} /* v12lx: Ava's panel has the Arguta panel's Clear chat (five seconds to undo) and a Settings box */ .gl13 .avx-h .avx-hb{flex:none} .gl13 .avx-gear{width:38px;padding:0!important;display:grid;place-items:center} .gl13 .avx-hb.undo{border-color:#F7931A!important;color:#ffd9a8!important} .gl13 .avx{position:relative;isolation:isolate} .gl13 .avx-sheet{position:absolute;inset:0;z-index:5;display:flex;align-items:flex-end;border-radius:14px;background:rgba(11,7,17,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)} .gl13 .avx-sheet[hidden]{display:none} .gl13 .avx-sheet .ag-card{width:100%;margin:12px;padding:18px;border-radius:18px;background:rgba(30,20,46,.96);border:1px solid rgba(243,234,255,.18);color:#f3eaff;font:300 14px/1.45 Geist,system-ui,sans-serif;max-height:calc(100% - 24px);overflow:auto;box-sizing:border-box} .gl13 .avx-sheet h3{margin:0 0 8px!important;font:600 17px/1.45 Geist,system-ui,sans-serif!important;color:#f3eaff} .gl13 .avx-sheet .ag-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid rgba(243,234,255,.1)} .gl13 .avx-sheet .ag-row small{display:block;color:#a99bbd;font-size:12.5px} .gl13 .avx-sheet .ag-tg{flex:none;position:relative;width:46px;height:26px;border-radius:99px;border:1px solid rgba(243,234,255,.25);background:rgba(11,7,17,.5);cursor:pointer;padding:0} .gl13 .avx-sheet .ag-tg::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#a99bbd;transition:transform .2s,background .2s} .gl13 .avx-sheet .ag-tg[aria-checked="true"]{background:#7a3ff0;border-color:#a35bff} .gl13 .avx-sheet .ag-tg[aria-checked="true"]::after{transform:translateX(20px);background:#fff} .gl13 .avx-sheet .ag-acts{display:flex;gap:8px;margin-top:12px} .gl13 .avx-sheet .ag-acts button.pri{min-height:42px;padding:0 16px;border-radius:999px;border:0;background:linear-gradient(135deg,#5b2bd6,#a35bff);color:#fff;font:600 14px Geist,system-ui,sans-serif} .gl13 .avx-b.sys{align-self:center;max-width:none;background:none;border:0;padding:2px 0;font-size:12px;color:#a99cc8} .gl13 .avx.big .avx-b,.gl13 .avx.big .avx-ta{font-size:16px} .gl13 .avx[data-voice=off] .avx-speak{display:none} /* v12lx: the Arguta settings box, the same on the App and Studio as on the Academy */ .right .tab .ag-sheet{position:absolute;inset:0;z-index:30;display:flex;align-items:flex-end;background:rgba(11,7,17,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)} .right .tab .ag-sheet[hidden]{display:none} .right .tab .ag-card{width:100%;margin:12px;padding:18px;border-radius:18px;background:rgba(30,20,46,.96);border:1px solid rgba(243,234,255,.18);color:#f3eaff;font:300 14px/1.45 Geist,system-ui,sans-serif;max-height:calc(100% - 24px);overflow:auto;box-sizing:border-box} .right .tab .ag-card h3{margin:0 0 8px;font:600 17px/1.45 Geist,system-ui,sans-serif;color:#f3eaff} .right .tab .ag-card .ag-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid rgba(243,234,255,.1)} .right .tab .ag-card .ag-row small{display:block;color:#a99bbd;font-size:12.5px} .right .tab .ag-tg{flex:none;position:relative;width:46px;height:26px;border-radius:99px;border:1px solid rgba(243,234,255,.25);background:rgba(11,7,17,.5);cursor:pointer;padding:0} .right .tab .ag-tg::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#a99bbd;transition:transform .2s,background .2s} .right .tab .ag-tg[aria-checked="true"]{background:#7a3ff0;border-color:#a35bff} .right .tab .ag-tg[aria-checked="true"]::after{transform:translateX(20px);background:#fff} .right .tab .ag-lk{flex:none;height:34px;padding:0 14px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:400 13px Geist,system-ui,sans-serif;cursor:pointer} .right .tab .ag-lk:hover{border-color:#8b5cf6} .right .tab .ag-acts{display:flex;gap:8px;margin-top:12px} .right .tab .ag-acts button.pri{min-height:42px;padding:0 16px;border-radius:999px;border:0;background:linear-gradient(135deg,#5b2bd6,#a35bff);color:#fff;font:600 14px Geist,system-ui,sans-serif;cursor:pointer} html.ag-novoice .right .tab .ag-speak{display:none!important} /* v12ly: Ava's panel runs the full height of the section, so the chat area above the shortcuts is longer, like a real site panel */ .gl13 .w13ava3{align-items:stretch} .gl13 .avx{height:100%;min-height:600px} .gl13 .avx-log{flex:1 1 auto;max-height:none;min-height:0} .gl13 .avx-log:empty{display:flex} @media(max-width:1100px){.gl13 .avx{height:auto;min-height:560px}} /* v12lz: Studio feed spacing (the feed only: .snd:not(.snapp); v12nn stopped it leaking into the App pages shown in Studio, which drew brighter dividers and different gaps). The divider sits midway between blocks; the lead, buttons and card rows each get room */ .snd:not(.snapp) .sec{margin-top:40px!important;padding-top:40px!important} .snd:not(.snapp) .pgh+.sec{margin-top:10px!important} .snd:not(.snapp) .sec{border-top:1px solid #2a1f3d!important} .snd:not(.snapp) .sec>.snlead{margin-bottom:0!important} .snd:not(.snapp) .sec>.snbtns{margin:22px 0 0!important} .snd:not(.snapp) .sec>.snlead+.snbtns+.sngrid,.snd:not(.snapp) .sec>.snbtns+.sngrid{margin-top:32px!important} .snd:not(.snapp) .sec>.sngrid+.sngrid{margin-top:14px!important} .snd:not(.snapp) .sec>.sngrid+.snbtns{margin-top:32px!important} /* ===== MASTER BUTTON STATES (v12ma, Richard 9 Nov 2026): every button has a hover, a press and a focus ring, out of the box. Ghost buttons: purple edge and a lifted fill on hover. Main buttons: deeper purple with a light edge. Applies on every platform and every Studio page. ===== */ :is(button,a,[role=button]):is(.ghost,.btn,.gh,.ag-lk,.avx-hb,.avx-speak,.w13go20), .snbtns button,.acb button,.lhead button,.w13acts>*,.avx-chips button,.ag-acts button,.ag-tg{transition:background-color .15s ease,border-color .15s ease,color .15s ease,box-shadow .15s ease,transform .1s ease} :is(button,a,[role=button]):is(.ghost,.gh,.ag-lk,.avx-hb,.avx-speak):not(:disabled):hover, .gl13 .btn:not(.o):not(.main):not(:disabled):hover, #center .btn.gh:not(:disabled):hover, .snbtns button:not(.main):not(:disabled):hover, .acb button:not(.main):not(:disabled):hover, .lhead button:not(.main):not(.o):not(:disabled):hover, .avx-chips button:hover{border-color:#8b5cf6!important;background-color:#24183a!important;color:#f3eaff!important} :is(button,a):is(.main,.pri,.go,.avx-send):not(:disabled):hover, .btn.o:not(:disabled):hover, html.nl #center.nlsk .btn:not(.gh):not(:disabled):hover, .snbtns button.main:not(:disabled):hover{background:#6d28d9!important;border-color:#c4a8ff!important;color:#fff!important} :is(button,a,[role=button]):not(:disabled):active{transform:translateY(1px)} :is(button,a,[role=button],input,select,textarea,summary):focus-visible{outline:2px solid #a35bff!important;outline-offset:2px!important} :is(button,[role=button]):disabled{opacity:.5;cursor:not-allowed} /* ===== Artifacts in the App (v12mb, Richard 9 Nov 2026) ===== */ .pnl.arts{flex:none;max-height:30vh;overflow:auto} .list li.more{cursor:pointer;justify-content:center} .list li.more span{font:500 12.5px Geist,system-ui,sans-serif;color:#b794ff} .list li.more:hover span{color:#d6c2ff} .list li .ic{margin-left:auto;font:500 10.5px Geist Mono,ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:#a99cc8} .artin>:is(.k,h1,.lead){text-align:center!important} .artin>.lead{max-width:680px;margin-left:auto!important;margin-right:auto!important} .artin .artbtns{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;margin:22px 0 0} .artin .artsec{margin-top:40px;padding-top:40px;border-top:1px solid #3a2c52} .artin .artsec>:is(.k,h2){text-align:center;display:block} .artin .artsec>h2{margin:0 0 24px!important} .artin .artg{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px} .artin .artc{display:grid;gap:6px;align-content:start;text-align:left;padding:16px;border-radius:12px;border:1px solid #2a1f3d;background:#1a1228;color:#f3eaff;cursor:pointer;font:inherit;transition:border-color .15s,background-color .15s} .artin .artc:hover{border-color:#8b5cf6;background:#24183a} .artin .artc b{font:600 15px/1.35 Geist,system-ui,sans-serif} .artin .artc small{font:300 12.5px/1.4 Geist,system-ui,sans-serif;color:#a99cc8} .artin .artc .ghost{justify-self:start;margin-top:6px} .artin .artnone{text-align:center} .artin .artarch{text-align:center;margin:22px 0 0} .artin .artcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px} .artin .artcols>div{padding:18px;border-radius:12px;border:1px solid #2a1f3d;background:#1a1228} .artin .artcols h3{margin:0 0 8px!important} .artin .artcols p{margin:0;font:14px/1.6 Geist,system-ui,sans-serif;color:#d8cdef} .artin .artsteps{max-width:680px;margin:0 auto;padding-left:20px;display:grid;gap:10px;font:15px/1.6 Geist,system-ui,sans-serif;color:#d8cdef} .artin .artsec>.hint{text-align:center;max-width:680px;margin:22px auto 0} .artseg{display:inline-flex;border:1px solid #2a1f3d;border-radius:10px;overflow:hidden} .artseg button{height:34px;padding:0 12px;border:0!important;border-radius:0!important;background:#1b1229;color:#d8cdef;font:400 13px Geist,system-ui,sans-serif;cursor:pointer} .artseg button:hover{background:#24183a;color:#f3eaff} .artseg button.on{background:#24183a;color:#f3eaff;box-shadow:inset 0 0 0 1px #8b5cf6} .artview{display:grid;gap:14px;padding:20px 24px 28px} .artmeta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px} .artmeta>b{font:600 17px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .artmeta>small{font:300 13px Geist,system-ui,sans-serif;color:#a99cc8} .artacts{display:flex;flex-wrap:wrap;gap:8px;margin-left:auto} .artacts .btnl{display:inline-flex;align-items:center;height:34px;padding:0 12px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:400 13px Geist,system-ui,sans-serif;text-decoration:none} .artacts .btnl:hover{border-color:#8b5cf6;background:#24183a} .artfr{width:100%;height:calc(100vh - 260px);min-height:520px;border:1px solid #2a1f3d;border-radius:12px;background:#fff} .artnote{margin:0;font:300 12.5px Geist,system-ui,sans-serif;color:#a99cc8} .artnote .artlink{color:#d6c2ff;word-break:break-all} .arttoast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%);z-index:999;max-width:520px;padding:12px 16px;border-radius:12px;border:1px solid #8b5cf6;background:#1e142e;color:#f3eaff;font:400 14px/1.45 Geist,system-ui,sans-serif;box-shadow:0 12px 30px rgba(0,0,0,.4)} @media (max-width:800px), (max-width:1400px) and (hover:none) and (pointer:coarse){.artin .artcols{grid-template-columns:1fr}.artacts{margin-left:0}} /* v12mc: one kicker gap everywhere. The small orange label sits 10px above any heading (H1 to H3), on every page and platform */ :is(.doc,.nlbrain,.gl13,.scene,#center,#page,.snd) :is(.k,.kick,.snk,.eyebrow):is(:has(+h1),:has(+h2),:has(+h3)){display:block!important;margin:0 0 var(--g-kh)!important;line-height:1.4!important} :is(.doc,.nlbrain,.gl13,.scene,#center,#page,.snd) :is(.k,.kick,.snk,.eyebrow)+:is(h1,h2,h3){margin-top:0!important} /* v12mc: text boxes inside a composer box take no second ring; the box shows focus instead */ :is(.wsc,.ag-ask,.avx-in,form) textarea:is(:focus,:focus-visible),:is(.wsc,.ag-ask,form) input[type=text]:is(:focus,:focus-visible){outline:none!important;box-shadow:none!important} .wsc form:focus-within,.ag-ask:focus-within{border-color:#8b5cf6!important} .gl13 .avx-ta:focus{border-color:#8b5cf6!important} /* v12mc: artifact chat (talk here, the page opens in its own tab) */ .dtool .dcr a.artcr{color:inherit!important;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px} .dtool .dcr a.artcr:hover{color:#f3eaff!important} .dtool .btnl{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 14px;border-radius:10px;text-decoration:none;font:600 13px Geist,system-ui,sans-serif} .dtool a.main.btnl{background:#7c3aed;border:1px solid #7c3aed;color:#fff} .artpop{position:relative;display:inline-flex} .artpopb{position:absolute;top:calc(100% + 8px);right:0;z-index:50;width:300px;display:grid;gap:10px;padding:14px;border-radius:14px;border:1px solid rgba(243,234,255,.18);background:rgba(30,20,46,.98);box-shadow:0 18px 40px rgba(0,0,0,.45);color:#f3eaff;font:300 13px/1.45 Geist,system-ui,sans-serif;text-align:left} .artpopb>b{font:600 15px Geist,system-ui,sans-serif} .artpopb .artseg{display:flex}.artpopb .artseg button{flex:1} .artpopb .artsh{color:#a99bbd;font-size:12.5px} .artpopb .artlinkrow{display:flex;gap:8px} .artpopb .artlinkrow input{flex:1;min-width:0;height:34px;padding:0 10px;border-radius:10px;border:1px solid #2a1f3d;background:#0f0a18;color:#d8cdef;font:300 12px Geist Mono,ui-monospace,monospace} .artpopb .artlinkrow .main{height:34px;padding:0 14px;border-radius:10px} .artpopb>button{display:block;width:100%;text-align:left;height:36px;padding:0 10px;border-radius:10px;border:1px solid transparent;background:none;color:#f3eaff;font:400 13.5px Geist,system-ui,sans-serif;cursor:pointer} .artpopb>button:hover{background:#24183a;border-color:#8b5cf6} .artpopb:has(>button){width:220px;gap:2px;padding:8px} .thr .artempty{text-align:center;padding:40px 16px 8px} .thr .artempty>.k{display:block;margin:0 0 var(--g-kh)} .thr .artempty>h2{margin:0 0 10px} .thr .artempty>.lead{max-width:600px;margin:0 auto} .thr .artnote2{align-self:flex-start;max-width:640px;padding:14px 16px;border-radius:14px;border:1px solid #2a1f3d;background:#1a1228;display:grid;gap:6px} .thr .artnote2>b{font:600 13px Geist,system-ui,sans-serif;color:#b794ff} .thr .artnote2>p{margin:0;font:15px/1.55 Geist,system-ui,sans-serif;color:#f3eaff} .thr .artnote2.wait>p{color:#a99cc8} .thr .artnote2 .artopen{justify-self:start;display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;text-decoration:none;font:500 13px Geist,system-ui,sans-serif;transition:border-color .15s,background-color .15s} .thr .artnote2 .artopen:hover{border-color:#8b5cf6;background:#24183a} /* v12md: artifact bar buttons a size up, with room before Preview as; the Share box laid out like Claude's */ .artbar .dbtn{gap:10px} .artbar .dbtn>.btnl,.artbar .dbtn>.artpop>button{min-height:38px!important;padding:0 18px!important;border-radius:10px!important;font:600 13.5px Geist,system-ui,sans-serif!important} .artbar .dbtn>a.main.btnl{min-width:104px} .artbar .dbtn>.artpop>button{min-width:92px} .artbar .dbtn>.artpop+:not(.artpop){margin-left:18px} .artpopb:has(.asb-h){width:400px;gap:0;padding:0;border-radius:16px;overflow:hidden} .artpopb .asb-h{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:18px 20px 12px} .artpopb .asb-h b{font:600 16px/1.3 Geist,system-ui,sans-serif;color:#f3eaff;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .artpopb .asb-x{flex:none;width:32px;height:32px;border-radius:8px;border:1px solid transparent;background:none;color:#d8cdef;font:400 20px/1 Geist,system-ui,sans-serif;cursor:pointer} .artpopb .asb-x:hover{border-color:#8b5cf6;background:#24183a} .artpopb .asb-tabs{display:flex;margin:0 20px 8px;padding:3px;border-radius:10px;background:#0f0a18;border:1px solid #2a1f3d} .artpopb .asb-tabs button{flex:1;height:34px;border:0;border-radius:8px;background:none;color:#a99cc8;font:500 14px Geist,system-ui,sans-serif;cursor:pointer} .artpopb .asb-tabs button.on{background:#24183a;color:#f3eaff;box-shadow:inset 0 0 0 1px #8b5cf6} .artpopb .asb-p{display:grid;gap:10px;padding:8px 20px 18px} .artpopb .asb-l{font:400 13px Geist,system-ui,sans-serif;color:#a99cc8;margin-top:6px} .artpopb .asb-row{display:flex;align-items:center;gap:12px} .artpopb .asb-av{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#7c3aed;color:#fff;font:600 13px Geist,system-ui,sans-serif} .artpopb .asb-who{flex:1;min-width:0;display:grid} .artpopb .asb-who b{font:500 14px/1.3 Geist,system-ui,sans-serif;color:#f3eaff} .artpopb .asb-who b span{color:#a99cc8;font-weight:400} .artpopb .asb-who small{font:300 12.5px Geist,system-ui,sans-serif;color:#a99cc8;overflow:hidden;text-overflow:ellipsis} .artpopb .asb-role{font:400 13px Geist,system-ui,sans-serif;color:#7f739c} .artpopb .asb-ic{flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#1b1229;border:1px solid #2a1f3d;color:#f3eaff} .artpopb .asb-sel select{appearance:none;-webkit-appearance:none;height:36px;padding:0 30px 0 12px;border-radius:10px;border:1px solid #3a2c52;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d8cdef' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 8px center/14px;color:#f3eaff;font:500 14.5px Geist,system-ui,sans-serif;cursor:pointer} .artpopb .asb-sel select:hover{border-color:#8b5cf6;background-color:#24183a} .artpopb .asb-sel select option{background:#1e142e;color:#f3eaff} .artpopb .asb-ex{display:grid;gap:4px;width:100%;text-align:left;padding:12px 14px;border-radius:12px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:500 14px Geist,system-ui,sans-serif;cursor:pointer} .artpopb .asb-ex small{font:300 12.5px Geist,system-ui,sans-serif;color:#a99cc8} .artpopb .asb-ex:hover{border-color:#8b5cf6;background:#24183a} .artpopb .asb-f{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 20px;border-top:1px solid #2a1f3d;background:rgba(15,10,24,.6)} .artpopb .asb-f small{font:300 13px Geist,system-ui,sans-serif;color:#a99cc8} .artpopb .asb-copy{flex:none;display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:500 13.5px Geist,system-ui,sans-serif;cursor:pointer} .artpopb .asb-copy:hover{border-color:#8b5cf6;background:#24183a} .artpopb .asb-p[hidden]{display:none} /* v12me: a short guide at the top of the artifact chat, pointing to Open and Share top right */ .thr .artguide{position:relative;display:flex;gap:14px;align-items:flex-start;padding:16px 18px;border-radius:14px;border:1px dashed #3a2c52;background:rgba(26,18,40,.6)} .thr .artguide .artarrow{position:absolute;top:-6px;right:14px;font:600 26px/1 Geist,system-ui,sans-serif;color:#b794ff;animation:artnudge 1.8s ease-in-out infinite} @keyframes artnudge{50%{transform:translate(4px,-4px)}} @media (prefers-reduced-motion:reduce){.thr .artguide .artarrow{animation:none}} .thr .artguide>div>b{display:block;margin:0 0 8px;font:600 14px Geist,system-ui,sans-serif;color:#f3eaff} .thr .artguide ul{margin:0;padding-left:18px;display:grid;gap:6px;font:14px/1.55 Geist,system-ui,sans-serif;color:#d8cdef} .thr .artguide ul b{color:#f3eaff;font-weight:600} /* v12mf: Export in the App's Share box, as in Claude */ .artpopb .asb-p[data-asbp=export]:not([hidden]){gap:6px} .artpopb .asb-send{display:flex;gap:12px;padding:14px;border-radius:12px;background:#140d1f;border:1px solid #2a1f3d;margin-bottom:6px} .artpopb .asb-send b{display:block;font:600 14px Geist,system-ui,sans-serif;color:#f3eaff} .artpopb .asb-send p{margin:4px 0 10px;font:300 13px/1.5 Geist,system-ui,sans-serif;color:#a99cc8} .artpopb .asb-send small{display:block;margin-top:8px;font:300 12px Geist,system-ui,sans-serif;color:#a99cc8} .artpopb .asb-xr{display:flex;align-items:center;gap:12px;width:100%;padding:8px 6px;border-radius:10px;border:1px solid transparent;background:none;color:#f3eaff;text-decoration:none;text-align:left;font:inherit;cursor:pointer;transition:border-color .15s,background-color .15s} .artpopb .asb-xr:hover{border-color:#8b5cf6;background:#24183a} .artpopb .asb-xi{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;background:#1b1229;border:1px solid #2a1f3d;color:#f3eaff} .artpopb .asb-xt{flex:1;display:grid} .artpopb .asb-xt b{font:500 14px Geist,system-ui,sans-serif} .artpopb .asb-xt small{font:300 12.5px Geist,system-ui,sans-serif;color:#a99cc8} .artpopb .asb-xd{color:#a99cc8;display:grid} .artpopb .asb-f[hidden]{display:none} /* v12mh: left-column rows brighten a touch more on hover, on every platform */ .left .list li:not(.gh):not(.lock):not([style]):hover,.left .pnl .brainb:not(:disabled):not(.on):hover{border-color:#5b4a7a!important;background:rgba(36,24,58,.55)!important} .thr .artearlier{text-align:center;margin:0} /* v12mm: an artifact opens inside the App: the page fills the centre panel under its own bar of tools */ #page.artpg{display:flex!important;flex-direction:column;height:100%;min-height:0;overflow:hidden!important} #page.artpg>.artbar{flex:none} #page.artpg>.artframe{flex:1 1 auto;min-height:0;width:100%;border:0;display:block;background:#fff} html.artmode #talk.on{border-color:#8b5cf6!important;background:#24183a!important} /* v12mn: an open artifact is an artifact window: no left column, no platform links; the page panel runs full width beside the Arguta panel */ html.artmode .shell{grid-template-columns:minmax(0,1fr) 340px!important} html.artmode .shell>.left{display:none!important} html.artmode .top .devs,html.artmode .top .mburger,html.artmode .top .mini,html.artmode .top .mtopb,html.artmode .top .acts>:not(.tsz):not(.artacts):not(#artclose){display:none!important} html.artmode .top .acts{gap:8px} .top .acts .artacts{display:inline-flex;align-items:center;gap:8px} .top .acts #artclose button{background:#F7931A!important;color:#000!important;border:1px solid #F7931A!important;font-weight:600;box-shadow:none;background-image:none!important} .top .acts #artclose:hover button{background:#ffa53d!important;border-color:#ffa53d!important} .top .artttl{display:flex;align-items:center;gap:10px;min-width:0;margin-left:28px;margin-right:auto} .top .artttl .tm{display:inline-flex;align-items:center;gap:6px;height:38.6px;padding:0 12px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:600 14.5px Geist,system-ui,sans-serif;max-width:36vw;cursor:pointer;transition:border-color .15s,background-color .15s} .top .artttl .tm:hover{border-color:#8b5cf6;background:#24183a} .top .artttl .tm span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .top .artttl>small{font:300 12.5px Geist,system-ui,sans-serif;color:#a99cc8;white-space:nowrap} .top .artttl .artpopb{left:0;right:auto} .artpopb.artmenu{width:240px;gap:2px;padding:8px} .artpopb .mh{display:grid;gap:2px;padding:6px 10px}.artpopb .mh small{font:300 12.5px Geist,system-ui,sans-serif;color:#a99cc8} .artpopb hr{border:0;border-top:1px solid #2a1f3d;margin:4px 2px;width:auto} .artpopb>button.dang{color:#ff9b9b} /* v12mo: Share in the artifact window is the purple main button with the link arrow, like the header links; a little more room between buttons */ .top .acts .artacts{gap:10px} html.artmode .top .acts{gap:10px} .top .acts .artacts .artsharebtn{background:#7c3aed!important;border:1px solid #7c3aed!important;color:#fff!important;font-weight:600!important;background-image:none!important;box-shadow:none!important} .top .acts .artacts .artsharebtn::after{content:"\2197";margin-left:6px;font-size:.85em;opacity:.9} .top .acts .artacts .artsharebtn:hover{background:#6d28d9!important;border-color:#c4a8ff!important} /* v12mp: every button in the artifact window has the hover; a page with no background of its own shows the App's panel behind it */ .top .acts .artacts>button:hover,.top .acts .artacts .artpop>button:not(.artsharebtn):hover,.top .artttl .tm:hover{border-color:#8b5cf6!important;background:#24183a!important;color:#f3eaff!important} .top .acts .artacts>button,.top .acts .artacts .artpop>button{transition:border-color .15s,background-color .15s} #page.artpg>.artframe{background:transparent!important;color-scheme:normal} /* v12mr: Send to Studio (outlined, with the arrow), undo and redo beside the page name, version history, start points and card thumbnails */ .top .acts .artacts .artstudiobtn{background:transparent!important;border:1px solid #8b5cf6!important;color:#f3eaff!important;font-weight:600!important;background-image:none!important;box-shadow:none!important} .top .acts .artacts .artstudiobtn::after{content:"\2197";margin-left:6px;font-size:.85em;opacity:.9} .top .acts .artacts .artstudiobtn:hover{background:#24183a!important;border-color:#c4a8ff!important} .top .artttl .artur{display:inline-flex;gap:4px} .top .artttl .artic{width:38.6px;height:38.6px;display:grid;place-items:center;padding:0;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;cursor:pointer;transition:border-color .15s,background-color .15s} .top .artttl .artic:not(:disabled):hover{border-color:#8b5cf6;background:#24183a} .top .artttl .artic:disabled{opacity:.35;cursor:default} .artpopb.arthist{width:320px;max-height:60vh;overflow:auto} .artpopb .arthv{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border-radius:8px} .artpopb .arthv span{display:grid}.artpopb .arthv b{font:500 13.5px Geist,system-ui,sans-serif;color:#f3eaff}.artpopb .arthv small{font:300 12px Geist,system-ui,sans-serif;color:#a99cc8} .artpopb .arthv.on{background:#24183a;box-shadow:inset 0 0 0 1px #8b5cf6}.artpopb .arthv em{font:500 12px Geist,system-ui,sans-serif;font-style:normal;color:#b794ff} .artpopb .arthv .ghost{height:30px;padding:0 10px;border-radius:8px;font-size:12.5px} .artpopb>hr{border:0;border-top:1px solid #2a1f3d;margin:4px 2px} .artin .artstarts{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;margin:16px 0 0} .artin .artstarts .hint{margin-right:4px} .artin .artstarts .ghost{height:34px;padding:0 14px;border-radius:999px;font-size:13px} .artin .artc{overflow:hidden} .artin .artthumb{display:block;height:130px;margin:-16px -16px 10px;border-bottom:1px solid #2a1f3d;background:#0f0a18;overflow:hidden;position:relative;pointer-events:none} .artin .artthumb iframe{position:absolute;top:0;left:0;width:400%;height:400%;border:0;transform:scale(.25);transform-origin:0 0;background:transparent;color-scheme:normal} /* v12ms: the crew member's face and name on artifact work; Studio's Tools, Your pages, bin, undo and redo */ .artby{display:inline-flex;align-items:center;gap:8px;font:600 13px Geist,system-ui,sans-serif;color:#b794ff} .artby img{width:22px;height:22px;border-radius:50%;object-fit:cover;border:1px solid #2a1f3d} .b.ava .artby{display:flex;margin:0 0 6px} .left .pnl.yp #ypl li{display:flex;align-items:center;gap:6px} .left .pnl.yp #ypl li>span{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .left .pnl.yp.flash{box-shadow:0 0 0 2px #8b5cf6;border-radius:12px;transition:box-shadow .3s} .left .pnl a.brainb{text-decoration:none} .stbinrow{position:relative;display:flex;justify-content:flex-end;margin-top:6px} .stbinbox{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:40;display:grid;gap:4px;padding:10px;border-radius:12px;border:1px solid rgba(243,234,255,.18);background:#1e142e;box-shadow:0 14px 34px rgba(0,0,0,.45)} .stbinbox .sbh{display:grid;gap:2px;padding:2px 4px 6px;border-bottom:1px solid #2a1f3d;margin-bottom:4px} .stbinbox .sbh b{font:600 14px Geist,system-ui,sans-serif;color:#f3eaff}.stbinbox .sbh small,.stbinbox .hint{font:300 12px Geist,system-ui,sans-serif;color:#a99cc8} .stbinbox .sbr{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:6px 4px;border-radius:8px} .stbinbox .sbr:hover{background:#24183a} .stbinbox .sbr span{display:grid;min-width:0}.stbinbox .sbr b{font:500 13px Geist,system-ui,sans-serif;color:#f3eaff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.stbinbox .sbr small{font:300 11.5px Geist,system-ui,sans-serif;color:#a99cc8} .stool .stur{display:inline-flex;gap:4px;margin-right:6px} .stool .stic{width:34px;min-width:34px;padding:0!important;display:inline-grid;place-items:center} .stool .stic:disabled{opacity:.35;cursor:default} .left .pnl.tools{display:grid;gap:2px} .left .pnl.tools .brainb{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;box-sizing:border-box;min-height:36px;padding:0 10px;border-radius:10px;border:1px solid transparent;background:none;color:#f3eaff!important;font:500 13.5px Geist,system-ui,sans-serif;text-align:left;text-decoration:none!important;cursor:pointer} .left .pnl.tools .brainb small{font:500 11px Geist,system-ui,sans-serif;color:#F7931A} .left .pnl.tools .brainb.soon{opacity:.55;cursor:default}.left .pnl.tools .brainb.soon small{color:#a99cc8} /* v12mt: Tools look and sit the same on every platform (the Academy's tool buttons): 36px, a defined fill and edge, 6px apart. Lists below stay 36px rows, 4px apart. */ .left .pnl.tools{display:grid!important;gap:6px!important} .left .pnl.tools .brainb{margin:0!important;min-height:36px!important;height:36px;padding:0 12px!important;border-radius:10px!important;border:1px solid #2a1f3d!important;background:#1b1229!important;color:#f3eaff!important;font:400 14px Geist,system-ui,sans-serif!important;display:flex!important;align-items:center;justify-content:space-between;gap:8px;width:100%;box-sizing:border-box;text-align:left} .left .pnl.tools .brainb:not(:disabled):not(.on):hover{background:#24183a!important;border-color:#5b4a7a!important} .left .pnl.tools .brainb.on{background:#24183a!important;border-color:#8b5cf6!important} .left .pnl.tools .brainb.soon,.left .pnl.tools .brainb:disabled{opacity:.6} .left .pnl.tools>.ph{margin-bottom:0} .left #ypl li.on{background:#24183a!important;border:1px solid #8b5cf6!important} /* Studio: no Back to course; members build and go live from here */ .stool #bBack{display:none!important} /* Studio: the Business Brain page and a page from Your pages */ .snd .snbm{display:flex;align-items:center;justify-content:center;gap:12px;margin:24px auto 28px;max-width:680px} .snd .snbm .bm{flex:1;max-width:360px;height:8px;border-radius:99px;background:#2a1f3d;overflow:hidden}.snd .snbm .bm i{display:block;height:100%;background:linear-gradient(90deg,#4c1d95,#7c3aed)} .snd .snbm b{font:500 13px Geist,system-ui,sans-serif;color:#d8cdef} .snd .snbrain{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px} .snd .snbp{display:grid;gap:8px;padding:16px;border-radius:12px;border:1px solid #2a1f3d;background:#1a1228} .snd .snbh{display:grid;gap:4px}.snd .snbh b{font:600 15px Geist,system-ui,sans-serif;color:#f3eaff}.snd .snbh small{font:300 13px/1.5 Geist,system-ui,sans-serif;color:#a99cc8} .snd .snbp textarea{width:100%;box-sizing:border-box;min-height:110px;resize:vertical;padding:10px 12px;border-radius:10px;border:1px solid #2a1f3d;background:#0f0a18;color:#f3eaff;font:300 14px/1.5 Geist,system-ui,sans-serif} .snd .snbp textarea:focus{outline:none;border-color:#8b5cf6} .snd.snyp{display:flex;flex-direction:column;height:100%;min-height:100%} .snd .snypbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-bottom:1px solid #2a1f3d} .snd .snypbar>span{display:flex;align-items:center;gap:10px}.snd .snypbar>span:first-child{display:grid;gap:2px} .snd .snypbar b{font:600 15px Geist,system-ui,sans-serif;color:#f3eaff}.snd .snypbar small{font:300 12.5px Geist,system-ui,sans-serif;color:#a99cc8} .snd .snypfr{flex:1;width:100%;min-height:70vh;border:0;background:#fff} @media(max-width:900px){.snd .snbrain{grid-template-columns:1fr}} /* v12mv: Studio's Business Brain matches the App's (interview and Read my website, ticks, character counts); the App's Brain header centred like the App's other page headers */ .snd .snbhelp{margin-bottom:16px} .snd .snbhelp .snbp{align-content:start} .snd .snbgo{justify-self:start;display:inline-flex;align-items:center;min-height:36px;padding:0 16px;border-radius:10px;background:#7c3aed;border:1px solid #7c3aed;color:#fff;font:600 13.5px Geist,system-ui,sans-serif;text-decoration:none} .snd .snbgo:hover{background:#6d28d9;border-color:#c4a8ff} .snd .snbweb{display:flex;gap:8px} .snd .snbweb input{flex:1;min-width:0;height:36px;padding:0 12px;border-radius:10px;border:1px solid #2a1f3d;background:#0f0a18;color:#f3eaff;font:300 14px Geist,system-ui,sans-serif} .snd .snbweb input:focus{outline:none;border-color:#8b5cf6} .snd .snok{font-style:normal;color:#3ddc97;font-weight:700} .snd .snbc{justify-self:end;font:300 12px Geist,system-ui,sans-serif;color:#a99cc8} /* v12mx: one centre-panel frame on every platform (Studio's): the scroll gutter on the right only, the breadcrumb 22px in from the panel edge, the right-hand buttons 22px in, and the line under the bar running the full width of the panel */ html.nl .nlscroll{scrollbar-gutter:stable!important} #page.doc,.doc#page{scrollbar-gutter:stable!important} .snd{scrollbar-gutter:stable!important} html.nl .nlscroll>.nlbar,#page>.dtool{padding-left:22px!important;padding-right:calc(22px - var(--gut,0px))!important;border-bottom-color:transparent!important} html.nl .nlpanel:has(>.nlscroll>.nlbar:not([hidden])),#fw:has(>#page>.dtool){position:relative} html.nl .nlpanel:has(>.nlscroll>.nlbar:not([hidden]))::after,#fw:has(>#page>.dtool)::after{content:"";position:absolute;left:0;right:0;top:calc(59.8px - 1px);height:1px;background:#2a1f3d;pointer-events:none;z-index:6} html[data-skin="light"].nl .nlpanel:has(>.nlscroll>.nlbar:not([hidden]))::after{background:#e3dcec} /* v12my: empty-list hints wrap onto two lines and never widen the left column */ .left .list li[style] .hint,.left #ypl li .hint,.left #artl li .hint,.left #ths li .hint{white-space:normal!important;display:block;line-height:1.45;overflow-wrap:anywhere} .left .list li[style]{height:auto!important;min-height:36px;padding-top:8px!important;padding-bottom:8px!important} .left{overflow-x:hidden!important} /* v12mz: the Bin as a row in the left column (Studio: opens in place with Restore; App: opens the artifacts bin) */ .stbinrow{display:block!important;margin-top:4px} .stbinlink,.left #artl li.artbinli{display:flex!important;align-items:center;gap:8px;width:100%;box-sizing:border-box;min-height:36px;padding:0 8px;border-radius:10px;border:1px solid transparent;background:none;color:#a99cc8;font:400 14px Geist,system-ui,sans-serif;cursor:pointer;text-align:left} .stbinlink:hover,.left #artl li.artbinli:hover{border-color:#5b4a7a;background:rgba(36,24,58,.55);color:#f3eaff} .stbinlink span{flex:1}.stbinlink small,.left #artl li.artbinli small{margin-left:auto;font:500 11px Geist,system-ui,sans-serif;color:#F7931A} .stbinlink i{font-style:normal;font-size:11px;transition:transform .15s}.stbinlink.open i{transform:rotate(180deg)} .stbinbox.stbinin{position:static!important;box-shadow:none;margin-top:4px;background:#140d1f} /* v12na (Richard, 9 Nov 2026): the top of each side column lines up with the centre panel's bar and stays put; only the part below scrolls. Left: the Feed / New job block is 72.9px tall (to the line under the centre bar), fixed at the top. Right (App, Studio): the tab row the same. Scrollbars start below the fixed top, in the side columns and in the centre panel, as in the pinned Overview panel. */ aside.left>.pnl:first-child,html.nl #side .nlpnl.nlfirst{flex:none!important;position:sticky!important;top:0;z-index:5;height:72.9px!important;box-sizing:border-box!important;padding:13px 12px 0!important;display:flex!important;align-items:center;background:#140d1f!important} aside.left>.pnl:first-child>*,html.nl #side .nlpnl.nlfirst>*{width:100%} aside.right>.tabs{height:72.9px!important;box-sizing:border-box!important;padding:13px 10px 0!important;display:flex!important;align-items:center;flex:none} aside.right>.tabs>*{flex:1} /* scrollbars that start below the fixed tops (Chrome and Edge; other browsers keep the thin purple bar) */ @supports selector(::-webkit-scrollbar){ aside.left,html.nl #side,#page.doc,html.nl .nlscroll{scrollbar-width:auto!important;scrollbar-color:auto!important} aside.left::-webkit-scrollbar,html.nl #side::-webkit-scrollbar,#page.doc::-webkit-scrollbar,html.nl .nlscroll::-webkit-scrollbar{width:11px;height:11px} aside.left::-webkit-scrollbar-thumb,html.nl #side::-webkit-scrollbar-thumb,#page.doc::-webkit-scrollbar-thumb,html.nl .nlscroll::-webkit-scrollbar-thumb{background:#4a3878;border-radius:999px;border:2px solid transparent;background-clip:padding-box} aside.left::-webkit-scrollbar-thumb:hover,html.nl #side::-webkit-scrollbar-thumb:hover,#page.doc::-webkit-scrollbar-thumb:hover,html.nl .nlscroll::-webkit-scrollbar-thumb:hover{background:#A35BFF;background-clip:padding-box} aside.left::-webkit-scrollbar-track,html.nl #side::-webkit-scrollbar-track{background:transparent;margin-top:72.9px} #page.doc::-webkit-scrollbar-track,html.nl .nlscroll::-webkit-scrollbar-track{background:transparent;margin-top:59.8px} aside.left::-webkit-scrollbar-button,html.nl #side::-webkit-scrollbar-button,#page.doc::-webkit-scrollbar-button,html.nl .nlscroll::-webkit-scrollbar-button{display:none;height:0} } /* left-column hover: a clearer edge, on every platform (drawn inside, so nothing moves) */ .left .list li:not(.gh):not(.lock):not([style]):hover,.left .pnl .brainb:not(:disabled):not(.on):hover,.left .pnl.tools .brainb:not(:disabled):not(.on):hover,html.nl .side .sp:not(.on):hover,html.nl #side .list li:not(.on):hover,.stbinlink:hover,.left #artl li.artbinli:hover{box-shadow:inset 0 0 0 1px #7b62b0!important;background:#24183a!important} /* v12nc: the right panel's tab row (Arguta, Overview) in the Academy, the course and the Academy admin lines up with the centre bar, like the left column */ html.nl .nlright>.nltabs{height:72.9px!important;box-sizing:border-box!important;padding:13px 10px 0!important;align-items:center!important;flex:none!important} /* v12ne (Richard, 9 Nov 2026): one scrollbar everywhere, the App's: 11px, a purple bar with no arrows top or bottom, no track, and no change on hover. Chrome and Edge draw it from these rules; other browsers keep their thin purple bar. */ @supports selector(::-webkit-scrollbar){ *{scrollbar-color:auto!important} :not(.apnav):not(.hnav):not(.hscroll):not(.tabs):not(.nlbb):not([data-noscroll]){scrollbar-width:auto!important} *::-webkit-scrollbar{width:11px!important;height:11px!important;background:transparent!important} *::-webkit-scrollbar-track{background:transparent!important} *::-webkit-scrollbar-thumb,*::-webkit-scrollbar-thumb:hover,*::-webkit-scrollbar-thumb:active{background:#4a3878!important;border-radius:999px!important;border:2px solid transparent!important;background-clip:padding-box!important} *::-webkit-scrollbar-button{display:none!important;width:0!important;height:0!important} *::-webkit-scrollbar-corner{background:transparent!important} } /* ===== v12nm (Richard, 9 Nov 2026) BUSINESS BRAIN: ONE COMPONENT, ONE RULE SET ===== The App (#page .brain), Studio (.snd .brain) and the Academy (#center .nlbrain) draw the same page, so they use these rules and no others. The local copies in console/index.php, academy/assets/newlook.css and the older patch blocks in this sheet were removed. Measurements were taken live from the App. Change the Brain here and nowhere else. */ :is(#page .brain,.snd .brain,#center .nlbrain){--cl:#2a1f3d;--cb:#1a1228;--cm:#c4b8e0;--ct:#f3eaff;color:var(--ct);font:400 14px/20.3px Geist,system-ui,sans-serif} :is(.lite .brain,.snd.lite .brain,.snd .lite .brain,html[data-skin="light"] .nlbrain){--cl:#e3dcec;--cb:#ffffff;--cm:#5d5470;--ct:#1b1325} html.nl .nlscroll #center.col .nlbrain,#center.col .nlbrain{padding-top:0!important} /* heading block, centred */ :is(#page .brain,.snd .brain,#center .nlbrain)>:is(.k,h1,.lead){text-align:center!important} :is(#page .brain,.snd .brain,#center .nlbrain)>.k{display:block;font:500 11px/15.4px "Geist Mono",ui-monospace,Menlo,monospace!important;letter-spacing:.12em;text-transform:uppercase;color:#F7931A;margin:0 0 10px!important} :is(#page .brain,.snd .brain,#center .nlbrain)>h1{margin:0 0 10px!important;color:var(--ct)} :is(#page .brain,.snd .brain,#center .nlbrain)>h1 em{font-style:normal;color:#b794ff} :is(#page .brain,.snd .brain,#center .nlbrain)>.lead{font:400 16px/25.6px Geist,system-ui,sans-serif!important;color:var(--cm);max-width:680px;margin:0 auto 22px!important} /* parts filled in */ :is(#page .brain,.snd .brain,#center .nlbrain) .bmeter{display:flex;align-items:center!important;justify-content:center;gap:12px;height:19px;min-height:19px;margin:24px 0 20px!important;font:400 14px/20.3px Geist,system-ui,sans-serif!important} :is(#page .brain,.snd .brain,#center .nlbrain) .bm{flex:1;max-width:360px;height:8px;border-radius:99px;background:var(--cl);overflow:hidden} :is(#page .brain,.snd .brain,#center .nlbrain) .bm i{display:block;height:100%;background:linear-gradient(90deg,#8b5cf6,#6d28d9)!important} :is(#page .brain,.snd .brain,#center .nlbrain) .bmeter b{display:block;font:500 13px Geist,system-ui,sans-serif!important;padding:0 0 1px;color:var(--cm)} /* the two help boxes */ :is(#page .brain,.snd .brain,#center .nlbrain) .bhelp{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px!important;margin:0 0 14px!important} :is(#page .brain,.snd .brain,#center .nlbrain) .bh{border:1px solid var(--cl);background:var(--cb);border-radius:14px;padding:16px!important;box-sizing:border-box;font:400 14px/20.3px Geist,system-ui,sans-serif} :is(#page .brain,.snd .brain,#center .nlbrain) .bh h3{font:600 16px/21.6px Poppins,Geist,system-ui,sans-serif!important;margin:0 0 4px!important;color:var(--ct)} :is(#page .brain,.snd .brain,#center .nlbrain) .bh p{font:400 14px/22.4px Geist,system-ui,sans-serif!important;margin:0 0 10px!important;color:var(--cm)} :is(#page .brain,.snd .brain,#center .nlbrain) .bweb{display:flex;gap:8px} /* buttons: one size everywhere */ :is(#page .brain,.snd .brain,#center .nlbrain) :is(.bh button,.bh a.main,.bweb button,.bsr button,.bsr .main){display:inline-flex!important;align-items:center;justify-content:center;height:38.6px!important;min-height:0!important;padding:8px 12px!important;box-sizing:border-box!important;border-radius:10px!important;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;font:400 14px/20.3px Geist,system-ui,sans-serif!important;text-decoration:none;cursor:pointer;transition:border-color .15s,background-color .15s} :is(#page .brain,.snd .brain,#center .nlbrain) :is(.bh,.bsr,.bweb) :is(button,a):is(.main,.bmain){background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;font-weight:600!important} :is(#page .brain,.snd .brain,#center .nlbrain) :is(.bh button,.bweb button,.bsr button):not(.main):not(.bmain):not(:disabled):hover{border-color:#5b4a7a;background:#24183a} :is(#page .brain,.snd .brain,#center .nlbrain) :is(.bh,.bsr,.bweb) :is(button,a):is(.main,.bmain):not(:disabled):hover{background:#6d28d9!important;border-color:#c4a8ff!important} /* fields: no fill, one thin border, one brighter border when you click in */ :is(#page .brain,.snd .brain,#center .nlbrain) .bweb input{flex:1;min-width:0;height:38.6px!important;padding:8px 10px!important;box-sizing:border-box!important;border-radius:10px!important;font:400 14px/20.3px Geist,system-ui,sans-serif!important;color:var(--ct)} :is(#page .brain,.snd .brain,#center .nlbrain) textarea{width:100%;box-sizing:border-box;resize:vertical;min-height:110px!important;padding:8px 10px!important;border-radius:10px;color:var(--ct);font:400 13px/19.5px Geist,system-ui,sans-serif!important} :is(#page .brain,.snd .brain,#center .nlbrain) textarea::placeholder{font:400 13px/19.5px Geist,system-ui,sans-serif} :is(#page .brain,.snd .brain,#center .nlbrain) :is(.bweb input,textarea){background:transparent!important;border:1px solid var(--cl)!important;outline:none!important;box-shadow:none!important;transition:border-color .15s} :is(#page .brain,.snd .brain,#center .nlbrain) :is(.bweb input,textarea):hover{border-color:#4a3878!important} :is(#page .brain,.snd .brain,#center .nlbrain) :is(.bweb input,textarea):is(:focus,:focus-visible){border-color:#A35BFF!important;outline:none!important;box-shadow:none!important} /* Saved line, centred */ :is(#page .brain,.snd .brain,#center .nlbrain) .bnote{text-align:center!important;color:#3ddc97;font:400 14px/20.3px Geist,system-ui,sans-serif!important;margin:0 0 14px!important} :is(.lite .brain,.snd.lite .brain,html[data-skin="light"] .nlbrain) .bnote{color:#047857} /* the ten cards */ :is(#page .brain,.snd .brain,#center .nlbrain) .bgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px!important} :is(#page .brain,.snd .brain,#center .nlbrain) .bcard{display:grid!important;gap:6px!important;margin:0!important;border:1px solid var(--cl);background:var(--cb);border-radius:14px;padding:14px 16px!important;color:var(--ct)} :is(#page .brain,.snd .brain,#center .nlbrain) .bcard.done{border-color:rgba(139,92,246,.55)} :is(#page .brain,.snd .brain,#center .nlbrain) .bcard.sug{border-color:#F7931A} :is(#page .brain,.snd .brain,#center .nlbrain) .bt{font:600 15px Poppins,Geist,system-ui,sans-serif!important} :is(#page .brain,.snd .brain,#center .nlbrain) .bt i{font:400 15px/1 Geist,system-ui,sans-serif!important;font-style:normal!important;color:#3ddc97;-webkit-font-smoothing:antialiased} :is(#page .brain,.snd .brain,#center .nlbrain) .bq{font:400 13px/18.85px Geist,system-ui,sans-serif!important;color:var(--cm)} :is(#page .brain,.snd .brain,#center .nlbrain) .bc{font:400 11px/15.95px Geist,system-ui,sans-serif!important;color:var(--cm);text-align:right} /* Save row and the line under it, centred */ :is(#page .brain,.snd .brain,#center .nlbrain) .bsr{display:flex;flex-wrap:wrap;justify-content:center;gap:10px!important} :is(#page .brain,.snd .brain,#center .nlbrain)>.hint{text-align:center;color:var(--cm);font:400 12px/19.2px Geist,system-ui,sans-serif!important;margin:12px 0!important} @media(max-width:900px){:is(#page .brain,.snd .brain,#center .nlbrain) :is(.bhelp,.bgrid){grid-template-columns:1fr}} /* ===== end Business Brain ===== */ /* ===== v12nm SHELL: the Academy's frame pulled onto the App's measurements (measured live, App vs Studio vs Academy, 9 Nov 2026) ===== Studio already matched the App on every measured part. The Academy differed in five places, fixed here once for all Academy pages. */ /* left column: the same inner width whether or not it scrolls (the scrollbar space is always kept), on all three */ aside.left,html.nl #side{scrollbar-gutter:stable} /* left column: 6px from a heading to its first button (was 8), and 4px between menu rows (was 0), as in the App and Studio */ html.nl #side .nlpnl .nlph{margin-bottom:6px!important} html.nl #side .nlpnl .sp:not(.nltool)+.sp:not(.nltool){margin-top:4px!important} /* right panel: tab buttons 4px apart (was 6) */ html.nl .nlright>.nltabs{gap:4px!important} /* right panel: Clear chat, the same as the App: 14px each side and one normal space between the words. The Academy's button splits "Clear" and " chat" into two pieces, which added a 6px gap; a local rule then shrank the padding to hide it (removed from newlook.css). */ html.nl .nlright #agPanel.nldock #agNew.ag-tb,html.nl .nlright #agPanel #agNew.ag-tb{padding-left:14px!important;padding-right:14px!important} html.nl .nlright #agPanel #agNew .ag-wide{margin-left:calc(.25em - 6px)!important} /* right panel: the empty voice gauge under the orb took 8px; it only takes space while it shows something */ #agPanel .ag-orbwrap .ag-gauge:empty{display:none!important} /* ===== end shell ===== */ /* ===== v13a SHARED DEFAULTS: CARDS (Tue 10 Nov 2026). One card for the App, Studio and the Academy. Change the look here only. A card that must differ gets a named add-on below, never a local rule. */ :root,:host{--card-pad:18px 20px;--card-pad-m:16px;--card-r:14px} :where(.doc,.snd,#center,.nlbrain,.nlob,#page) :where(.card,.pwc,.fact,.acc,.fdo,.sncard,.own){background:var(--p-card,#1a1228);border:1px solid var(--p-line,#2a1f3d);border-radius:var(--card-r);padding:var(--card-pad)} @media(max-width:760px){:where(.doc,.snd,#center,.nlbrain,.nlob,#page) :where(.card,.pwc,.fact,.acc,.fdo,.sncard,.own){padding:var(--card-pad-m)}} /* add-ons (the pricing card .pcx keeps its own 20px 16px, set in the plans block) */ :where(.doc,#center,#page) .fdo{border-color:#f7931a} :where(.doc,#page) .own{border-color:var(--vio,#8b5cf6)} :where(#page,.doc) .card.err{border-color:#7f1d1d} /* ===== v13b SHARED DEFAULTS: CHIPS AND CORNER TAGS. A chip is a small rounded label in a line of text (Soon, plan labels, locks). A corner tag sits on the top edge of a card (Recommended, You are here). Size and spacing live here only; colour add-ons say what the label means. */ :root,:host{--chip-font:600 10.5px/1 Geist,system-ui,sans-serif;--chip-pad:0 8px;--chip-h:20px;--tag-font:600 11px/1.4 Geist,system-ui,sans-serif;--tag-pad:3px 9px} :where(.doc,.snd,#center,#page,.nlob,#right,.nlover) :is(.lpl,.soon,.soonlab,.lockpill){display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;height:var(--chip-h);font:var(--chip-font);font-style:normal;letter-spacing:0;padding:var(--chip-pad);border-radius:999px;vertical-align:middle} :where(.doc,.snd,#center,#page,.nlob,.w13c,.w13rafi) :is(.tag){font:var(--tag-font);padding:var(--tag-pad);border-radius:999px} /* add-ons */ :where(#center,.doc) .lockpill{border:1px solid var(--p-line,#2a1f3d);color:#a99cc8;white-space:nowrap} /* ===== v13c SHARED DEFAULTS: BUTTONS. The App's sizes are the standard on every platform. Standard: 14px, 8px by 12px, 10px corners (about 39px high). Big: 44px high, 20px sides (hero and call-to-action). Main is purple, plain is dark with a line. Add-ons may change colour, never size. */ :root,:host{--btn-font:600 14px/1.45 Geist,system-ui,sans-serif;--btn-pad:8px 12px;--btn-r:10px;--btnb-h:44px;--btnb-pad:0 20px} :where(html) :is(.btn,.pgh .acb button){display:inline-flex;align-items:center;justify-content:center;gap:6px;font:var(--btn-font);padding:var(--btn-pad);border-radius:var(--btn-r);min-height:0;white-space:nowrap;text-decoration:none} :where(html) :is(.btn){background:#7c3aed;border:1px solid #7c3aed;color:#fff} :where(html) :is(.btn.gh,.pgh .acb button){font-weight:400;background:#1b1229;border:1px solid var(--p-line,#2a1f3d);color:var(--p-h,#f3eaff)} :where(html) :is(.btn.big,.nlnews .nlnt .btn,.pgh .acb button){min-height:var(--btnb-h);padding:var(--btnb-pad);font-weight:600} /* add-ons */ :where(#center) .bchat>.btn{padding:12px 14px} /* ===== v13d SHARED DEFAULTS: FIELDS. The Business Brain field (v12nm) is the standard for every form field in page content: 14px, 8px by 10px, 10px corners, one line, purple line on focus. Phones use 16px so the page does not zoom when you tap a field. Chat boxes and tool-bar drop-downs keep their own look. */ :root,:host{--fld-font:400 14px/20.3px Geist,system-ui,sans-serif;--fld-pad:8px 10px;--fld-r:10px} :where(.doc,.snd,#center,#page,#right,.nlover,.sover) :is(.askf input,.askf select,.askf textarea){font:var(--fld-font);padding:var(--fld-pad);border-radius:var(--fld-r);border:1px solid var(--p-line,#2a1f3d);background:transparent;color:var(--p-h,#f3eaff);box-sizing:border-box} :where(.doc,.snd,#center,#page,#right,.nlover,.sover) :is(.askf input,.askf select){min-height:38.6px} :where(.doc,.snd,#center,#page,#right,.nlover,.sover) :is(.askf input,.askf select,.askf textarea):focus{outline:none;border-color:#8b5cf6} @media(max-width:760px){:where(.doc,.snd,#center,#page,#right,.nlover,.sover) :is(.askf input,.askf select,.askf textarea){font-size:16px}} /* ===== v13f: the Academy centre panel never scrolls sideways. The Feed's full-width hero layer is sized by script and could stick out by the scrollbar's width, which showed a horizontal scroll bar. Tables keep their own scroller. */ html.nl .nlscroll{overflow-x:hidden} /* ===== v13g: the Business Brain Save row sits one block gap below the last card, on all three platforms */ :is(#page .brain,.snd .brain,#center .nlbrain) .bsr{margin:24px 0 6px!important} /* ===== v13h PHONE. One heading scale for phones on every platform: the sizes step down once under 600px wide. */ :is(#page .brain,.snd .brain,#center .nlbrain)>h1{font:700 var(--t-h1)/1.15 Poppins,Geist,system-ui,sans-serif!important} @media(max-width:600px){:root,:host{--t-wel:32px;--t-h1:30px;--t-h2:22px}} /* App: on a phone the centre bar shows the page buttons only; the "Intro · Page" label sat on top of them */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){#page>.dtool>.by{display:none!important}} /* Academy Admin and the course player: the same small Arguta button on phones as the Academy */ @media(max-width:600px){html:is(.pf-adm,.pf-ply) .ag-pill{--ag-orb:76px;right:10px!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important} html:is(.pf-adm,.pf-ply) .ag-pill span{display:none!important} html:is(.pf-adm,.pf-ply) .ag-pill.scrolling{opacity:.18;transform:translateY(8px) scale(.94)}} /* course player on phones: one header bar (brand only; the course has its own menu), the course tool bar below it, the owner test tools as a row at the bottom, and the light-mode wordmark hidden in dark */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.nl.pf-ply .nltop{display:flex!important;align-items:center;height:56px;padding:0 14px!important;box-sizing:border-box;gap:10px;background:#140d1f;border-bottom:1px solid #2a1f3d;top:0;z-index:20} html.nl.pf-ply .nltop .nltabsnav{display:none!important} html.nl.pf-ply .nltop .brand{height:auto!important;align-items:center;gap:9px} html.nl.pf-ply .top-in>.brand{display:none!important} html.nl.pf-ply header.top:not(.nltop){top:56px} html.nl.pf-ply #ownFill{top:auto!important;bottom:62px!important;left:8px!important;right:8px!important;transform:none!important;width:auto!important;display:flex!important;flex-wrap:wrap;justify-content:center;gap:6px} html.nl.pf-ply #ownFill :is(button,span){white-space:nowrap!important;width:auto!important}} html.nl:not([data-skin="light"]) .nltop .bwm.ink{display:none!important} /* the "Preview as" label gives its room to the drop-down on phones */ @media(max-width:600px){.pvas>span{display:none!important}} /* ==================== v13e APP AND STUDIO BASE (was website-engine.css; only on app.arguta.ai and studio.arguta.ai) ==================== */ html:where(:is(.pf-app,.pf-studio)){--bg:#0b0711;--pan:#140d1f;--line:#2a1f3d;--txt:#f3eaff;--mut:#a99cc8;--vio:#8b5cf6;--amb:#f59e0b;--ok:#3ddc97} :where(html:is(.pf-app,.pf-studio)) [hidden]{display:none!important} html:where(:is(.pf-app,.pf-studio)),:where(html:is(.pf-app,.pf-studio)) *{box-sizing:border-box} html:where(:is(.pf-app,.pf-studio)),:where(html:is(.pf-app,.pf-studio)) body{height:100%;margin:0} :where(html:is(.pf-app,.pf-studio)) body{background:var(--bg);color:var(--txt);font:14px/1.45 Geist,system-ui,-apple-system,Segoe UI,sans-serif;display:flex;flex-direction:column;overflow:hidden} :where(html:is(.pf-app,.pf-studio)) button{font:inherit;cursor:pointer;border-radius:10px;border:1px solid var(--line);background:#1b1229;color:var(--txt);padding:8px 12px} :where(html:is(.pf-app,.pf-studio)) button:disabled{opacity:.45;cursor:not-allowed} :where(html:is(.pf-app,.pf-studio)) button.main{background:var(--vio);border-color:var(--vio);color:#fff;font-weight:600} :where(html:is(.pf-app,.pf-studio)) button.ghost:hover,:where(html:is(.pf-app,.pf-studio)) .mini:hover{border-color:var(--vio)} :where(html:is(.pf-app,.pf-studio)) .mini{padding:5px 9px;font-size:12px} :where(html:is(.pf-app,.pf-studio)) input,:where(html:is(.pf-app,.pf-studio)) select,:where(html:is(.pf-app,.pf-studio)) textarea{font:inherit;color:var(--txt);background:#0f0a18;border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%} :where(html:is(.pf-app,.pf-studio)) input[type=color]{padding:2px;height:38px} :where(html:is(.pf-app,.pf-studio)) label{display:block;color:var(--mut);font-size:12px;margin:0 0 10px} :where(html:is(.pf-app,.pf-studio)) label input,:where(html:is(.pf-app,.pf-studio)) label select{margin-top:4px} :where(html:is(.pf-app,.pf-studio)) .cols{display:grid;grid-template-columns:1fr 1fr;gap:10px} :where(html:is(.pf-app,.pf-studio)) .hint{color:var(--mut);font-size:12px} :where(html:is(.pf-app,.pf-studio)) .top:where(:not(.tops>*)){display:flex;align-items:center;gap:14px;padding:10px 14px;border-bottom:1px solid var(--line);background:var(--pan);flex-wrap:wrap} :where(html:is(.pf-app,.pf-studio)) .brand{display:flex;align-items:center;gap:10px;min-width:180px} :where(html:is(.pf-app,.pf-studio)) .brand img{width:34px;height:34px;border-radius:10px} :where(html:is(.pf-app,.pf-studio)) .brand small{display:block;color:var(--mut);max-width:220px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} :where(html:is(.pf-app,.pf-studio)) .devs{display:flex;gap:4px;margin:0 auto} :where(html:is(.pf-app,.pf-studio)) .devs button{padding:6px 10px;font-size:12px} :where(html:is(.pf-app,.pf-studio)) .devs .on{border-color:var(--vio);background:#24183a} :where(html:is(.pf-app,.pf-studio)) .acts{display:flex;gap:6px;align-items:center;flex-wrap:wrap} :where(html:is(.pf-app,.pf-studio)) .state{font-size:12px;color:var(--mut);margin-right:6px} :where(html:is(.pf-app,.pf-studio)) .state.ok{color:var(--ok)} :where(html:is(.pf-app,.pf-studio)) .state.warn{color:var(--amb)} :where(html:is(.pf-app,.pf-studio)) .shell{flex:1;display:grid;grid-template-columns:var(--col-l,340px) 1fr var(--col-r,340px);min-height:0} :where(html:is(.pf-app,.pf-studio)) .left,:where(html:is(.pf-app,.pf-studio)) .right{background:var(--pan);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;overflow:auto} :where(html:is(.pf-app,.pf-studio)) .right{border-right:0;border-left:1px solid var(--line)} :where(html:is(.pf-app,.pf-studio)) .pnl{padding:12px;border-bottom:1px solid var(--line)} :where(html:is(.pf-app,.pf-studio)) .pnl.grow{flex:1} :where(html:is(.pf-app,.pf-studio)) .ph{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px} :where(html:is(.pf-app,.pf-studio)) .list{list-style:none;margin:0;padding:0;display:grid;gap:4px} :where(html:is(.pf-app,.pf-studio)) .list li{display:flex;align-items:center;gap:6px;padding:7px 8px;border:1px solid transparent;border-radius:9px;cursor:pointer} :where(html:is(.pf-app,.pf-studio)) .list li:hover{border-color:var(--line)} :where(html:is(.pf-app,.pf-studio)) .list li.on{border-color:var(--vio);background:#1f1530} :where(html:is(.pf-app,.pf-studio)) .list li span{flex:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} :where(html:is(.pf-app,.pf-studio)) .list li .ic{padding:2px 5px;font-size:10.5px;flex:none;border-radius:6px;background:transparent;border:1px solid var(--line)} :where(html:is(.pf-app,.pf-studio)) .list li.hid span{opacity:.45;text-decoration:line-through} :where(html:is(.pf-app,.pf-studio)) .addrow{display:flex;gap:6px;margin-top:10px} :where(html:is(.pf-app,.pf-studio)) .stage{background:#05030a;display:flex;justify-content:center;min-height:0;overflow:auto;padding:12px} :where(html:is(.pf-app,.pf-studio)) .frameWrap{width:100%;height:100%;transition:width .3s;background:#fff;border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--line)} :where(html:is(.pf-app,.pf-studio)) .frameWrap.t{width:820px} :where(html:is(.pf-app,.pf-studio)) .frameWrap.m{width:390px} :where(html:is(.pf-app,.pf-studio)) iframe{width:100%;height:100%;border:0;display:block;background:#fff} :where(html:is(.pf-app,.pf-studio)) .tabs{display:flex;gap:4px;padding:10px;border-bottom:1px solid var(--line)} :where(html:is(.pf-app,.pf-studio)) .tabs button{flex:1;padding:7px} :where(html:is(.pf-app,.pf-studio)) .tabs .on{border-color:var(--vio);background:#24183a} :where(html:is(.pf-app,.pf-studio)) .tab{padding:12px;display:flex;flex-direction:column;gap:8px;min-height:0;flex:1} :where(html:is(.pf-app,.pf-studio)) .avahead{display:flex;gap:10px;align-items:center} :where(html:is(.pf-app,.pf-studio)) .avahead img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--vio)} :where(html:is(.pf-app,.pf-studio)) .avahead small{display:block;color:var(--mut)} :where(html:is(.pf-app,.pf-studio)) .chat{flex:1;min-height:180px;overflow:auto;display:flex;flex-direction:column;gap:8px;padding:4px 0} :where(html:is(.pf-app,.pf-studio)) .b{padding:9px 11px;border-radius:12px;max-width:92%;white-space:pre-wrap} :where(html:is(.pf-app,.pf-studio)) .b.me{align-self:flex-end;background:#2b1d45} :where(html:is(.pf-app,.pf-studio)) .b.ava{align-self:flex-start;background:#1a1426;border:1px solid var(--line)} :where(html:is(.pf-app,.pf-studio)) .b.sys{align-self:center;color:var(--mut);font-size:12px} :where(html:is(.pf-app,.pf-studio)) .sugs{display:flex;flex-wrap:wrap;gap:6px} :where(html:is(.pf-app,.pf-studio)) .sugs button{font-size:12px;padding:5px 9px;border-radius:999px} :where(html:is(.pf-app,.pf-studio)) .ask textarea{resize:vertical} :where(html:is(.pf-app,.pf-studio)) .askb{display:flex;align-items:center;gap:8px;margin-top:6px} :where(html:is(.pf-app,.pf-studio)) .askb .hint{flex:1} :where(html:is(.pf-app,.pf-studio)) #mic.rec{border-color:#ef4444;color:#fca5a5} :where(html:is(.pf-app,.pf-studio)) .modal{position:fixed;inset:0;background:rgba(5,3,10,.7);display:grid;place-items:center;z-index:30} :where(html:is(.pf-app,.pf-studio)) .mbox{background:var(--pan);border:1px solid var(--line);border-radius:14px;padding:16px;width:min(560px,94vw);max-height:80vh;overflow:auto} :where(html:is(.pf-app,.pf-studio)) .vlist{margin:0;padding-left:20px;display:grid;gap:8px} :where(html:is(.pf-app,.pf-studio)) .vlist li{padding:8px;border:1px solid var(--line);border-radius:10px} :where(html:is(.pf-app,.pf-studio)) .vlist .vb{display:flex;gap:6px;margin-top:6px} :where(html:is(.pf-app,.pf-studio)) .vlist .conf{color:var(--ok);font-size:12px} :where(html:is(.pf-app,.pf-studio)) .toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);background:#1f1530;border:1px solid var(--vio);padding:10px 14px;border-radius:12px;z-index:40} :where(html:is(.pf-app,.pf-studio)) .secf h4{margin:6px 0 10px} :where(html:is(.pf-app,.pf-studio)) .secf .item{border:1px solid var(--line);border-radius:10px;padding:8px;margin-bottom:8px} @media(max-width:1100px){:where(html:is(.pf-app,.pf-studio)) .shell{grid-template-columns:var(--col-lm,300px) 1fr var(--col-rm,300px)}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html:is(.pf-app,.pf-studio)) body{overflow:auto} :where(html:is(.pf-app,.pf-studio)) .shell{grid-template-columns:1fr;grid-auto-rows:auto} :where(html:is(.pf-app,.pf-studio)) .stage{height:70vh} :where(html:is(.pf-app,.pf-studio)) .left,:where(html:is(.pf-app,.pf-studio)) .right{border:0} :where(html:is(.pf-app,.pf-studio)) .devs{display:none}} html:where(:is(.pf-app,.pf-studio)),:where(html:is(.pf-app,.pf-studio)) *{scrollbar-width:thin;scrollbar-color:#4a3878 transparent} html:where(:is(.pf-app,.pf-studio))::-webkit-scrollbar,:where(html:is(.pf-app,.pf-studio)) *::-webkit-scrollbar{width:8px;height:8px} html:where(:is(.pf-app,.pf-studio))::-webkit-scrollbar-track,:where(html:is(.pf-app,.pf-studio)) *::-webkit-scrollbar-track{background:transparent} html:where(:is(.pf-app,.pf-studio))::-webkit-scrollbar-thumb,:where(html:is(.pf-app,.pf-studio)) *::-webkit-scrollbar-thumb{background:#4a3878;border-radius:999px;border:2px solid transparent;background-clip:padding-box} html:where(:is(.pf-app,.pf-studio))::-webkit-scrollbar-thumb:hover,:where(html:is(.pf-app,.pf-studio)) *::-webkit-scrollbar-thumb:hover{background:#A35BFF;background-clip:padding-box} html:where(:is(.pf-app,.pf-studio))::-webkit-scrollbar-corner,:where(html:is(.pf-app,.pf-studio)) *::-webkit-scrollbar-corner{background:transparent} :where(html:is(.pf-app,.pf-studio)) .mbox.wide{width:min(1200px,96vw);max-height:90vh} :where(html:is(.pf-app,.pf-studio)) .tgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:10px} :where(html:is(.pf-app,.pf-studio)) .tcardT{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#0f0a18;display:flex;flex-direction:column} :where(html:is(.pf-app,.pf-studio)) .tcardT.cur{border-color:var(--ok)} :where(html:is(.pf-app,.pf-studio)) .tthumb{position:relative;height:240px;overflow:hidden;background:#fff} :where(html:is(.pf-app,.pf-studio)) .tthumb iframe{position:absolute;top:0;left:0;width:1280px;height:1000px;transform:scale(.3);transform-origin:0 0;pointer-events:none;border:0} :where(html:is(.pf-app,.pf-studio)) .tmeta{padding:10px;display:flex;gap:8px;align-items:center} :where(html:is(.pf-app,.pf-studio)) .tmeta div{flex:1} :where(html:is(.pf-app,.pf-studio)) .tmeta small{display:block;color:var(--mut)} @media(max-width:900px){:where(html:is(.pf-app,.pf-studio)) .tgrid{grid-template-columns:1fr 1fr}} @media(max-width:560px){:where(html:is(.pf-app,.pf-studio)) .tgrid{grid-template-columns:1fr}} html:where(:is(.pf-app,.pf-studio)),:where(html:is(.pf-app,.pf-studio)) body{height:calc(100vh / var(--tz,1))} :where(html:is(.pf-app,.pf-studio)) .tsz{display:inline-flex;gap:4px;align-items:center;margin-right:4px} :where(html:is(.pf-app,.pf-studio)) .tsz button{width:28px;height:28px;border:1px solid var(--line);background:#1b1229;color:var(--mut);border-radius:8px;font-weight:600;line-height:1;padding:0} :where(html:is(.pf-app,.pf-studio)) .tsz button[data-ts=s]{font-size:11px} :where(html:is(.pf-app,.pf-studio)) .tsz button[data-ts=m]{font-size:14px} :where(html:is(.pf-app,.pf-studio)) .tsz button[data-ts=l]{font-size:17px} :where(html:is(.pf-app,.pf-studio)) .tsz button:hover{border-color:var(--amb)} html:where(:is(.pf-app,.pf-studio))[data-ts=s] .tsz [data-ts=s],html:where(:is(.pf-app,.pf-studio))[data-ts=m] .tsz [data-ts=m],html:where(:is(.pf-app,.pf-studio))[data-ts=l] .tsz [data-ts=l]{border-color:var(--amb);color:var(--txt);box-shadow:0 0 0 1px rgba(247,147,26,.35)} html:where(:is(.pf-app,.pf-studio)){-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility} /* ==================== v13e STUDIO EDITOR (was studio-ui.css; only on studio.arguta.ai) ==================== */ :where(html.pf-studio) .brand img{border-radius:0;width:35px;height:35px;flex:none} :where(html.pf-studio) .nav{display:flex;gap:4px;justify-content:center} :where(html.pf-studio) .nav button{text-transform:uppercase;letter-spacing:.06em;font-weight:600;padding:6px 12px;font-size:12px;color:var(--mut);background:#1b1229;border-color:var(--line)} :where(html.pf-studio) .nav button.on{color:var(--txt);border-color:var(--vio);background:#24183a} :where(html.pf-studio) .nav button:hover{color:var(--txt);border-color:var(--vio)} :where(html.pf-studio) .devs .on{border-color:var(--vio);background:#24183a} :where(html.pf-studio) .acts a{color:var(--txt);text-decoration:none} :where(html.pf-studio) .acts a button::after{content:"";display:inline-block;width:.62em;height:.62em;margin-left:6px;vertical-align:.08em;background:currentColor;opacity:.75;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5l5-5M3.5 2.5h4v4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5l5-5M3.5 2.5h4v4'/%3E%3C/svg%3E") center/contain no-repeat} :where(html.pf-studio) .top .acts a button,:where(html.pf-studio) .top .acts>button,:where(html.pf-studio) .right .tabs button,:where(html.pf-studio) .stool button{transition:border-color .2s,color .2s} :where(html.pf-studio) .top .acts a:hover button,:where(html.pf-studio) .top .acts a button:hover,:where(html.pf-studio) .top .acts>button:hover,:where(html.pf-studio) .right .tabs button:hover,:where(html.pf-studio) .stool button:hover{border-color:#a35bff!important} :where(html.pf-studio) .top .acts #adm button{background:#F7931A!important;color:#000!important;border:1px solid #F7931A!important;font-weight:600;box-shadow:none;background-image:none!important} :where(html.pf-studio) .top .acts #adm button::after{display:none!important} :where(html.pf-studio) .top .acts #adm:hover button,:where(html.pf-studio) .top .acts #adm button:hover{background:#ffa53d!important;border-color:#ffa53d!important} @media (min-width:861px) and (hover:hover), (min-width:1401px){:where(html.pf-studio) .top{position:relative} :where(html.pf-studio) .top .devs{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0} :where(html.pf-studio) .top .acts{margin-left:auto;flex-wrap:nowrap;gap:6px}} @media (max-width:1100px) and (min-width:861px) and (hover:hover){:where(html.pf-studio) .acts a button::after{display:none}} @media (max-width:1300px) and (min-width:861px) and (hover:hover){:where(html.pf-studio) .acts a button,:where(html.pf-studio) .acts>button{padding:6px 8px;font-size:12px}} @media (max-width:1279px) and (min-width:861px) and (hover:hover){:where(html.pf-studio) .acts .tsz{display:none}} :where(html.pf-studio) .stage{flex-direction:column;align-items:stretch} :where(html.pf-studio) .spanel{flex:1;min-height:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#05030a} :where(html.pf-studio) .stool{flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 14px 10px 22px;background:rgba(20,13,31,.94);border-bottom:1px solid var(--line)} :where(html.pf-studio) .stool .stb{display:flex;flex-wrap:nowrap;gap:6px;justify-content:flex-end} :where(html.pf-studio) .stool .stb button{white-space:nowrap} :where(html.pf-studio) .stool .stb button[hidden]{display:none} :where(html.pf-studio) .stool .stb button.back{background:#F7931A!important;color:#000!important;border:1px solid #F7931A!important;font-weight:600;margin-right:8px} :where(html.pf-studio) .stool .stb button.back:hover{border-color:#ffd9a8!important} :where(html.pf-studio) .ag-head a.ag-tb{color:var(--txt);text-decoration:none} :where(html.pf-studio) .stool .state{font-size:13px;color:var(--mut);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0} :where(html.pf-studio) .sview{flex:1;min-height:0;display:flex;justify-content:center;padding:12px} :where(html.pf-studio) .sview .frameWrap{height:100%} :where(html.pf-studio) .stool .stb button{padding:6px 10px;font-size:13px} @media(max-width:1300px){:where(html.pf-studio) .stool .stb button{padding:6px 8px;font-size:12px} :where(html.pf-studio) .stool{padding-left:14px}} @media(max-width:1180px){:where(html.pf-studio) .stool .state{display:none}} :where(html.pf-studio) .right .sugs button,:where(html.pf-studio) .right textarea,:where(html.pf-studio) .right .askb button,:where(html.pf-studio) .right .chat{font-family:Geist,"Segoe UI",system-ui,sans-serif} :where(html.pf-studio) .right textarea{font-weight:300} :where(html.pf-studio) .mtopb,:where(html.pf-studio) .mnav,:where(html.pf-studio) .dock,:where(html.pf-studio) .mclose,:where(html.pf-studio) .mhandle,:where(html.pf-studio) .mscrim,:where(html.pf-studio) .mburger{display:none} html:where(.pf-studio){--dock:66px;--mtop:56px} :where(html.pf-studio) .mburger{background:none;border:0;padding:10px;margin:-10px 0 -10px -10px;cursor:pointer;color:#fff;line-height:0} :where(html.pf-studio) .mburger svg path{transition:transform .25s ease,opacity .2s ease;transform-origin:12px 12px} :where(html.pf-studio) .mburger[aria-expanded="true"] .l1{transform:translateY(5px) rotate(45deg)} :where(html.pf-studio) .mburger[aria-expanded="true"] .l2{transform:translateY(-1px) rotate(-45deg)} :where(html.pf-studio) .mburger[aria-expanded="true"] .dots{opacity:0} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html:where(.pf-studio),:where(html.pf-studio) body{overscroll-behavior:none} :where(html.pf-studio) body{height:100dvh!important;overflow:hidden!important} :where(html.pf-studio) .top{position:fixed!important;left:0;right:0;top:0;z-index:70;height:var(--mtop);min-height:var(--mtop);box-sizing:border-box;flex-wrap:nowrap!important;gap:10px;padding:0 14px;padding-top:env(safe-area-inset-top);transition:transform .4s cubic-bezier(.22,.61,.36,1)} :where(html.pf-studio) .top .devs,:where(html.pf-studio) .top .acts{display:none!important} :where(html.pf-studio) .mburger{display:inline-block} :where(html.pf-studio) .brand{gap:9px;min-width:0} :where(html.pf-studio) .brand img{width:31px;height:31px} :where(html.pf-studio) .brand b{font:700 16px Poppins,Geist,system-ui,sans-serif;white-space:nowrap} :where(html.pf-studio) .brand small{display:none!important} :where(html.pf-studio) .mtopb{display:inline-flex;margin-left:auto;align-items:center;background:#8b5cf6;color:#fff;border:1px solid transparent;border-radius:10px;padding:8px 13px;font:600 13px Geist,system-ui,sans-serif;cursor:pointer;white-space:nowrap} :where(html.pf-studio) .mtopb:hover{border-color:#c4a8ff} :where(html.pf-studio) .mnav{display:block;position:fixed;left:0;right:0;top:calc(var(--mtop) + env(safe-area-inset-top));bottom:calc(var(--dock) + env(safe-area-inset-bottom));z-index:65;overflow:auto;overscroll-behavior:contain;background:rgba(13,8,22,.95);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);border-bottom:1px solid rgba(196,168,255,.18);clip-path:inset(0 0 100% 0);opacity:0;pointer-events:none;transition:clip-path .42s cubic-bezier(.2,.8,.2,1),opacity .3s ease} :where(html.pf-studio) .mnav.open{clip-path:inset(0 0 0 0);opacity:1;pointer-events:auto} :where(html.pf-studio) .mnav .mn-in{padding:10px 16px 18px;display:grid;gap:4px} :where(html.pf-studio) .mnav .mn-it{transform:translateY(-6px);opacity:0;transition:transform .35s ease,opacity .35s ease} :where(html.pf-studio) .mnav.open .mn-it{transform:none;opacity:1} :where(html.pf-studio) .mnav .mn-main{display:flex;justify-content:space-between;align-items:center;width:100%;box-sizing:border-box;background:none;border:1px solid transparent;border-radius:10px;color:#f3eaff;padding:13px 12px;font:600 12px Geist,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;text-align:left;cursor:pointer} :where(html.pf-studio) .mnav .mn-main:hover{border-color:#8b5cf6} :where(html.pf-studio) .mnav .mn-main:disabled{opacity:.45} :where(html.pf-studio) .mnav .mn-sep{height:1px;background:rgba(196,168,255,.14);margin:8px 0} :where(html.pf-studio) .mnav .mn-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center} :where(html.pf-studio) .mnav .mn-b{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid rgba(196,168,255,.18);border-radius:10px;color:#f3eaff;padding:9px 12px;font:500 13.5px Geist,system-ui,sans-serif;cursor:pointer;text-decoration:none} :where(html.pf-studio) .mnav .mn-b:hover{border-color:#8b5cf6} :where(html.pf-studio) .mnav .mn-b.adm{background:#F7931A;border-color:#F7931A;color:#1b0f02;font-weight:600} :where(html.pf-studio) .mnav .tsz{display:inline-flex!important;gap:4px} :where(html.pf-studio) .mnav .mn-lab{font:500 11px 'Geist Mono',ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:#a99cc8;margin:6px 2px 2px} :where(html.pf-studio) .mnav .mn-note{font-size:12.5px;color:#a99cc8;margin:8px 2px 0;line-height:1.45} :where(html.pf-studio) .shell{display:block!important;position:fixed;left:0;right:0;top:calc(var(--mtop) + env(safe-area-inset-top));bottom:calc(var(--dock) + env(safe-area-inset-bottom));overflow:hidden} :where(html.pf-studio) .stage{height:100%!important;padding:0!important;gap:0} :where(html.pf-studio) .spanel{border:0;border-radius:0} :where(html.pf-studio) .stool{display:none} :where(html.pf-studio) .sview{padding:0} :where(html.pf-studio) .sview .frameWrap{width:100%!important;height:100%;border-radius:0;box-shadow:none} :where(html.pf-studio) .left,:where(html.pf-studio) .right{position:fixed!important;z-index:62;left:0!important;right:0!important;display:flex!important;flex-direction:column;background:var(--pan);overflow:auto;overscroll-behavior:contain} :where(html.pf-studio) .left{top:calc(var(--mtop) + env(safe-area-inset-top))!important;bottom:calc(var(--dock) + env(safe-area-inset-bottom))!important;transform:translateX(-102%);transition:transform .38s cubic-bezier(.2,.8,.2,1)} :where(html.pf-studio) .left.open{transform:none} :where(html.pf-studio) .right{top:0!important;bottom:0!important;z-index:80;transform:translateY(104%);transition:transform .42s cubic-bezier(.2,.8,.2,1);border:0!important;padding-top:env(safe-area-inset-top);padding-bottom:max(env(safe-area-inset-bottom),12px)} :where(html.pf-studio) .right.open{transform:none} :where(html.pf-studio) body.argopen .dock,:where(html.pf-studio) body.argopen .top{visibility:hidden} :where(html.pf-studio) .shell{z-index:auto} :where(html.pf-studio) .right .mhandle{display:block;height:16px;flex:none;position:relative;touch-action:none} :where(html.pf-studio) .right .mhandle b{display:none} :where(html.pf-studio) .right .ag-ctl .mclose{margin-top:0} :where(html.pf-studio) .right .aorb{--ag-orb:150px;padding-top:0!important} :where(html.pf-studio) .right .taw{position:relative} :where(html.pf-studio) .right .taw textarea{padding-right:86px!important;min-height:56px;box-sizing:border-box;width:100%} :where(html.pf-studio) .right .taw .ag-go{position:absolute;right:8px;bottom:8px;min-height:40px;padding:0 16px;margin:0} :where(html.pf-studio) .right .mhandle::before{content:"";position:absolute;left:50%;top:4px;width:38px;height:4px;border-radius:9px;background:rgba(196,168,255,.35);transform:translateX(-50%)} :where(html.pf-studio) .right .mhandle b{font:700 16px Poppins,Geist,system-ui,sans-serif;margin-top:6px} :where(html.pf-studio) .right .mclose{display:inline-flex;margin-top:6px;background:none;border:1px solid var(--line);border-radius:10px;color:#f3eaff;padding:7px 13px;font:600 13px Geist,system-ui,sans-serif;cursor:pointer} :where(html.pf-studio) .right .mclose:hover{border-color:#8b5cf6} :where(html.pf-studio) .right textarea{font-size:16px} :where(html.pf-studio) .dock{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;position:fixed;left:0;right:0;bottom:0;z-index:66;height:calc(var(--dock) + env(safe-area-inset-bottom));padding:0 6px env(safe-area-inset-bottom);box-sizing:border-box;background:rgba(15,10,24,.92);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid rgba(196,168,255,.16)} :where(html.pf-studio) .dock button{all:unset;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:var(--dock);color:#c4a8ff;font:500 11px Geist,system-ui,sans-serif;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:10px;border:1px solid transparent} :where(html.pf-studio) .dock button svg{width:22px;height:22px} :where(html.pf-studio) .dock button.on::before{content:"";position:absolute;top:7px;left:50%;width:18px;height:2px;margin-left:-9px;border-radius:2px;background:#c4a8ff} :where(html.pf-studio) .dock .dorb{justify-content:flex-end;padding-bottom:3px} :where(html.pf-studio) .dock .dorb.on::before{display:none} :where(html.pf-studio) .dock .dorb i{position:absolute;top:-22px;left:50%;width:60px;height:60px;margin-left:-30px;border-radius:50%;display:grid;place-items:center;z-index:1;background:radial-gradient(circle at 35% 30%,#b98cff,#7c3aed 55%,#3b1a78);box-shadow:0 0 0 4px #0f0a18,0 0 0 5px rgba(196,168,255,.35),0 8px 26px rgba(139,92,246,.55);animation:dglow 3.6s ease-in-out infinite} :where(html.pf-studio) .dock .dorb i svg{width:30px;height:30px;position:relative;z-index:2} :where(html.pf-studio) .dock .dorb i::after{content:"";position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(circle,rgba(163,91,255,.45),rgba(163,91,255,0) 70%);z-index:-1;animation:dhalo 3.6s ease-in-out infinite;pointer-events:none} @keyframes dglow{0%,100%{box-shadow:0 0 0 4px #0f0a18,0 0 0 5px rgba(196,168,255,.35),0 8px 24px rgba(139,92,246,.5)}50%{box-shadow:0 0 0 4px #0f0a18,0 0 0 6px rgba(196,168,255,.5),0 8px 34px rgba(163,91,255,.8)}} @keyframes dhalo{0%,100%{opacity:.55;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}} :where(html.pf-studio) .mscrim{display:block;position:fixed;inset:0;z-index:61;background:rgba(5,3,10,.5);opacity:0;pointer-events:none;transition:opacity .3s} :where(html.pf-studio) .mscrim.on{opacity:1;pointer-events:auto} :where(html.pf-studio) .modal{z-index:90}} @media (max-width:860px) and (prefers-reduced-motion:reduce), (max-width:1400px) and (hover:none) and (pointer:coarse) and (prefers-reduced-motion:reduce){:where(html.pf-studio) .mnav,:where(html.pf-studio) .left,:where(html.pf-studio) .right,:where(html.pf-studio) .mnav .mn-it{transition:none!important} :where(html.pf-studio) .dock .dorb i,:where(html.pf-studio) .dock .dorb i::after{animation:none!important}} :where(html.pf-studio) .b.ava .sp{display:block;margin-top:6px} :where(html.pf-studio) .b.ava .sp button{font-size:11.5px;padding:3px 9px;border-radius:999px} :where(html.pf-studio) .b.err{border-color:#7f1d1d;color:#fecaca} :where(html.pf-studio) .right .tab{padding:12px 14px 14px;gap:10px;min-height:0} :where(html.pf-studio) .ag-head{display:flex;align-items:center;justify-content:space-between;font-size:14px} :where(html.pf-studio) .ag-head .ag-name{display:flex;align-items:center;gap:8px;font-weight:500} :where(html.pf-studio) .ag-head svg{width:22px;height:22px} :where(html.pf-studio) .ag-ctl{display:flex;gap:8px;align-items:center} :where(html.pf-studio) .ag-tb{height:36px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:#1b1229;color:var(--txt);font-size:13px;font-weight:500;display:inline-flex;align-items:center;gap:6px} :where(html.pf-studio) .ag-tb:hover{border-color:var(--vio)} :where(html.pf-studio) .ag-gear{width:36px;padding:0;justify-content:center} :where(html.pf-studio) .ag-gear svg{width:18px;height:18px} :where(html.pf-studio) .aorb{--ag-orb:172px;padding-top:14px!important;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;padding:4px 0 0} :where(html.pf-studio) .aorbc{width:calc(var(--ag-orb) * 1.45);height:calc(var(--ag-orb) * 1.45);margin:calc(var(--ag-orb) * -0.06) 0 calc(var(--ag-orb) * -0.04);max-width:130%;display:block;pointer-events:none;border-radius:50%} :where(html.pf-studio) .aorb small{font-size:13.5px;color:#cfc4e6;font-weight:400;min-height:20px;padding:0 12px;margin-top:6px;-webkit-font-smoothing:antialiased} :where(html.pf-studio) .aorb small b{color:#fff;font-weight:600} :where(html.pf-studio) .aorb .agg{font-size:12.5px;color:#a99bbd;margin-top:2px;min-height:0} :where(html.pf-studio) .ag-consent{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#1a1228;display:grid;gap:8px} :where(html.pf-studio) .ag-consent[hidden]{display:none} :where(html.pf-studio) .ag-consent h4{margin:0;font-size:14px} :where(html.pf-studio) .ag-consent p{margin:0;font-size:12.5px;color:#cfc4e6;line-height:1.5} :where(html.pf-studio) .ag-consent label{display:grid!important;grid-template-columns:18px 1fr;gap:8px;align-items:center;font-size:13px;color:var(--txt)} :where(html.pf-studio) .ag-consent label input{width:16px!important;height:16px;margin:0;padding:0;accent-color:var(--vio)} :where(html.pf-studio) .ag-consent .row{display:flex;gap:8px;flex-wrap:wrap} :where(html.pf-studio) .ag-mic.on{background:#3a1430;border:1px solid #ff8aa8;color:#ffd7e2;box-shadow:none} :where(html.pf-studio) .aorb:focus-visible{outline:2px solid #a35bff;outline-offset:2px;border-radius:14px} :where(html.pf-studio) .ag-note{margin:0 auto;max-width:92%;padding:8px 12px;border:1px dashed rgba(243,234,255,.18);border-radius:10px;color:#a99bbd;font-size:12px;text-align:center;line-height:1.45} :where(html.pf-studio) .sugs{justify-content:center;gap:8px} :where(html.pf-studio) .sugs button{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(243,234,255,.2);background:rgba(11,7,17,.3);font-size:13px} :where(html.pf-studio) .sugs button:hover{border-color:#a35bff} :where(html.pf-studio) .right .chat{min-height:120px} :where(html.pf-studio) .ag-foot{display:flex;gap:8px;align-items:center;margin:0} :where(html.pf-studio) .ag-foot textarea{flex:1;min-width:0;min-height:48px;max-height:140px;resize:none;border-radius:12px;border:1px solid var(--line);background:rgba(11,7,17,.25);color:var(--txt);font:16px Geist,system-ui,sans-serif;padding:13px 12px;box-sizing:border-box} :where(html.pf-studio) .ag-foot textarea:focus{outline:2px solid var(--vio);outline-offset:1px} :where(html.pf-studio) .ag-mic{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 16px 0 12px;border-radius:999px;border:0;background:linear-gradient(135deg,#5b2bd6,#a35bff);color:#fff;font-size:15px;font-weight:600;box-shadow:0 8px 24px rgba(91,43,214,.4)} :where(html.pf-studio) .ag-mic svg{width:18px;height:18px;flex:none} :where(html.pf-studio) .ag-send{flex:none;min-height:48px;padding:0 12px;border-radius:12px;border:1px solid var(--line);background:#1b1229;color:var(--txt);font-size:13px;font-weight:500} :where(html.pf-studio) .right .tab{overflow:hidden;font-family:"Geist","Segoe UI",system-ui,sans-serif;color:#f3eaff} :where(html.pf-studio) .right .chat{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;gap:12px;padding:18px 4px 8px;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 24px,#000 calc(100% - 8px),transparent);mask-image:linear-gradient(to bottom,transparent,#000 24px,#000 calc(100% - 8px),transparent)} :where(html.pf-studio) .aorb .ahi{display:block;font:600 19px Poppins,Geist,system-ui,sans-serif;color:#f3eaff;margin-top:8px;letter-spacing:0} :where(html.pf-studio) .aorb .ahi[hidden]{display:none} :where(html.pf-studio) .aorb small,:where(html.pf-studio) .aost{font-size:13px;color:#a99bbd;font-weight:300;margin-top:2px;min-height:20px;-webkit-font-smoothing:auto} :where(html.pf-studio) .aorb small b{color:#f3eaff;font-weight:400} :where(html.pf-studio) .aorb .agg{font-size:12px;color:#a99bbd;font-weight:300;margin-top:8px} :where(html.pf-studio) .right .sugs{gap:8px;margin-top:14px;padding:0 6px} :where(html.pf-studio) .right .sugs button{min-height:40px;padding:0 15px;border-radius:999px;border:1px solid rgba(243,234,255,.2);background:rgba(11,7,17,.3);color:#f3eaff;font:inherit;font-size:14px;font-weight:400} :where(html.pf-studio) .sugs button:hover{border-color:#a35bff} :where(html.pf-studio) .ag-tb{height:38px;padding:0 14px;border-radius:10px;border:1px solid rgba(243,234,255,.18);background:rgba(11,7,17,.25);color:#f3eaff;font:inherit;font-size:13px;font-weight:500} :where(html.pf-studio) .ag-gear{width:38px;padding:0} :where(html.pf-studio) .ag-head{font-size:14px} :where(html.pf-studio) .ag-head .ag-name{font-weight:400} :where(html.pf-studio) .right .b.ava{background:rgba(62,50,80,.92);color:#f3eaff;margin-left:2px} :where(html.pf-studio) .right .b.me{background:#7a3ff0;color:#fff;margin-right:2px} :where(html.pf-studio) .right .b.sys{background:transparent;box-shadow:none;color:#a99bbd;font-size:12px;text-align:center;border:1px dashed rgba(243,234,255,.18);border-radius:10px;padding:8px 12px} :where(html.pf-studio) .right .b.ava .sp button{font:inherit;font-size:12.5px;font-weight:400} :where(html.pf-studio) .ag-foot textarea{font-family:inherit;font-size:16px;font-weight:300;color:#f3eaff;border:1px solid rgba(243,234,255,.16);background:rgba(11,7,17,.5)} :where(html.pf-studio) .ag-foot textarea::placeholder{color:#a99bbd} :where(html.pf-studio) .ag-mic{padding:0 18px 0 14px;font-family:inherit;font-size:15px;font-weight:600;animation:agRing 2.8s ease-out infinite} :where(html.pf-studio) .ag-mic.on{animation:none} :where(html.pf-studio) .ag-send{font-family:inherit;font-size:13px;font-weight:500;border:1px solid rgba(243,234,255,.13);background:#1b1229;color:#f3eaff} @media(prefers-reduced-motion:reduce){:where(html.pf-studio) .ag-mic{animation:none}} :where(html.pf-studio) .sugs{justify-content:center} :where(html.pf-studio) .sugs button{min-height:36px;padding:0 13px;border-radius:999px;border:1px solid rgba(243,234,255,.2);background:rgba(11,7,17,.3);font-size:13px} :where(html.pf-studio) .sugs button:hover{border-color:#a35bff} :where(html.pf-studio) .top .acts a button,:where(html.pf-studio) .top .acts>button,:where(html.pf-studio) .right .tabs button{transition:border-color .2s,color .2s} :where(html.pf-studio) .top .acts a:hover button,:where(html.pf-studio) .top .acts a button:hover,:where(html.pf-studio) .top .acts>button:hover,:where(html.pf-studio) .right .tabs button:hover{border-color:#a35bff!important} :where(html.pf-studio) .right .tab .sugs{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px;margin:0;padding:0} :where(html.pf-studio) .right .tab .sugs button{min-height:0;font-family:inherit;font-size:12px;font-weight:400;padding:5px 9px;border-radius:999px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;line-height:1.35} :where(html.pf-studio) .right .tab .sugs:empty{display:none} :where(html.pf-studio) .ag-ask{display:block;margin:0} :where(html.pf-studio) .ag-ask textarea{display:block;width:100%;box-sizing:border-box;min-height:78px;max-height:200px;resize:vertical;font-family:inherit;font-size:14px;font-weight:300;line-height:1.4;color:#f3eaff;background:#0f0a18;border:1px solid #2a1f3d;border-radius:10px;padding:8px 10px} :where(html.pf-studio) .ag-ask textarea::placeholder{color:#a99cc8} :where(html.pf-studio) .ag-ask textarea:focus{outline:none;border-color:#8b5cf6} :where(html.pf-studio) .ag-ask .askb{display:flex;align-items:center;gap:8px;margin-top:6px} :where(html.pf-studio) .ag-ask .askb .hint{flex:1;min-width:0;margin:0;font-size:12px;font-weight:300;color:#a99cc8;text-align:left} :where(html.pf-studio) .ag-ask .ag-speak{flex:none;font-family:inherit;font-size:14px;font-weight:400;padding:8px 12px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;transition:border-color .2s} :where(html.pf-studio) .ag-ask .ag-speak:hover{border-color:#8b5cf6} :where(html.pf-studio) .ag-ask .ag-speak.on{border-color:#ef4444;color:#fca5a5} :where(html.pf-studio) .ag-ask .ag-go{flex:none;font-family:inherit;font-size:14px;font-weight:600;padding:8px 14px;border-radius:10px;border:1px solid #8b5cf6;background:#8b5cf6;color:#fff;transition:background .2s} :where(html.pf-studio) .ag-ask .ag-go:hover{background:#7c4ff0;border-color:#a35bff} :where(html.pf-studio) .wsc .sugs{display:flex;flex-wrap:wrap;gap:6px} :where(html.pf-studio) .wsc .sugs:empty{display:none} :where(html.pf-studio) .wsc .sugs button{font-size:12px;padding:5px 9px;border-radius:999px;border:1px solid var(--cl);background:transparent;color:var(--ct)} :where(html.pf-studio) .wsc .sugs button:hover{border-color:#a35bff} :where(html.pf-studio) .wsc .ag-ask textarea{background:var(--cb);color:var(--ct);border-color:var(--cl);min-height:64px} :where(html.pf-studio) .lite .wsc .ag-ask textarea{background:#fff} :where(html.pf-studio) .lite .wsc .ag-ask .askb .hint{color:#6b6280} :where(html.pf-studio) .right .chat{scroll-behavior:smooth} :where(html.pf-studio) .ag-tb.undo{border-color:#F7931A!important;color:#ffd9a8!important} :where(html.pf-studio) .pub #rp .aorb.listen{filter:drop-shadow(0 0 18px rgba(163,91,255,.75))} :where(html.pf-studio) .pub .right .tab{display:flex;flex-direction:column;min-height:0} :where(html.pf-studio) .right .tab#t-ava{display:flex;flex-direction:column;flex:1} :where(html.pf-studio) .right .tab#t-ava[hidden]{display:flex!important} :where(html.pf-studio) .right .chat{flex:1;min-height:0;overflow:auto} :where(html.pf-studio) .stage{position:relative} :where(html.pf-studio) .sover{position:absolute;top:12px;right:12px;bottom:12px;width:min(380px,92%);z-index:6;background:var(--pan);overflow:auto;padding:18px 18px 28px;border:1px solid var(--line);border-radius:12px;box-shadow:-24px 0 48px rgba(0,0,0,.5);animation:soin .32s cubic-bezier(.2,.8,.2,1)} :where(html.pf-studio) .sover[hidden]{display:none} @keyframes soin{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}} :where(html.pf-studio) .sover .px{position:sticky;top:0;float:right;width:32px;height:32px;border-radius:50%;padding:0;z-index:2} :where(html.pf-studio) .sover .soh{font:700 20px Poppins,Geist,system-ui,sans-serif;margin:2px 0 14px} :where(html.pf-studio) .sover .tab{display:flex;flex-direction:column;gap:10px;padding:0} :where(html.pf-studio) .sover .tab[hidden]{display:none} :where(html.pf-studio) .sover label{display:grid;gap:4px;font-size:13px;color:#cbbde6} html:where(.pf-studio),:where(html.pf-studio) *{scrollbar-width:thin;scrollbar-color:#4a3878 transparent} html:where(.pf-studio)::-webkit-scrollbar,:where(html.pf-studio) *::-webkit-scrollbar{width:8px;height:8px} html:where(.pf-studio)::-webkit-scrollbar-track,:where(html.pf-studio) *::-webkit-scrollbar-track{background:transparent} html:where(.pf-studio)::-webkit-scrollbar-thumb,:where(html.pf-studio) *::-webkit-scrollbar-thumb{background:#4a3878;border-radius:999px;border:2px solid transparent;background-clip:padding-box} html:where(.pf-studio)::-webkit-scrollbar-thumb:hover,:where(html.pf-studio) *::-webkit-scrollbar-thumb:hover{background:#A35BFF;background-clip:padding-box} html:where(.pf-studio)::-webkit-scrollbar-corner,:where(html.pf-studio) *::-webkit-scrollbar-corner{background:transparent} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-studio) .sover{position:fixed;top:calc(var(--mtop) + env(safe-area-inset-top));left:0;right:0;bottom:calc(var(--dock) + env(safe-area-inset-bottom));width:auto;border-radius:0;border:0;z-index:64} :where(html.pf-studio) .right .tabs{display:none}} :where(html.pf-studio) .mnav .mn-main.mn-back{background:#F7931A;border-color:#F7931A;color:#1b0f02;font-weight:600;border-radius:10px} :where(html.pf-studio) .brand.lockup{display:flex;align-items:center;gap:12px;min-width:0} :where(html.pf-studio) .brand.lockup .bwm{height:19px;width:auto;flex:none;border-radius:0} :where(html.pf-studio) .brand.lockup .bdv{width:1px;height:24px;background:var(--line);flex:none} :where(html.pf-studio) .brand.lockup .bac{font:600 17px Poppins,Geist,system-ui,sans-serif;color:var(--txt);white-space:nowrap} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-studio) .brand.lockup{gap:9px} :where(html.pf-studio) .brand.lockup .bwm{height:15px;width:auto} :where(html.pf-studio) .brand.lockup .bdv{height:20px} :where(html.pf-studio) .brand.lockup .bac{font-size:15px}} :where(html.pf-studio) .brand.lockup #siteName{display:none!important} :where(html.pf-studio) button.main:not(:disabled),:where(html.pf-studio) a.go,:where(html.pf-studio) .ag-ask button#send,:where(html.pf-studio) #send{background:#7c3aed!important;border-color:#7c3aed!important} :where(html.pf-studio) button.main:not(:disabled):hover,:where(html.pf-studio) a.go:hover{background:#6d28d9!important;border-color:#c4a8ff!important} :where(html.pf-studio) .brand.lockup .lico{width:35px;height:35px;flex:none;border-radius:0} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-studio) .brand.lockup .lico{width:31px;height:31px}} :where(html.pf-studio) .ppin{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-radius:10px;font-size:13px;border:1px solid var(--line);background:#1b1229;color:var(--txt);cursor:pointer;transition:border-color .2s} :where(html.pf-studio) .ppin:hover{border-color:#8b5cf6} :where(html.pf-studio) .ppin.on{border-color:#F7931A;color:#F7931A} :where(html.pf-studio) .sover .ppin{position:sticky;top:0;float:right;margin-right:8px;z-index:2} :where(html.pf-studio) .stage .spanel{transition:margin-right .3s cubic-bezier(.2,.8,.2,1)} @media (min-width:1101px) and (hover:hover), (min-width:1401px){:where(html.pf-studio) .stage.spinned .spanel{margin-right:392px} :where(html.pf-studio) .stage.spinned .sover{box-shadow:none;animation:none}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-studio) .sover .ppin{display:none}} @media (min-width:1101px) and (hover:hover), (min-width:1401px){:where(html.pf-studio) .stage.spinned .stool .state{display:none} :where(html.pf-studio) .stage.spinned .stool{padding-left:12px} :where(html.pf-studio) .stage.spinned .stool .stb{flex-wrap:wrap;row-gap:6px;justify-content:flex-end} :where(html.pf-studio) .stage.spinned .stool .stb button{padding:6px 8px;font-size:12px}} @media (min-width:1101px) and (hover:hover), (min-width:1401px){:where(html.pf-studio) .stage.spinned .stool .state{display:block!important;flex:0 1 auto;min-width:60px} :where(html.pf-studio) .stage.spinned .stool .stb{margin-left:auto;flex:0 1 auto}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-studio) .right form.ag-ask{display:block!important;border:1px solid #2a1f3d!important;border-radius:18px!important;background:#0f0a18!important;padding:10px 10px 8px 14px!important;margin:0!important;transition:border-color .2s,box-shadow .2s} :where(html.pf-studio) .right form.ag-ask:focus-within{border-color:#8b5cf6!important;box-shadow:0 0 0 3px rgba(139,92,246,.15)} :where(html.pf-studio) .right form.ag-ask #msg{display:block!important;width:100%!important;box-sizing:border-box;border:0!important;outline:0;background:transparent!important;color:#f3eaff;resize:none;font:300 16px/1.5 Geist,"Segoe UI",system-ui,sans-serif!important;min-height:72px!important;max-height:160px;padding:0!important;box-shadow:none!important} :where(html.pf-studio) .right form.ag-ask .askb{display:flex!important;align-items:center!important;gap:8px!important;margin:6px 0 0!important;position:static!important} :where(html.pf-studio) .right form.ag-ask #left{display:none!important} :where(html.pf-studio) .right form.ag-ask .askb::before{content:"Tap the microphone to talk, or type. Enter sends.";flex:1;min-width:0;font:400 12px Geist,system-ui,sans-serif;color:#a99cc8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;order:-1} :where(html.pf-studio) .right form.ag-ask #mic{flex:none!important;width:42px!important;height:42px!important;padding:0!important;border-radius:12px!important;border:1px solid #2a1f3d!important;background:transparent!important;color:#f3eaff!important;font-size:0!important;display:inline-flex!important;align-items:center;justify-content:center;margin:0 0 0 4px!important;position:static!important} :where(html.pf-studio) .right form.ag-ask #mic::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E") center/contain no-repeat} :where(html.pf-studio) .right form.ag-ask #send{flex:none!important;width:48px!important;height:42px!important;padding:0!important;border-radius:12px!important;border:0!important;background:#7c3aed!important;color:#fff!important;font-size:0!important;display:inline-flex!important;align-items:center;justify-content:center;margin:0!important;position:static!important;transform:none!important} :where(html.pf-studio) .right form.ag-ask #send::before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}} @media (max-width:1600px) and (min-width:861px) and (hover:hover), (max-width:1600px) and (min-width:1401px){:where(html.pf-studio) .top .acts a button::after{display:none!important} :where(html.pf-studio) .top .acts #left{display:none!important}} @media (max-width:1499px) and (min-width:861px) and (hover:hover), (max-width:1499px) and (min-width:1401px){:where(html.pf-studio) .top .acts .tsz{display:none!important}} @media (max-width:999px) and (min-width:861px) and (hover:hover){:where(html.pf-studio) .top .devs{position:static!important;transform:none!important;margin:0 auto!important}} @media (max-width:1199px) and (min-width:861px) and (hover:hover){:where(html.pf-studio) .top .acts a.ownp{display:none!important}} @media (max-width:999px) and (min-width:861px) and (hover:hover){:where(html.pf-studio) .top .acts a[target="arguta-site"]{display:none!important}} :where(html.pf-studio) .acts a button.nob::after{display:none} :where(html.pf-studio) .left .newjob{width:100%;font:600 14px/1.45 Geist,system-ui,-apple-system,"Segoe UI",sans-serif;padding:8px 12px;border-radius:10px} /* ==================== v13e APP PAGE (was the style blocks in console/index.php; only on app.arguta.ai) ==================== */ :where(html.pf-app) .list{grid-template-columns:minmax(0,1fr)} :where(html.pf-app) .pnl.jobs{max-height:34vh;overflow:auto;flex:none} :where(html.pf-app) .list li{min-width:0} :where(html.pf-app) .list li.gh{cursor:default;border:0;padding:12px 4px 4px;font:600 10.5px Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--amb)} :where(html.pf-app) .list li.gh:hover{border-color:transparent} :where(html.pf-app) #crew li:not(.gh){padding:8px} :where(html.pf-app) #crew li .fc{width:40px;height:40px} :where(html.pf-app) #crew li .two b{font-size:14px} :where(html.pf-app) .list li .fc{width:28px;height:28px;border-radius:50%;object-fit:cover;flex:none;border:1px solid var(--line)} :where(html.pf-app) .list li.lock{cursor:default;opacity:.55} :where(html.pf-app) .list li.lock:hover{border-color:transparent} :where(html.pf-app) .list li .two{flex:1;min-width:0} :where(html.pf-app) .list li .two b{display:block;font-weight:600;font-size:13.5px;color:var(--txt)} :where(html.pf-app) .list li .two small{display:block;color:#c4b8e0;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} :where(html.pf-app) .list li.th span{font-size:13px;color:#d9cff0} :where(html.pf-app) .newjob{width:100%} :where(html.pf-app) .frameWrap{background:var(--pan);border:1px solid var(--line)} :where(html.pf-app) .doc{height:100%;overflow:auto;background:radial-gradient(900px 500px at 80% 0,rgba(139,92,246,.14),transparent 70%),var(--pan);color:var(--txt)} :where(html.pf-app) .dtool{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 22px;background:rgba(20,13,31,.94);border-bottom:1px solid var(--line)} :where(html.pf-app) .dtool .by{display:flex;align-items:center;gap:8px;font-weight:600} :where(html.pf-app) .dtool .by img{width:26px;height:26px;border-radius:50%;object-fit:cover;border:2px solid var(--vio)} :where(html.pf-app) .ex{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} :where(html.pf-app) .exc{display:block;text-align:left;background:#1a1228;color:var(--txt);border:1px solid var(--line);border-radius:14px;padding:16px} :where(html.pf-app) .exc:hover{border-color:var(--vio);background:#1f1530} :where(html.pf-app) .exc img{width:34px;height:34px;border-radius:50%;object-fit:cover;border:2px solid var(--vio)} :where(html.pf-app) .exc b{display:block;font:600 15px Poppins,Geist,system-ui,sans-serif;margin:8px 0 4px} :where(html.pf-app) .exc span{font-size:13px;color:#c4b8e0} :where(html.pf-app) .out{white-space:pre-wrap;word-wrap:break-word;font-size:16px;line-height:1.7;color:var(--txt)} :where(html.pf-app) .own{margin-top:26px;display:grid;gap:8px} :where(html.pf-app) .own h3{margin:0;font:700 18px Poppins,Geist,system-ui,sans-serif} :where(html.pf-app) .own p{margin:0;color:#c4b8e0;font-size:14px} :where(html.pf-app) .own .row{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px} :where(html.pf-app) .own.soft{border-color:var(--line)} :where(html.pf-app) .own a{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:10px;text-decoration:none;font-weight:600} :where(html.pf-app) .own a.go{background:var(--vio);color:#fff} :where(html.pf-app) .own a.go:hover{background:#A35BFF} :where(html.pf-app) .own a.gh{border:1px solid var(--line);color:var(--txt)} :where(html.pf-app) .own a.gh:hover{border-color:var(--vio)} :where(html.pf-app) #left{color:var(--amb)} :where(html.pf-app) .list li .ic{color:var(--amb);border-color:rgba(247,147,26,.35)} :where(html.pf-app) .dtool .dbtn{display:flex;gap:6px} :where(html.pf-app) .dtool .by.pl{font-weight:500;color:var(--mut);font-size:13px} :where(html.pf-app) .frameWrap.lite{background:#fff;border-color:#e6e1ee} :where(html.pf-app) .lite .doc{background:#fff;color:#1b1325} :where(html.pf-app) .lite .dtool{background:rgba(255,255,255,.96);border-bottom-color:#eee8f3} :where(html.pf-app) .lite .dtool .by{color:#1b1325} :where(html.pf-app) .lite .dtool .by.pl{color:#6b6280} :where(html.pf-app) .lite .dtool button,:where(html.pf-app) .lite .own a.gh{background:#fff;color:#1b1325;border:1px solid #e3dcec} :where(html.pf-app) .lite .dtool button:hover,:where(html.pf-app) .lite .own a.gh:hover{border-color:var(--vio)} :where(html.pf-app) .lite .out{color:#1b1325} :where(html.pf-app) .lite .lead,:where(html.pf-app) .lite .exc span,:where(html.pf-app) .lite .own p{color:#5d5470} :where(html.pf-app) .lite .exc,:where(html.pf-app) .lite .own{background:#fff;color:#1b1325;border-color:#eee8f3} :where(html.pf-app) .lite .exc:hover{border-color:var(--vio);background:#faf8fd} :where(html.pf-app) .lite .own{border-color:var(--vio)} :where(html.pf-app) .lite .own.soft{border-color:#eee8f3} :where(html.pf-app) .lite .warn{color:#b42318} :where(html.pf-app) .warn{color:#fca5a5} :where(html.pf-app) .b.ava .sp{display:block;margin-top:6px} :where(html.pf-app) .b.ava .sp button{font-size:11.5px;padding:3px 9px;border-radius:999px} :where(html.pf-app) .b.err{border-color:#7f1d1d;color:#fecaca} :where(html.pf-app) .acts a{color:var(--txt);text-decoration:none} :where(html.pf-app) .mbox label{display:grid;gap:6px;margin:0 0 12px;font-size:13.5px;color:#d9cff0} :where(html.pf-app) .mbox input{font:15px Geist,system-ui,sans-serif;padding:11px 12px;border:1px solid var(--line);border-radius:10px;background:#0f0a18;color:var(--txt)} :where(html.pf-app) .mbox input:focus{outline:2px solid var(--vio);outline-offset:1px} :where(html.pf-app) .menu{display:none} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .menu{display:inline-flex} :where(html.pf-app) .left{display:none} :where(html.pf-app) .left.open{display:flex;position:fixed;inset:0 20% 0 0;z-index:25} :where(html.pf-app) .ex{grid-template-columns:1fr} :where(html.pf-app) .stage{height:80vh} :where(html.pf-app) #left,:where(html.pf-app) #brainb,:where(html.pf-app) .brand small{display:none}} :where(html.pf-app) button.big{min-height:44px;padding:0 22px;font-size:15px;border-radius:10px} :where(html.pf-app) a.ghost{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:10px;border:1px solid var(--cl);color:var(--ct);text-decoration:none;font-weight:600} :where(html.pf-app) a.ghost:hover{border-color:var(--vio)} :where(html.pf-app) .steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} :where(html.pf-app) .st{background:var(--cb);border:1px solid var(--cl);border-radius:14px;padding:16px} :where(html.pf-app) .st>b{display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--vio);color:#fff;font-size:13px;margin-bottom:10px} :where(html.pf-app) .st p{margin:0;font-size:14px} :where(html.pf-app) .dtool .dbtn{align-items:center} :where(html.pf-app) .trialover #ths li{opacity:.45;filter:grayscale(1)} :where(html.pf-app) .trialover #ths li::after{content:'Locked';font-size:10px;color:#F7931A;margin-left:6px} :where(html.pf-app) .packs{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0} :where(html.pf-app) .packs button{min-height:36px;border-radius:10px;padding:0 12px} :where(html.pf-app) .plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:14px} :where(html.pf-app) .pc{position:relative;display:flex;flex-direction:column;gap:8px;background:var(--cb);border:1px solid var(--cl);border-radius:14px;padding:18px 16px;color:var(--ct)} :where(html.pf-app) .pc.hi{border-color:var(--vio);box-shadow:0 0 0 1px var(--vio)} :where(html.pf-app) .pc .tag{position:absolute;top:-10px;left:14px;background:var(--amb);color:#1b0f02} :where(html.pf-app) .pn{font:600 15px Poppins,Geist,system-ui,sans-serif} :where(html.pf-app) .pp{font:700 30px Poppins,Geist,system-ui,sans-serif;line-height:1.1} :where(html.pf-app) .pp small{font:500 13px Geist,system-ui,sans-serif;color:var(--cm)} :where(html.pf-app) .pt{font-size:12.5px;color:var(--amb);font-weight:600} :where(html.pf-app) .pc ul{margin:4px 0 8px;padding:0 0 0 16px;font-size:13px;color:var(--cm);display:grid;gap:5px;flex:1} :where(html.pf-app) .pc button{width:100%;min-height:40px;border-radius:10px} :where(html.pf-app) .pc button[disabled]{opacity:.6;cursor:default} :where(html.pf-app) .lite .pc button:not(.main){background:#fff;color:#1b1325;border:1px solid #e3dcec} :where(html.pf-app) .side{display:flex;gap:16px;align-items:center;justify-content:space-between;margin-top:18px;background:var(--cb);border:1px solid var(--cl);border-left:3px solid var(--amb);border-radius:14px;padding:16px 18px} :where(html.pf-app) .side p{margin:4px 0 0;font-size:14px} :where(html.pf-app) .ack{text-align:left} :where(html.pf-app) .list li .ic.free{color:var(--ok);border-color:rgba(61,220,151,.4)} :where(html.pf-app) .sin{display:grid;gap:12px;padding:6px 2px} :where(html.pf-app) .fs{display:grid;gap:12px} :where(html.pf-app) .sin .tick{display:grid;grid-template-columns:20px 1fr;gap:10px;font-size:13px;color:#d9cff0;line-height:1.45} :where(html.pf-app) .sin .tick input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--vio)} :where(html.pf-app) .sin a{color:var(--amb)} :where(html.pf-app) .sin .f{display:grid;gap:6px;font-size:13.5px;color:#d9cff0} :where(html.pf-app) .sin .f input{font:16px Geist,system-ui,sans-serif;padding:12px;border:1px solid var(--line);border-radius:10px;background:#0f0a18;color:var(--txt)} :where(html.pf-app) .sin .f input:focus{outline:2px solid var(--vio);outline-offset:1px} :where(html.pf-app) .sin .err{color:#fca5a5;font-size:13.5px;margin:0} @media(max-width:1100px){:where(html.pf-app) .plans{grid-template-columns:repeat(2,minmax(0,1fr))}} :where(html.pf-app) .side a.ghost{white-space:nowrap} @media (min-width:1101px) and (hover:hover), (min-width:1401px){:where(html.pf-app) .shell{grid-template-columns:var(--col-l,340px) minmax(0,1fr) var(--col-r,340px)}} @media (max-width:1100px) and (min-width:861px) and (hover:hover){:where(html.pf-app) .shell{grid-template-columns:var(--col-lm,300px) minmax(0,1fr) var(--col-rm,300px)}} :where(html.pf-app) .doc{scrollbar-gutter:stable both-edges} :where(html.pf-app) .dtool{background:var(--pan)!important;z-index:5} :where(html.pf-app) .lite .dtool{background:#fff!important} :where(html.pf-app) .dtool.hs{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px} :where(html.pf-app) .dtool.hs .sub{grid-column:2;flex:none} :where(html.pf-app) .dtool.hs .dcr{grid-column:1;justify-self:start;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} :where(html.pf-app) .dtool.hs .dbtn{grid-column:3;justify-self:end} :where(html.pf-app) .right .tab{padding:12px 14px 14px;gap:10px;min-height:0} :where(html.pf-app) .ag-head{display:flex;align-items:center;justify-content:space-between;font-size:14px} :where(html.pf-app) .ag-head .ag-name{display:flex;align-items:center;gap:8px;font-weight:500} :where(html.pf-app) .ag-head svg{width:22px;height:22px} :where(html.pf-app) .ag-ctl{display:flex;gap:8px;align-items:center} :where(html.pf-app) .ag-tb{height:36px;padding:0 12px;border-radius:10px;border:1px solid var(--line);background:#1b1229;color:var(--txt);font-size:13px;font-weight:500;display:inline-flex;align-items:center;gap:6px} :where(html.pf-app) .ag-tb:hover{border-color:var(--vio)} :where(html.pf-app) .ag-gear{width:36px;padding:0;justify-content:center} :where(html.pf-app) .ag-gear svg{width:18px;height:18px} :where(html.pf-app) .aorb{--ag-orb:172px;padding-top:14px!important;display:flex;flex-direction:column;align-items:center;text-align:center;cursor:pointer;-webkit-tap-highlight-color:transparent;padding:4px 0 0} :where(html.pf-app) .aorbc{width:calc(var(--ag-orb) * 1.45);height:calc(var(--ag-orb) * 1.45);margin:calc(var(--ag-orb) * -0.06) 0 calc(var(--ag-orb) * -0.04);max-width:130%;display:block;pointer-events:none;border-radius:50%} :where(html.pf-app) .aorb small{font-size:13.5px;color:#cfc4e6;font-weight:400;min-height:20px;padding:0 12px;margin-top:6px;-webkit-font-smoothing:antialiased} :where(html.pf-app) .aorb small b{color:#fff;font-weight:600} :where(html.pf-app) .aorb .agg{font-size:12.5px;color:#a99bbd;margin-top:2px;min-height:0} :where(html.pf-app) .ag-consent{border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:#1a1228;display:grid;gap:8px} :where(html.pf-app) .ag-consent[hidden]{display:none} :where(html.pf-app) .ag-consent h4{margin:0;font-size:14px} :where(html.pf-app) .ag-consent p{margin:0;font-size:12.5px;color:#cfc4e6;line-height:1.5} :where(html.pf-app) .ag-consent label{display:grid!important;grid-template-columns:18px 1fr;gap:8px;align-items:center;font-size:13px;color:var(--txt)} :where(html.pf-app) .ag-consent label input{width:16px!important;height:16px;margin:0;padding:0;accent-color:var(--vio)} :where(html.pf-app) .ag-consent .row{display:flex;gap:8px;flex-wrap:wrap} :where(html.pf-app) .ag-mic.on{background:#3a1430;border:1px solid #ff8aa8;color:#ffd7e2;box-shadow:none} :where(html.pf-app) .aorb:focus-visible{outline:2px solid #a35bff;outline-offset:2px;border-radius:14px} :where(html.pf-app) .ag-note{margin:0 auto;max-width:92%;padding:8px 12px;border:1px dashed rgba(243,234,255,.18);border-radius:10px;color:#a99bbd;font-size:12px;text-align:center;line-height:1.45} :where(html.pf-app) .sugs{justify-content:center;gap:8px} :where(html.pf-app) .sugs button{min-height:36px;padding:0 14px;border-radius:999px;border:1px solid rgba(243,234,255,.2);background:rgba(11,7,17,.3);font-size:13px} :where(html.pf-app) .sugs button:hover{border-color:#a35bff} :where(html.pf-app) .right .chat{min-height:120px} :where(html.pf-app) .ag-foot{display:flex;gap:8px;align-items:center;margin:0} :where(html.pf-app) .ag-foot textarea{flex:1;min-width:0;min-height:48px;max-height:140px;resize:none;border-radius:12px;border:1px solid var(--line);background:rgba(11,7,17,.25);color:var(--txt);font:16px Geist,system-ui,sans-serif;padding:13px 12px;box-sizing:border-box} :where(html.pf-app) .ag-foot textarea:focus{outline:2px solid var(--vio);outline-offset:1px} :where(html.pf-app) .ag-mic{flex:none;display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 16px 0 12px;border-radius:999px;border:0;background:linear-gradient(135deg,#5b2bd6,#a35bff);color:#fff;font-size:15px;font-weight:600;box-shadow:0 8px 24px rgba(91,43,214,.4)} :where(html.pf-app) .ag-mic svg{width:18px;height:18px;flex:none} :where(html.pf-app) .ag-send{flex:none;min-height:48px;padding:0 12px;border-radius:12px;border:1px solid var(--line);background:#1b1229;color:var(--txt);font-size:13px;font-weight:500} :where(html.pf-app) .right{overflow:hidden} :where(html.pf-app) .right .tab{overflow:hidden;font-family:"Geist","Segoe UI",system-ui,sans-serif;color:#f3eaff} :where(html.pf-app) .right .chat{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;gap:12px;padding:18px 4px 8px;-webkit-mask-image:linear-gradient(to bottom,transparent,#000 24px,#000 calc(100% - 8px),transparent);mask-image:linear-gradient(to bottom,transparent,#000 24px,#000 calc(100% - 8px),transparent)} :where(html.pf-app) .aorb .ahi{display:block;font:600 19px Poppins,Geist,system-ui,sans-serif;color:#f3eaff;margin-top:8px;letter-spacing:0} :where(html.pf-app) .aorb .ahi[hidden]{display:none} :where(html.pf-app) .aorb small,:where(html.pf-app) .aost{font-size:13px;color:#a99bbd;font-weight:300;margin-top:2px;min-height:20px;-webkit-font-smoothing:auto} :where(html.pf-app) .aorb small b{color:#f3eaff;font-weight:400} :where(html.pf-app) .aorb .agg{font-size:12px;color:#a99bbd;font-weight:300;margin-top:8px} :where(html.pf-app) .right .sugs{gap:8px;margin-top:14px;padding:0 6px} :where(html.pf-app) .right .sugs button{min-height:40px;padding:0 15px;border-radius:999px;border:1px solid rgba(243,234,255,.2);background:rgba(11,7,17,.3);color:#f3eaff;font:inherit;font-size:14px;font-weight:400} :where(html.pf-app) .sugs button:hover{border-color:#a35bff} :where(html.pf-app) .ag-tb{height:38px;padding:0 14px;border-radius:10px;border:1px solid rgba(243,234,255,.18);background:rgba(11,7,17,.25);color:#f3eaff;font:inherit;font-size:13px;font-weight:500} :where(html.pf-app) .ag-gear{width:38px;padding:0} :where(html.pf-app) .ag-head{font-size:14px} :where(html.pf-app) .ag-head .ag-name{font-weight:400} :where(html.pf-app) .right .b{position:relative;max-width:76%;padding:9px 14px;border-radius:18px;font-size:14px;font-weight:300;line-height:1.4;box-shadow:0 2px 10px rgba(0,0,0,.18);white-space:pre-wrap;word-wrap:break-word;border:0} :where(html.pf-app) .right .b.ava{background:rgba(62,50,80,.92);color:#f3eaff;margin-left:2px} :where(html.pf-app) .right .b.me{background:#7a3ff0;color:#fff;margin-right:2px} :where(html.pf-app) .right .b.sys{background:transparent;box-shadow:none;color:#a99bbd;font-size:12px;text-align:center;border:1px dashed rgba(243,234,255,.18);border-radius:10px;padding:8px 12px} :where(html.pf-app) .right .b.ava .sp button{font:inherit;font-size:12.5px;font-weight:400} :where(html.pf-app) .ag-foot textarea{font-family:inherit;font-size:16px;font-weight:300;color:#f3eaff;border:1px solid rgba(243,234,255,.16);background:rgba(11,7,17,.5)} :where(html.pf-app) .ag-foot textarea::placeholder{color:#a99bbd} :where(html.pf-app) .ag-mic{padding:0 18px 0 14px;font-family:inherit;font-size:15px;font-weight:600;animation:agRing 2.8s ease-out infinite} :where(html.pf-app) .ag-mic.on{animation:none} :where(html.pf-app) .ag-send{font-family:inherit;font-size:13px;font-weight:500;border:1px solid rgba(243,234,255,.13);background:#1b1229;color:#f3eaff} @keyframes agRing{0%{box-shadow:0 0 0 0 rgba(163,91,255,.5),0 8px 24px rgba(91,43,214,.45)}70%{box-shadow:0 0 0 12px rgba(163,91,255,0),0 8px 24px rgba(91,43,214,.45)}100%{box-shadow:0 0 0 0 rgba(163,91,255,0),0 8px 24px rgba(91,43,214,.45)}} @media(prefers-reduced-motion:reduce){:where(html.pf-app) .ag-mic{animation:none}} :where(html.pf-app) #crew li.gh:not(:first-child){border-top:1px solid var(--line);border-radius:0;margin-top:10px;padding-top:16px} :where(html.pf-app) .sugs{justify-content:center} :where(html.pf-app) .sugs button{min-height:36px;padding:0 13px;border-radius:999px;border:1px solid rgba(243,234,255,.2);background:rgba(11,7,17,.3);font-size:13px} :where(html.pf-app) .sugs button:hover{border-color:#a35bff} @media (min-width:861px) and (hover:hover), (min-width:1401px){:where(html.pf-app) .top:where(:not(.tops>*)){position:relative} :where(html.pf-app) .top:where(:not(.tops>*)) .devs{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%)}} @media (min-width:861px) and (hover:hover), (min-width:1401px){:where(html.pf-app) .top:where(:not(.tops>*)) .acts{margin-left:auto;flex-wrap:nowrap}} @media (min-width:861px) and (hover:hover), (min-width:1401px){:where(html.pf-app) .top:where(:not(.tops>*)) .pick{display:none} :where(html.pf-app) .acts{gap:6px}} @media (max-width:1760px) and (min-width:861px) and (hover:hover), (max-width:1760px) and (min-width:1401px){:where(html.pf-app) #left{display:none}} @media (max-width:1300px) and (min-width:861px) and (hover:hover){:where(html.pf-app) .acts a button,:where(html.pf-app) .acts>button{padding:6px 8px;font-size:12px}} :where(html.pf-app) .acts a button::after{content:"";display:inline-block;width:.62em;height:.62em;margin-left:6px;vertical-align:.08em;background:currentColor;opacity:.75;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5l5-5M3.5 2.5h4v4'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 10 10' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 7.5l5-5M3.5 2.5h4v4'/%3E%3C/svg%3E") center/contain no-repeat} @media(max-width:1300px){:where(html.pf-app) .acts a button::after{display:none}} :where(html.pf-app) .top:where(:not(.tops>*)) .acts a button,:where(html.pf-app) .top:where(:not(.tops>*)) .acts>button,:where(html.pf-app) .right .tabs button{transition:border-color .2s,color .2s} :where(html.pf-app) .top:where(:not(.tops>*)) .acts a:hover button,:where(html.pf-app) .top:where(:not(.tops>*)) .acts a button:hover,:where(html.pf-app) .top:where(:not(.tops>*)) .acts>button:hover,:where(html.pf-app) .right .tabs button:hover{border-color:#a35bff!important} :where(html.pf-app) #adm[hidden]{display:none!important} :where(html.pf-app) .right .tab .sugs{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:6px;margin:0;padding:0} :where(html.pf-app) .right .tab .sugs button{min-height:0;font-family:inherit;font-size:12px;font-weight:400;padding:5px 9px;border-radius:999px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;line-height:1.35} :where(html.pf-app) .right .tab .sugs:empty{display:none} :where(html.pf-app) .ag-ask{display:block;margin:0} :where(html.pf-app) .ag-ask textarea{display:block;width:100%;box-sizing:border-box;min-height:78px;max-height:200px;resize:vertical;font-family:inherit;font-size:14px;font-weight:300;line-height:1.4;color:#f3eaff;background:#0f0a18;border:1px solid #2a1f3d;border-radius:10px;padding:8px 10px} :where(html.pf-app) .ag-ask textarea::placeholder{color:#a99cc8} :where(html.pf-app) .ag-ask textarea:focus{outline:none;border-color:#8b5cf6} :where(html.pf-app) .ag-ask .askb{display:flex;align-items:center;gap:8px;margin-top:6px} :where(html.pf-app) .ag-ask .askb .hint{flex:1;min-width:0;margin:0;font-size:12px;font-weight:300;color:#a99cc8;text-align:left} :where(html.pf-app) .ag-ask .ag-speak{flex:none;font-family:inherit;font-size:14px;font-weight:400;padding:8px 12px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;transition:border-color .2s} :where(html.pf-app) .ag-ask .ag-speak:hover{border-color:#8b5cf6} :where(html.pf-app) .ag-ask .ag-speak.on{border-color:#ef4444;color:#fca5a5} :where(html.pf-app) .ag-ask .ag-go{flex:none;font-family:inherit;font-size:14px;font-weight:600;padding:8px 14px;border-radius:10px;border:1px solid #8b5cf6;background:#8b5cf6;color:#fff;transition:background .2s} :where(html.pf-app) .ag-ask .ag-go:hover{background:#7c4ff0;border-color:#a35bff} :where(html.pf-app) #page.ws{display:flex;flex-direction:column;overflow:hidden} :where(html.pf-app) #page.ws .dtool{flex:none} :where(html.pf-app) .wsl{flex:1 1 auto;min-height:0;overflow-y:auto;scrollbar-gutter:stable both-edges;scroll-behavior:smooth} :where(html.pf-app) .wsc{flex:none;border-top:1px solid var(--cl);background:var(--cb);padding:12px 0 24px} :where(html.pf-app) .wsi{max-width:1120px;margin:0 auto;padding:0 32px;display:grid;gap:8px} :where(html.pf-app) .wsc .sugs{display:flex;flex-wrap:wrap;gap:6px} :where(html.pf-app) .wsc .sugs:empty{display:none} :where(html.pf-app) .wsc .sugs button{font-size:12px;padding:5px 9px;border-radius:999px;border:1px solid var(--cl);background:transparent;color:var(--ct)} :where(html.pf-app) .wsc .sugs button:hover{border-color:#a35bff} :where(html.pf-app) .wsc .ag-ask textarea{background:var(--cb);color:var(--ct);border-color:var(--cl);min-height:64px} :where(html.pf-app) .lite .wsc .ag-ask textarea{background:#fff} :where(html.pf-app) .lite .wsc .ag-ask .askb .hint{color:#6b6280} :where(html.pf-app) .thr{display:grid;gap:18px} :where(html.pf-app) .thr .me{display:flex;justify-content:flex-end} :where(html.pf-app) .thr .me>div{max-width:78%;background:#7a3ff0;color:#fff;border-radius:16px 16px 4px 16px;padding:10px 14px;font-size:15px;line-height:1.5;white-space:pre-wrap;word-wrap:break-word} :where(html.pf-app) .card{color:var(--ct);min-width:0} :where(html.pf-app) .card header{display:flex;align-items:center;gap:10px;margin:0 0 10px;padding-bottom:10px;border-bottom:1px solid var(--cl)} :where(html.pf-app) .card header img{width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--vio);flex:none} :where(html.pf-app) .card header b{display:block;font-size:14px} :where(html.pf-app) .card header small{display:block;font-size:12px;color:var(--cm)} :where(html.pf-app) .card .cact{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap} :where(html.pf-app) .card .cact button{font-size:12px;padding:5px 10px;border-radius:8px;border:1px solid var(--cl);background:transparent;color:var(--ct);transition:border-color .2s} :where(html.pf-app) .card .cact button:hover{border-color:#a35bff} :where(html.pf-app) .card.err{border-color:#7f1d1d} :where(html.pf-app) .card.err p{margin:0;color:#fca5a5} :where(html.pf-app) .lite .card.err p{color:#b91c1c} :where(html.pf-app) .card.wk header{border-bottom:0;margin:0;padding:0} :where(html.pf-app) .dots{display:inline-flex;gap:3px;margin-left:6px;vertical-align:middle} :where(html.pf-app) .dots i{width:5px;height:5px;border-radius:50%;background:#a35bff;animation:agDot 1.2s infinite ease-in-out} :where(html.pf-app) .dots i:nth-child(2){animation-delay:.15s} :where(html.pf-app) .dots i:nth-child(3){animation-delay:.3s} @keyframes agDot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}} :where(html.pf-app) .md{font-size:15.5px;line-height:1.7;overflow-wrap:anywhere} :where(html.pf-app) .md>:first-child{margin-top:0} :where(html.pf-app) .md p{margin:0 0 12px} :where(html.pf-app) .md h2{font:600 20px Poppins,Geist,system-ui,sans-serif;margin:20px 0 8px} :where(html.pf-app) .md h3{font:600 17px Poppins,Geist,system-ui,sans-serif;margin:16px 0 6px} :where(html.pf-app) .md h4,:where(html.pf-app) .md h5{font-size:15px;margin:14px 0 6px} :where(html.pf-app) .md ul,:where(html.pf-app) .md ol{margin:0 0 12px;padding-left:22px} :where(html.pf-app) .md li{margin:3px 0} :where(html.pf-app) .md a{color:#c4a7ff} :where(html.pf-app) .lite .md a{color:#5b2bd6} :where(html.pf-app) .md code{font:13px Geist Mono,ui-monospace,Menlo,Consolas,monospace;background:rgba(139,92,246,.14);padding:1px 5px;border-radius:5px} :where(html.pf-app) .md pre{background:rgba(0,0,0,.25);border:1px solid var(--cl);border-radius:10px;padding:12px;overflow:auto} :where(html.pf-app) .lite .md pre{background:#f6f3fa} :where(html.pf-app) .md pre code{background:none;padding:0} :where(html.pf-app) .md hr{border:0;border-top:1px solid var(--cl);margin:16px 0} :where(html.pf-app) .md .tw{overflow-x:auto;margin:0 0 14px;border:1px solid var(--cl);border-radius:10px} :where(html.pf-app) .md table{border-collapse:collapse;width:100%;font-size:14px} :where(html.pf-app) .md th,:where(html.pf-app) .md td{padding:8px 10px;border-bottom:1px solid var(--cl);text-align:left;vertical-align:top} :where(html.pf-app) .md th{background:rgba(139,92,246,.12);font-weight:600} :where(html.pf-app) .md tr:last-child td{border-bottom:0} :where(html.pf-app) .live{border:1px solid var(--cl);border-radius:12px;overflow:hidden;margin:6px 0 14px;background:#fff} :where(html.pf-app) .live .lbar{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;background:var(--cb);border-bottom:1px solid var(--cl);color:var(--ct);font-size:13px} :where(html.pf-app) .live .lbar span{display:flex;gap:6px;flex-wrap:wrap} :where(html.pf-app) .live .lbar button{font-size:12px;padding:5px 10px;border-radius:8px;border:1px solid var(--cl);background:transparent;color:var(--ct)} :where(html.pf-app) .live .lbar button:hover{border-color:#a35bff} :where(html.pf-app) .live iframe{display:block;width:100%;height:520px;border:0;background:#fff} :where(html.pf-app) .fullv{position:fixed;inset:0;z-index:90;background:rgba(11,7,17,.86);display:flex;flex-direction:column;padding:14px} :where(html.pf-app) .fullv .fbar{display:flex;justify-content:space-between;align-items:center;color:#f3eaff;padding:0 4px 10px} :where(html.pf-app) .fullv .fbar button:hover{border-color:#a35bff} :where(html.pf-app) .fullv iframe{flex:1;border:0;border-radius:12px;background:#fff} :where(html.pf-app) .toast{position:fixed;left:50%;bottom:28px;transform:translate(-50%,20px);opacity:0;z-index:95;background:#1b1229;color:#f3eaff;border:1px solid #a35bff;border-radius:12px;padding:10px 16px;font-size:14px;transition:opacity .3s,transform .3s;pointer-events:none;max-width:90vw} :where(html.pf-app) .toast.on{opacity:1;transform:translate(-50%,0)} :where(html.pf-app) .toast.instage{position:absolute;z-index:30;max-width:calc(100% - 40px)} :where(html.pf-app) .unp{margin-left:6px;padding:1px 7px!important;font-size:12px!important;border-radius:999px!important} :where(html.pf-app) .pnl .brainb{display:flex;justify-content:space-between;align-items:center;width:100%;margin-top:8px;text-align:left} :where(html.pf-app) .pnl .brainb small{color:var(--amb);font-size:12px} :where(html.pf-app) .pnl .brainb:hover{border-color:#a35bff} :where(html.pf-app) .pnl.tools .brainb{margin-top:6px} :where(html.pf-app) .pnl .brainb.soon{opacity:.6;cursor:default} :where(html.pf-app) .pnl .brainb.soon small{color:var(--mut)} :where(html.pf-app) .pww{margin-top:10px} :where(html.pf-app) .right .b .sv{display:block;margin-top:6px;font-size:12px;color:#c4f5d8} :where(html.pf-app) .right .b .brg{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px} :where(html.pf-app) .right .b .brg button{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;padding:4px 10px 4px 4px;border-radius:999px;border:1px solid #a35bff;background:rgba(163,91,255,.18);color:#f3eaff} :where(html.pf-app) .right .b .brg button:hover{background:rgba(163,91,255,.32)} :where(html.pf-app) .right .b .brg img{width:22px;height:22px;border-radius:50%;object-fit:cover} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .wsi{padding:0 14px} :where(html.pf-app) .thr .me>div{max-width:90%} :where(html.pf-app) .card{} :where(html.pf-app) .card .cact{width:100%;margin-left:0} :where(html.pf-app) .live iframe{height:420px}} :where(html.pf-app) .wsc .cmp{display:block;margin:0;border:1px solid var(--cl);border-radius:18px;background:var(--cb);padding:10px 10px 8px 14px;transition:border-color .2s,box-shadow .2s} :where(html.pf-app) .wsc .cmp:focus-within{border-color:#8b5cf6;box-shadow:0 0 0 3px rgba(139,92,246,.15)} :where(html.pf-app) .wsc .cmp.talking{border-color:#a35bff;box-shadow:0 0 0 3px rgba(163,91,255,.22)} :where(html.pf-app) .wsc .cmp textarea{display:block;width:100%;box-sizing:border-box;border:0;outline:0;background:transparent;color:var(--ct);resize:none;font:inherit;font-size:15px;font-weight:300;line-height:1.5;min-height:72px;max-height:240px;padding:2px 0 6px} :where(html.pf-app) .wsc .cmp textarea::placeholder{color:var(--cm);opacity:.8} :where(html.pf-app) .cbar{display:flex;align-items:center;gap:8px} :where(html.pf-app) .cbar .cmic{margin-left:4px} :where(html.pf-app) .cmic{flex:none;width:42px;height:42px;padding:0;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;border:1px solid var(--cl);background:transparent;color:var(--ct);transition:border-color .2s,background .2s} :where(html.pf-app) .cmic svg{width:18px;height:18px} :where(html.pf-app) .cmic:hover{border-color:#a35bff} :where(html.pf-app) .cmic.on{background:#a35bff;border-color:#a35bff;color:#fff;animation:agRing 2.4s ease-out infinite} :where(html.pf-app) .cmic.off{opacity:.45} :where(html.pf-app) .cwave{flex:0 1 200px;width:200px;height:32px;min-width:0;display:none} :where(html.pf-app) .cmp.talking .cwave{display:block} :where(html.pf-app) .cbar .hint{flex:1;min-width:0;margin:0;font-size:12px;color:var(--cm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} :where(html.pf-app) .csend{flex:none;width:48px;height:42px;padding:0;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;border:0;background:#8b5cf6;color:#fff;transition:background .2s} :where(html.pf-app) .csend svg{width:20px;height:20px} :where(html.pf-app) .csend:hover{background:#a35bff} :where(html.pf-app) .csend:disabled{opacity:.45} :where(html.pf-app) .lite .wsc .cmp{background:#fff} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .wsc .cmp textarea{font-size:16px} :where(html.pf-app) .cwave{flex-basis:120px;width:120px}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .ag-ask textarea{font-size:16px}} :where(html.pf-app) .dtool button{transition:border-color .2s} :where(html.pf-app) .dtool button:hover{border-color:#a35bff} :where(html.pf-app) .top:where(:not(.tops>*)) .acts #adm button{background:#F7931A!important;color:#000!important;border:1px solid #F7931A!important;font-weight:600;box-shadow:none;background-image:none!important} :where(html.pf-app) .top:where(:not(.tops>*)) .acts #adm button::after{display:none!important} :where(html.pf-app) .top:where(:not(.tops>*)) .acts #adm:hover button,:where(html.pf-app) .top:where(:not(.tops>*)) .acts #adm button:hover{background:#ffa53d!important;border-color:#ffa53d!important} :where(html.pf-app) .right .chat{scroll-behavior:smooth} :where(html.pf-app) .ag-tb.undo{border-color:#F7931A!important;color:#ffd9a8!important} @media (max-width:1279px) and (min-width:861px) and (hover:hover){:where(html.pf-app) .acts .tsz{display:none}} :where(html.pf-app) .pick{max-width:230px} :where(html.pf-app) .stage{display:flex;flex-direction:column;gap:10px} :where(html.pf-app) .stage .frameWrap{flex:1;min-height:0;height:auto} :where(html.pf-app) .dtool .sub{flex:1;justify-content:center;--u-line:var(--cl);--u-mut:var(--cm);--u-h:var(--ct)} :where(html.pf-app) .stage{position:relative} :where(html.pf-app) .prof{position:absolute;top:12px;right:12px;bottom:12px;width:min(380px,92%);z-index:6;background:var(--pan);overflow:auto;padding:18px 18px 28px;border:1px solid var(--line);border-radius:12px;box-shadow:-24px 0 48px rgba(0,0,0,.5)} :where(html.pf-app) .prof[hidden]{display:none} :where(html.pf-app) .prof .px{position:sticky;top:0;float:right;width:32px;height:32px;border-radius:50%;padding:0} :where(html.pf-app) .hero{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:28px;align-items:center} :where(html.pf-app) .herofaces{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;justify-items:center} :where(html.pf-app) .herofaces img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid var(--vio)} :where(html.pf-app) .herofaces span{grid-column:1/-1;font-size:13px;color:var(--amb);font-weight:600} :where(html.pf-app) .steps.five{grid-template-columns:repeat(5,minmax(0,1fr))} :where(html.pf-app) .st.now{border-color:var(--vio);box-shadow:0 0 0 1px var(--vio)} :where(html.pf-app) .lvl{display:block;font:600 10.5px Geist Mono,ui-monospace,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:var(--amb);margin-bottom:8px} :where(html.pf-app) .divs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:12px} :where(html.pf-app) .dv{background:var(--cb);border:1px solid var(--cl);border-radius:14px;padding:14px} :where(html.pf-app) .dv p{margin:0;font-size:13.5px} :where(html.pf-app) .dvf{display:flex;margin-bottom:10px} :where(html.pf-app) .dvf img{width:32px;height:32px;border-radius:50%;object-fit:cover;border:2px solid var(--cb);margin-right:-8px} :where(html.pf-app) .stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:8px 0 6px} :where(html.pf-app) .stats div{background:var(--cb);border:1px solid var(--cl);border-radius:14px;padding:16px} :where(html.pf-app) .stats b{display:block;font:700 28px Poppins,Geist,system-ui,sans-serif;color:var(--amb)} :where(html.pf-app) .stats span{font-size:13px;color:var(--cm)} :where(html.pf-app) .ethos{margin:10px 0 0;padding-left:20px;display:grid;gap:8px;color:var(--cm)} :where(html.pf-app) .ethos b{color:var(--ct)} :where(html.pf-app) button.cm{font:inherit;cursor:pointer;color:inherit;position:relative} :where(html.pf-app) button.cm:hover{border-color:var(--vio)} :where(html.pf-app) .cm .plan{position:absolute;top:8px;right:8px;font:600 10px Geist,system-ui,sans-serif;font-style:normal;color:var(--amb);border:1px solid rgba(247,147,26,.4);border-radius:999px;padding:1px 6px} :where(html.pf-app) .cm .plan.free{color:var(--ok);border-color:rgba(61,220,151,.4)} :where(html.pf-app) .ej[data-prof]:hover{border-color:var(--vio)} :where(html.pf-app) .list li[data-prof]{cursor:pointer} :where(html.pf-app) .nav button{text-transform:uppercase;letter-spacing:.06em;font-weight:600} :where(html.pf-app) .nav button[data-view=work]{color:var(--txt)} :where(html.pf-app) .paths{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px} :where(html.pf-app) .path{position:relative;display:flex;flex-direction:column;gap:10px;background:var(--cb);border:1px solid var(--cl);border-radius:14px;padding:22px 20px 18px} :where(html.pf-app) .path.hi{border-color:var(--vio);box-shadow:0 0 0 1px var(--vio)} :where(html.pf-app) .path p{margin:0} :where(html.pf-app) .path>button,:where(html.pf-app) .path>a{align-self:flex-start} :where(html.pf-app) .path .tag{position:absolute;top:-10px;left:16px;background:var(--amb);color:#1b0f02} :where(html.pf-app) .path .tag.ghost{background:var(--cb);color:var(--amb);border:1px solid rgba(247,147,26,.5)} :where(html.pf-app) .hero2{display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:center} :where(html.pf-app) .hero2 img{width:200px;height:200px;border-radius:20px;object-fit:cover;border:2px solid var(--vio)} :where(html.pf-app) .crewg{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:12px} :where(html.pf-app) .cm{display:grid;justify-items:center;text-align:center;gap:4px;background:var(--cb);border:1px solid var(--cl);border-radius:14px;padding:16px 10px} :where(html.pf-app) .cm img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid var(--vio);margin-bottom:4px} :where(html.pf-app) .cm b{color:var(--ct);font-size:14px} :where(html.pf-app) .cm span{color:var(--cm);font-size:12.5px;line-height:1.35} :where(html.pf-app) .steps.four{grid-template-columns:repeat(4,minmax(0,1fr))} :where(html.pf-app) table.cmp{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--cl);border-radius:14px;overflow:hidden;margin-top:10px;font-size:14px} :where(html.pf-app) .cmp th,:where(html.pf-app) .cmp td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--cl);color:var(--ct);vertical-align:top} :where(html.pf-app) .cmp th{background:var(--cb);font-weight:600} :where(html.pf-app) .cmp tr:last-child td{border-bottom:0} :where(html.pf-app) .cmp td:first-child{color:var(--cm)} :where(html.pf-app) .cmp small{color:var(--cm)} :where(html.pf-app) .faq{display:grid;gap:8px;margin-top:10px} :where(html.pf-app) .faq details{background:var(--cb);border:1px solid var(--cl);border-radius:12px;padding:14px 16px} :where(html.pf-app) .faq summary{cursor:pointer;font-weight:600;color:var(--ct)} :where(html.pf-app) .faq details p{margin:8px 0 0} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .hero,:where(html.pf-app) .divs,:where(html.pf-app) .stats,:where(html.pf-app) .steps.five{grid-template-columns:1fr} :where(html.pf-app) .herofaces{display:none} :where(html.pf-app) .prof{position:fixed;inset:0;z-index:40} :where(html.pf-app) .paths,:where(html.pf-app) .steps.four{grid-template-columns:1fr} :where(html.pf-app) .hero2{grid-template-columns:1fr} :where(html.pf-app) .hero2 img{width:120px;height:120px}} :where(html.pf-app) .nav{display:flex;gap:4px;justify-content:center} :where(html.pf-app) .nav button{padding:6px 12px;font-size:12px;color:var(--mut)} :where(html.pf-app) .nav button:hover{color:var(--txt);border-color:var(--vio)} :where(html.pf-app) .nav button.on{color:var(--txt);border-color:var(--vio);background:#24183a} :where(html.pf-app) .pick{display:inline-flex;align-items:center;gap:7px;font-size:12px;color:#d9cff0;border:1px solid var(--line);border-radius:999px;padding:5px 11px;margin-right:4px;white-space:nowrap;max-width:280px;overflow:hidden;text-overflow:ellipsis} :where(html.pf-app) .pick i{width:7px;height:7px;border-radius:50%;background:var(--ok);flex:none} :where(html.pf-app) .pp s{font:500 16px Geist,system-ui,sans-serif;color:var(--cm);margin-right:8px} :where(html.pf-app) .st button{min-height:36px;border-radius:10px;padding:0 14px} :where(html.pf-app) .lite .st button:not(.main){background:#fff;color:#1b1325;border:1px solid #e3dcec} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html:where(.pf-app),:where(html.pf-app) body{overflow-x:hidden} html:where(.pf-app):has(body.pub),:where(html.pf-app) body.pub{height:auto!important;overflow-y:visible} :where(html.pf-app) .pub .shell{flex:none} :where(html.pf-app) .pub .dtool{flex-wrap:wrap} :where(html.pf-app) .pub .dtool .sub{order:2;width:100%} :where(html.pf-app) .top:where(:not(.tops>*)){flex-wrap:wrap} :where(html.pf-app) .devs{display:flex!important;order:5;width:100%;justify-content:center} :where(html.pf-app) .pick{display:none} :where(html.pf-app) .nav button{padding:6px 10px} :where(html.pf-app) .pub .stage{height:auto} :where(html.pf-app) .pub .frameWrap{height:auto} :where(html.pf-app) .pub .doc{height:auto;overflow:visible} :where(html.pf-app) .pub .dtool{position:static} :where(html.pf-app) .pub .chat{min-height:0;flex:none} :where(html.pf-app) .pub .top:where(:not(.tops>*)){flex-wrap:wrap} :where(html.pf-app) .pub .acts a{display:none} :where(html.pf-app) .steps,:where(html.pf-app) .plans{grid-template-columns:1fr} :where(html.pf-app) .side{flex-direction:column;align-items:flex-start} :where(html.pf-app) .din{padding:26px 18px 40px}} html:where(.pf-app){--dock:66px;--mtop:56px} :where(html.pf-app) .brand img{border-radius:0;width:35px;height:35px;flex:none} :where(html.pf-app) .mtopb,:where(html.pf-app) .mnav,:where(html.pf-app) .dock,:where(html.pf-app) .mclose,:where(html.pf-app) .mhandle{display:none} :where(html.pf-app) .mburger{background:none;border:0;padding:10px;margin:-10px 0 -10px -10px;cursor:pointer;color:#fff;display:none;line-height:0} :where(html.pf-app) .mburger svg path{transition:transform .25s ease,opacity .2s ease;transform-origin:12px 12px} :where(html.pf-app) .mburger[aria-expanded="true"] .l1{transform:translateY(5px) rotate(45deg)} :where(html.pf-app) .mburger[aria-expanded="true"] .l2{transform:translateY(-1px) rotate(-45deg)} :where(html.pf-app) .mburger[aria-expanded="true"] .dots{opacity:0} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html:where(.pf-app),:where(html.pf-app) body{overscroll-behavior:none} :where(html.pf-app) body.in{height:100dvh!important;overflow:hidden!important} :where(html.pf-app) .top:where(:not(.tops>*)){position:fixed!important;left:0;right:0;top:0;transition:transform .4s cubic-bezier(.22,.61,.36,1);z-index:70;height:var(--mtop);min-height:var(--mtop);box-sizing:border-box;flex-wrap:nowrap!important;gap:10px;padding:0 14px;padding-top:env(safe-area-inset-top)} :where(html.pf-app) .top:where(:not(.tops>*)) .menu,:where(html.pf-app) .top:where(:not(.tops>*)) .devs,:where(html.pf-app) .top:where(:not(.tops>*)) .acts{display:none!important} :where(html.pf-app) .mburger{display:inline-block} :where(html.pf-app) .brand{gap:9px;min-width:0} :where(html.pf-app) .brand img{width:31px;height:31px} :where(html.pf-app) .brand b{font:700 16px Poppins,Geist,system-ui,sans-serif;white-space:nowrap} :where(html.pf-app) .brand small{display:none!important} :where(html.pf-app) .mtopb{display:inline-flex;margin-left:auto;align-items:center;gap:6px;background:#8b5cf6;color:#fff;border:1px solid transparent;border-radius:10px;padding:8px 13px;font:600 13px Geist,system-ui,sans-serif;cursor:pointer;white-space:nowrap} :where(html.pf-app) .mtopb:hover,:where(html.pf-app) .mtopb:focus-visible{border-color:#c4a8ff} :where(html.pf-app) .mnav{display:block;position:fixed;left:0;right:0;top:calc(var(--mtop) + env(safe-area-inset-top));bottom:calc(var(--dock) + env(safe-area-inset-bottom));z-index:65;overflow:auto;overscroll-behavior:contain;background:rgba(13,8,22,.95);-webkit-backdrop-filter:blur(18px) saturate(1.2);backdrop-filter:blur(18px) saturate(1.2);border-bottom:1px solid rgba(196,168,255,.18);clip-path:inset(0 0 100% 0);opacity:0;pointer-events:none;transition:clip-path .42s cubic-bezier(.2,.8,.2,1),opacity .3s ease} :where(html.pf-app) .mnav.open{clip-path:inset(0 0 0 0);opacity:1;pointer-events:auto} :where(html.pf-app) .mnav .mn-in{padding:10px 16px calc(18px + env(safe-area-inset-bottom));display:grid;gap:4px} :where(html.pf-app) .mnav .mn-it{transform:translateY(-6px);opacity:0;transition:transform .35s ease,opacity .35s ease} :where(html.pf-app) .mnav.open .mn-it{transform:none;opacity:1} :where(html.pf-app) .mnav.open .mn-it:nth-child(2){transition-delay:.03s} :where(html.pf-app) .mnav.open .mn-it:nth-child(3){transition-delay:.06s} :where(html.pf-app) .mnav.open .mn-it:nth-child(4){transition-delay:.09s} :where(html.pf-app) .mnav.open .mn-it:nth-child(5){transition-delay:.12s} :where(html.pf-app) .mnav.open .mn-it:nth-child(n+6){transition-delay:.15s} :where(html.pf-app) .mnav .mn-main{display:flex;justify-content:space-between;align-items:center;width:100%;box-sizing:border-box;background:none;border:1px solid transparent;border-radius:10px;color:#f3eaff;padding:13px 12px;font:600 12px Geist,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;text-align:left;cursor:pointer;text-decoration:none} :where(html.pf-app) .mnav .mn-main:hover,:where(html.pf-app) .mnav .mn-main:focus-visible{border-color:#8b5cf6} :where(html.pf-app) .mnav .mn-main.on{color:#c4a8ff;background:rgba(139,92,246,.12)} :where(html.pf-app) .mnav .mn-sep{height:1px;background:rgba(196,168,255,.14);margin:8px 0} :where(html.pf-app) .mnav .mn-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center} :where(html.pf-app) .mnav .mn-b{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.03);border:1px solid rgba(196,168,255,.18);border-radius:10px;color:#f3eaff;padding:9px 12px;font:500 13.5px Geist,system-ui,sans-serif;cursor:pointer;text-decoration:none} :where(html.pf-app) .mnav .mn-b:hover,:where(html.pf-app) .mnav .mn-b:focus-visible{border-color:#8b5cf6} :where(html.pf-app) .mnav .mn-b.adm{background:#F7931A;border-color:#F7931A;color:#1b0f02;font-weight:600} :where(html.pf-app) .mnav .tsz{display:inline-flex!important;gap:4px} :where(html.pf-app) .mnav .mn-lab{font:500 11px 'Geist Mono',ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;color:#a99cc8;margin:6px 2px 2px} :where(html.pf-app) .mnav .mn-note{font-size:12.5px;color:#a99cc8;margin:8px 2px 0;line-height:1.45} :where(html.pf-app) body.hdhide .top:where(:not(.tops>*)){transform:translateY(-100%)} :where(html.pf-app) body.lockscroll{overflow:hidden!important} :where(html.pf-app) body.pub{padding-top:calc(var(--mtop) + env(safe-area-inset-top))} html:where(.pf-app){--hdh:calc(var(--mtop) + env(safe-area-inset-top))} :where(html.pf-app) body.hdhide{--hdh:0px} :where(html.pf-app) .in .shell{display:block!important;flex:1;min-height:0;height:calc(100dvh - var(--dock) - env(safe-area-inset-bottom))!important;overflow:hidden} :where(html.pf-app) .in .doc{padding-top:calc(var(--mtop) + env(safe-area-inset-top))} :where(html.pf-app) .in .dtool{top:var(--hdh)!important;transition:top .4s cubic-bezier(.22,.61,.36,1)} :where(html.pf-app) .in .stage{height:100%!important;padding:0!important;gap:0} :where(html.pf-app) .in .stage .frameWrap{border:0;border-radius:0;height:100%} :where(html.pf-app) .in .wsc{padding:8px 0 10px} :where(html.pf-app) .in .din{padding:22px 16px 30px} :where(html.pf-app) .doc{scrollbar-gutter:auto!important} :where(html.pf-app) .dtool .dbtn,:where(html.pf-app) .dtool [data-lt]{display:none!important} :where(html.pf-app) .in .wsi{padding:0 12px} :where(html.pf-app) .in .wsc .cmp{margin:0} :where(html.pf-app) .pub{padding-bottom:calc(var(--dock) + env(safe-area-inset-bottom))} :where(html.pf-app) .left,:where(html.pf-app) .left.open{display:flex!important;position:fixed!important;z-index:62;left:0!important;right:0!important;top:calc(var(--mtop) + env(safe-area-inset-top))!important;bottom:calc(var(--dock) + env(safe-area-inset-bottom))!important;width:auto!important;height:auto!important;max-height:none!important;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;transform:translateX(-102%);transition:transform .38s cubic-bezier(.2,.8,.2,1);background:var(--pan);overflow:auto;flex-direction:column} :where(html.pf-app) .left.open{transform:none} :where(html.pf-app) .left #brainb{display:flex!important} :where(html.pf-app) .left .pnl:has(.newjob){display:none} :where(html.pf-app) .right{display:flex!important;position:fixed!important;left:0!important;right:0!important;top:0!important;bottom:0!important;height:auto!important;z-index:80;transform:translateY(104%);transition:transform .42s cubic-bezier(.2,.8,.2,1);border:0!important;padding-top:env(safe-area-inset-top);padding-bottom:max(env(safe-area-inset-bottom),12px);background:var(--pan)} :where(html.pf-app) body.argopen .dock{visibility:hidden} :where(html.pf-app) .right.open{transform:none} :where(html.pf-app) .right .mhandle{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 14px 6px;border-bottom:1px solid var(--line);position:relative;flex:none;touch-action:none} :where(html.pf-app) .right .mhandle::before{content:"";position:absolute;left:50%;top:6px;width:38px;height:4px;border-radius:9px;background:rgba(196,168,255,.35);transform:translateX(-50%)} :where(html.pf-app) .right .mhandle{height:16px;padding:0;border-bottom:0} :where(html.pf-app) .right .mhandle b{display:none} :where(html.pf-app) .right .ag-ctl .mclose{margin-top:0} :where(html.pf-app) .right .mclose{display:inline-flex;margin-top:8px;background:none;border:1px solid var(--line);border-radius:10px;color:#f3eaff;padding:7px 13px;font:600 13px Geist,system-ui,sans-serif;cursor:pointer} :where(html.pf-app) .right .mclose:hover{border-color:#8b5cf6} :where(html.pf-app) .right .tabs{display:none} :where(html.pf-app) .right .tab{flex:1;min-height:0;display:flex;flex-direction:column} :where(html.pf-app) .right .aorb{flex:none;padding-top:0!important;--ag-orb:150px} :where(html.pf-app) .right .aorb .aost{margin-top:2px} :where(html.pf-app) .right .taw{position:relative} :where(html.pf-app) .right .taw textarea{padding-right:86px!important;min-height:56px;box-sizing:border-box;width:100%} :where(html.pf-app) .right .taw .ag-go{position:absolute;right:8px;bottom:8px;min-height:40px;padding:0 16px;margin:0} :where(html.pf-app) .right .ag-ask .askb{min-height:0;margin-top:6px} :where(html.pf-app) .right .ag-ask textarea{font-size:16px} :where(html.pf-app) .dock{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;position:fixed;left:0;right:0;bottom:0;z-index:66;height:calc(var(--dock) + env(safe-area-inset-bottom));padding:0 6px env(safe-area-inset-bottom);box-sizing:border-box;background:rgba(15,10,24,.92);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid rgba(196,168,255,.16)} :where(html.pf-app) .dock button{all:unset;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:var(--dock);color:#c4a8ff;font:500 11px Geist,system-ui,sans-serif;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:10px;border:1px solid transparent} :where(html.pf-app) .dock button svg{width:22px;height:22px} :where(html.pf-app) .dock button.on::before{content:"";position:absolute;top:7px;left:50%;width:18px;height:2px;margin-left:-9px;border-radius:2px;background:#c4a8ff} :where(html.pf-app) .dock button:focus-visible{border-color:#8b5cf6} :where(html.pf-app) .dock .dorb{position:relative;justify-content:flex-end;padding-bottom:3px;color:#c4a8ff} :where(html.pf-app) .dock .dorb.on::before{display:none} :where(html.pf-app) .dock .dorb i{position:absolute;top:-22px;left:50%;width:60px;height:60px;margin-left:-30px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#b98cff,#7c3aed 55%,#3b1a78);box-shadow:0 0 0 4px #0f0a18,0 0 0 5px rgba(196,168,255,.35),0 8px 26px rgba(139,92,246,.55);transition:transform .2s ease;animation:dglow 3.6s ease-in-out infinite} :where(html.pf-app) .dock .dorb i{z-index:1} :where(html.pf-app) .dock .dorb i svg{position:relative;z-index:2} :where(html.pf-app) .dock .dorb i::after{content:"";position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(circle,rgba(163,91,255,.45),rgba(163,91,255,0) 70%);z-index:-1;animation:dhalo 3.6s ease-in-out infinite;pointer-events:none} @keyframes dglow{0%,100%{box-shadow:0 0 0 4px #0f0a18,0 0 0 5px rgba(196,168,255,.35),0 8px 24px rgba(139,92,246,.5)}50%{box-shadow:0 0 0 4px #0f0a18,0 0 0 6px rgba(196,168,255,.5),0 8px 34px rgba(163,91,255,.8)}} @keyframes dhalo{0%,100%{opacity:.55;transform:scale(.95)}50%{opacity:1;transform:scale(1.08)}} :where(html.pf-app) .dock .dorb i svg{width:30px;height:30px} :where(html.pf-app) .dock .dorb:active i{transform:scale(.94)} :where(html.pf-app) .dock .dorb.live i{animation:dpulse 2.2s ease-in-out infinite} @keyframes dpulse{0%,100%{box-shadow:0 0 0 4px #0f0a18,0 0 0 5px rgba(196,168,255,.35),0 8px 26px rgba(139,92,246,.55)}50%{box-shadow:0 0 0 4px #0f0a18,0 0 0 9px rgba(196,168,255,.25),0 8px 34px rgba(139,92,246,.85)}} :where(html.pf-app) .mscrim{position:fixed;inset:0;z-index:61;background:rgba(5,3,10,.5);opacity:0;pointer-events:none;transition:opacity .3s} :where(html.pf-app) .mscrim.on{opacity:1;pointer-events:auto} :where(html.pf-app) .in .prof{z-index:63}} @media (max-width:860px) and (prefers-reduced-motion:reduce), (max-width:1400px) and (hover:none) and (pointer:coarse) and (prefers-reduced-motion:reduce){:where(html.pf-app) .mnav,:where(html.pf-app) .left,:where(html.pf-app) .right,:where(html.pf-app) .mnav .mn-it{transition:none!important} :where(html.pf-app) .dock .dorb i,:where(html.pf-app) .dock .dorb i::after{animation:none!important}} @media (max-width:1100px) and (min-width:861px) and (hover:hover){:where(html.pf-app) .top:where(:not(.tops>*)) .acts a button::after{display:none} :where(html.pf-app) .top:where(:not(.tops>*)) .acts .pick{display:none}} :where(html.pf-app) .pub #rp .aorb.listen{filter:drop-shadow(0 0 18px rgba(163,91,255,.75))} :where(html.pf-app) .pub .right .tab{display:flex;flex-direction:column;min-height:0} :where(html.pf-app) .pub #vmsgs{flex:1;min-height:120px;overflow:auto} :where(html.pf-app) .pub .sin h4.vsh{margin:4px 2px 0;font:600 15px Poppins,Geist,system-ui,sans-serif} :where(html.pf-app) .pub #vform{margin-top:10px} :where(html.pf-app) .pub #vform textarea{font-size:16px} :where(html.pf-app) button.main:not(:disabled),:where(html.pf-app) a.go,:where(html.pf-app) .ag-ask button#send,:where(html.pf-app) #send{background:#7c3aed!important;border-color:#7c3aed!important} :where(html.pf-app) button.main:not(:disabled):hover,:where(html.pf-app) a.go:hover{background:#6d28d9!important;border-color:#c4a8ff!important} :where(html.pf-app) .top:where(:not(.tops>*)) .acts #left{margin-right:8px;font-size:13px;white-space:nowrap} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .right .ag-ask#form{display:block!important;border:1px solid #2a1f3d!important;border-radius:18px!important;background:#0f0a18!important;padding:10px 10px 8px 14px!important;margin:0!important;transition:border-color .2s,box-shadow .2s} :where(html.pf-app) .right .ag-ask#form:focus-within{border-color:#8b5cf6!important;box-shadow:0 0 0 3px rgba(139,92,246,.15)} :where(html.pf-app) .right .ag-ask#form #text{display:block!important;width:100%!important;box-sizing:border-box;border:0!important;outline:0;background:transparent!important;color:#f3eaff;resize:none;font:300 16px/1.5 Geist,"Segoe UI",system-ui,sans-serif!important;min-height:72px!important;max-height:160px;padding:0!important;box-shadow:none!important} :where(html.pf-app) .right .ag-ask#form .askb{display:flex!important;align-items:center!important;gap:8px!important;margin:6px 0 0!important;position:static!important} :where(html.pf-app) .right .ag-ask#form #agGauge{display:none!important} :where(html.pf-app) .right .ag-ask#form .askb::before{content:"Tap the microphone to talk, or type. Enter sends.";flex:1;min-width:0;font:400 12px Geist,system-ui,sans-serif;color:#a99cc8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;order:-1} :where(html.pf-app) .right .ag-ask#form #talk{flex:none!important;width:42px!important;height:42px!important;padding:0!important;border-radius:12px!important;border:1px solid #2a1f3d!important;background:transparent!important;color:#f3eaff!important;font-size:0!important;display:inline-flex!important;align-items:center;justify-content:center;margin:0 0 0 4px!important;position:static!important} :where(html.pf-app) .right .ag-ask#form #talk::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E") center/contain no-repeat} :where(html.pf-app) .right .ag-ask#form #go{flex:none!important;width:48px!important;height:42px!important;padding:0!important;border-radius:12px!important;border:0!important;background:#7c3aed!important;color:#fff!important;font-size:0!important;display:inline-flex!important;align-items:center;justify-content:center;margin:0!important;position:static!important;transform:none!important} :where(html.pf-app) .right .ag-ask#form #go::before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .right .ag-ask#vform{display:block!important;border:1px solid #2a1f3d!important;border-radius:18px!important;background:#0f0a18!important;padding:10px 10px 8px 14px!important;margin:0!important;transition:border-color .2s,box-shadow .2s} :where(html.pf-app) .right .ag-ask#vform:focus-within{border-color:#8b5cf6!important;box-shadow:0 0 0 3px rgba(139,92,246,.15)} :where(html.pf-app) .right .ag-ask#vform #vtext{display:block!important;width:100%!important;box-sizing:border-box;border:0!important;outline:0;background:transparent!important;color:#f3eaff;resize:none;font:300 16px/1.5 Geist,"Segoe UI",system-ui,sans-serif!important;min-height:72px!important;max-height:160px;padding:0!important;box-shadow:none!important} :where(html.pf-app) .right .ag-ask#vform .askb{display:flex!important;align-items:center!important;gap:8px!important;margin:6px 0 0!important;position:static!important} :where(html.pf-app) .right .ag-ask#vform .agg{display:none!important} :where(html.pf-app) .right .ag-ask#vform .askb::before{content:"Typed answers. Voice comes with your account.";flex:1;min-width:0;font:400 12px Geist,system-ui,sans-serif;color:#a99cc8;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;order:-1} :where(html.pf-app) .right .ag-ask#vform .nomic{flex:none!important;width:42px!important;height:42px!important;padding:0!important;border-radius:12px!important;border:1px solid #2a1f3d!important;background:transparent!important;color:#f3eaff!important;font-size:0!important;display:inline-flex!important;align-items:center;justify-content:center;margin:0 0 0 4px!important;position:static!important} :where(html.pf-app) .right .ag-ask#vform .nomic::before{content:"";width:18px;height:18px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3'/%3E%3C/svg%3E") center/contain no-repeat} :where(html.pf-app) .right .ag-ask#vform .ag-go{flex:none!important;width:48px!important;height:42px!important;padding:0!important;border-radius:12px!important;border:0!important;background:#7c3aed!important;color:#fff!important;font-size:0!important;display:inline-flex!important;align-items:center;justify-content:center;margin:0!important;position:static!important;transform:none!important} :where(html.pf-app) .right .ag-ask#vform .ag-go::before{content:"";width:20px;height:20px;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M5 12l7-7 7 7'/%3E%3C/svg%3E") center/contain no-repeat}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) body.in #page.ws .wsc{position:fixed;left:0;right:0;bottom:calc(var(--dock) + env(safe-area-inset-bottom));z-index:55;padding:10px 0 30px!important;box-shadow:0 -12px 24px rgba(5,3,10,.55)} :where(html.pf-app) body.in #page.ws .wsl{padding-bottom:210px} :where(html.pf-app) body.in #page.ws .wsc .wsi{padding:0 12px!important;box-sizing:border-box;width:100%;max-width:none;grid-template-columns:minmax(0,1fr)} :where(html.pf-app) body.in #page.ws .wsc .cmp{min-width:0} :where(html.pf-app) body.argopen #page.ws .wsc,:where(html.pf-app) body.mnavopen #page.ws .wsc{display:none}} :where(html.pf-app) .wsc .cmp{background:#0f0a18} :where(html.pf-app) .lite .wsc .cmp{background:#fff} :where(html.pf-app) .csend{background:#7c3aed} :where(html.pf-app) .csend:hover{background:#6d28d9} @media (max-width:1600px) and (min-width:861px) and (hover:hover), (max-width:1600px) and (min-width:1401px){:where(html.pf-app) .top:where(:not(.tops>*)) .acts a button::after{display:none!important} :where(html.pf-app) .top:where(:not(.tops>*)) .acts #left{display:none!important}} @media (max-width:1499px) and (min-width:861px) and (hover:hover), (max-width:1499px) and (min-width:1401px){:where(html.pf-app) .top:where(:not(.tops>*)) .acts .tsz{display:none!important}} @media (max-width:999px) and (min-width:861px) and (hover:hover){:where(html.pf-app) .top:where(:not(.tops>*)) .devs{position:static!important;transform:none!important;margin:0 auto!important}} @media (max-width:1199px) and (min-width:861px) and (hover:hover){:where(html.pf-app) .top:where(:not(.tops>*)) .acts a.ownp{display:none!important}} @media (max-width:999px) and (min-width:861px) and (hover:hover){:where(html.pf-app) .top:where(:not(.tops>*)) .acts a[target="arguta-site"]{display:none!important}} :where(html.pf-app) .brand.lockup .lico{width:35px;height:35px;flex:none;border-radius:0} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .brand.lockup .lico{width:31px;height:31px}} :where(html.pf-app) #brainb2{display:none!important} :where(html.pf-app) .ppin{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0 10px;border-radius:10px;font-size:13px;border:1px solid var(--line);background:#1b1229;color:var(--txt);cursor:pointer;transition:border-color .2s} :where(html.pf-app) .ppin:hover{border-color:#8b5cf6} :where(html.pf-app) .ppin.on{border-color:#F7931A;color:#F7931A} :where(html.pf-app) .prof .ppin{position:sticky;top:0;float:right;margin-right:8px;z-index:2} @media (min-width:1101px) and (hover:hover), (min-width:1401px){:where(html.pf-app) .stage.ppinned .frameWrap{width:auto!important;max-width:none!important;margin-right:392px!important;min-width:0!important} :where(html.pf-app) .stage.ppinned{overflow-x:hidden} :where(html.pf-app) .stage.ppinned .prof{box-shadow:none}} :where(html.pf-app) .stage .frameWrap{transition:margin-right .3s cubic-bezier(.2,.8,.2,1)} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .prof .ppin{display:none}} :where(html.pf-app) .prof{display:flex;flex-direction:column;padding:0!important;overflow:hidden!important} :where(html.pf-app) .prof .poh{flex:none;display:flex;align-items:center;gap:8px;padding:12px 12px 12px 18px;border-bottom:1px solid var(--line)} :where(html.pf-app) .prof .poh b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 16px Poppins,Geist,system-ui,sans-serif;color:var(--txt)} :where(html.pf-app) .prof .poh button{position:static!important;float:none!important;margin:0!important;width:auto;height:auto;font:500 13px Geist,system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--txt);background:#1b1229;border:1px solid var(--line);border-radius:10px;padding:6px 10px;cursor:pointer;display:inline-flex;align-items:center;gap:6px;line-height:normal} :where(html.pf-app) .prof .poh button:hover{border-color:#8b5cf6} :where(html.pf-app) .prof .poh .ppin.on{border-color:#F7931A;color:#F7931A} :where(html.pf-app) #profb{flex:1;min-height:0;overflow-y:auto;padding:14px 18px 28px} :where(html.pf-app) .acts .slock button[disabled]{opacity:.55;cursor:default} :where(html.pf-app) .acts .slock small{font-size:10.5px;color:var(--amb);margin-left:4px} :where(html.pf-app) .brand.lockup{display:flex;align-items:center;gap:12px;min-width:0} :where(html.pf-app) .brand.lockup .bwm{height:19px;width:auto;flex:none;border-radius:0} :where(html.pf-app) .brand.lockup .bdv{width:1px;height:24px;background:var(--line);flex:none} :where(html.pf-app) .brand.lockup .bac{font:600 17px Poppins,Geist,system-ui,sans-serif;color:var(--txt);white-space:nowrap} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-app) .brand.lockup{gap:9px} :where(html.pf-app) .brand.lockup .bwm{height:15px;width:auto} :where(html.pf-app) .brand.lockup .bdv{height:20px} :where(html.pf-app) .brand.lockup .bac{font-size:15px}} /* ==================== v13f APP EMBED VIEW (was the second style block in console/index.php; only when the App page is drawn inside the Academy or Studio) ==================== */ html:where(.pf-emb){color-scheme:dark} html:where(.pf-emb).lt{color-scheme:light} html:where(.pf-emb),:where(html.pf-emb) body{height:auto!important;min-height:0!important;overflow:visible!important;display:block!important} :where(html.pf-emb) body{background:transparent!important} html:where(.pf-emb){background:#140d1f radial-gradient(900px 500px at 80% 0,rgba(139,92,246,.14),transparent 70%) no-repeat!important;background-position:0 var(--gy,0px)!important} html:where(.pf-emb).lt{background:#fff radial-gradient(900px 500px at 80% 0,rgba(124,58,237,.07),transparent 70%) no-repeat!important;background-position:0 var(--gy,0px)!important} :where(html.pf-emb) body{margin:0} :where(html.pf-emb) .doc{height:auto!important;overflow:visible!important;background:transparent!important;scrollbar-gutter:auto!important;border:0!important} /* ==================== v13h ACADEMY ADMIN, AFTER THE SHARED RULES (were in academy/admin.php) ==================== */ html:where(.pf-adm){-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility} html:where(.pf-adm),:where(html.pf-adm) *{scrollbar-width:thin;scrollbar-color:#4a3878 transparent} html:where(.pf-adm)::-webkit-scrollbar,:where(html.pf-adm) *::-webkit-scrollbar{width:8px;height:8px} html:where(.pf-adm)::-webkit-scrollbar-track,:where(html.pf-adm) *::-webkit-scrollbar-track{background:transparent} html:where(.pf-adm)::-webkit-scrollbar-thumb,:where(html.pf-adm) *::-webkit-scrollbar-thumb{background:#4a3878;border-radius:999px;border:2px solid transparent;background-clip:padding-box} html:where(.pf-adm)::-webkit-scrollbar-thumb:hover,:where(html.pf-adm) *::-webkit-scrollbar-thumb:hover{background:#A35BFF;background-clip:padding-box} html:where(.pf-adm)::-webkit-scrollbar-corner,:where(html.pf-adm) *::-webkit-scrollbar-corner{background:transparent} html:where(.pf-adm)[data-skin=light] *{scrollbar-color:#cbbbe8 transparent} html:where(.pf-adm)[data-skin=light] *::-webkit-scrollbar-thumb{background:#cbbbe8;background-clip:padding-box} /* ==================== v13h COURSE PLAYER PAGE (were in academy/player.php; each course keeps its own player.html styles) ==================== */ :where(html.pf-ply) .ag-pill,:where(html.pf-ply) #agBig{zoom:calc(1 / var(--tz,1))} @media (min-width:901px) and (hover:hover), (min-width:1401px){html:where(.pf-ply) .side{max-height:calc(100vh / var(--tz,1) - 160px)}} :where(html.pf-ply) .tsz{display:inline-flex;gap:4px;align-items:center;margin-left:4px} :where(html.pf-ply) .tsz button{width:28px;height:28px;border:1px solid #33264f;background:#1c1430;color:#a99cc8;border-radius:8px;font-weight:600;line-height:1;padding:0;cursor:pointer;font-family:inherit} :where(html.pf-ply) .tsz button[data-ts=s]{font-size:11px} :where(html.pf-ply) .tsz button[data-ts=m]{font-size:14px} :where(html.pf-ply) .tsz button[data-ts=l]{font-size:17px} :where(html.pf-ply) .tsz button:hover{border-color:#F7931A} html:where(.pf-ply)[data-ts=s] .tsz [data-ts=s],html:where(.pf-ply)[data-ts=m] .tsz [data-ts=m],html:where(.pf-ply)[data-ts=l] .tsz [data-ts=l]{border-color:#F7931A;color:#f3eaff;box-shadow:0 0 0 1px rgba(247,147,26,.35)} @media(max-width:600px){:where(html.pf-ply) .tsz button{width:24px;height:24px}} /* ==================== v13e ACADEMY PAGE (was the style blocks in academy/app.html; only on academy.arguta.ai) ==================== */ html:where(.pf-acad){-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility} :where(html.pf-acad) .ag-pill,:where(html.pf-acad) #agBig{zoom:calc(1 / var(--tz,1))} :where(html.pf-acad) .tsz{display:inline-flex;gap:4px;align-items:center;margin-right:6px} :where(html.pf-acad) .tsz button{width:28px;height:28px;border:1px solid var(--line);background:var(--card);color:var(--mute,#a99cc8);border-radius:8px;font-weight:600;line-height:1;padding:0;cursor:pointer} :where(html.pf-acad) .tsz button[data-ts=s]{font-size:11px} :where(html.pf-acad) .tsz button[data-ts=m]{font-size:14px} :where(html.pf-acad) .tsz button[data-ts=l]{font-size:17px} :where(html.pf-acad) .tsz button:hover{border-color:#F7931A} html:where(.pf-acad)[data-ts=s] .tsz [data-ts=s],html:where(.pf-acad)[data-ts=m] .tsz [data-ts=m],html:where(.pf-acad)[data-ts=l] .tsz [data-ts=l]{border-color:#F7931A;color:var(--fg);box-shadow:0 0 0 1px rgba(247,147,26,.35)} @media(max-width:560px){:where(html.pf-acad) .tsz button{width:26px;height:26px}} html:where(.pf-acad){ --bg:#0b0711; --bg2:#100a18; --card:#130d1d; --card2:#191126; --line:#2a1f3d; --fg:#f3eaff; --mute:#b9addb; --violet:#A35BFF; --or1:#C34813; --or2:#F7931A; --ok:#4CC47F; --gold:#F2D58A; --display:"Poppins","Geist",system-ui,sans-serif; --body:"Geist",system-ui,-apple-system,"Segoe UI",sans-serif; --mono:"Geist Mono",ui-monospace,Consolas,monospace; color-scheme:dark; } html:where(.pf-acad){--fg2:#e6dcf7;--chipon:#16101c} html:where(.pf-acad)[data-skin="light"]{--bg:#f1f0f4;--bg2:#ffffff;--card:#ffffff;--card2:#f4f2f8;--line:#e4e2e8;--fg:#16181d;--fg2:#3a3542;--mute:#66636d;--violet:#7a35e0;--gold:#9a7420;--chipon:#ffffff;color-scheme:light} html:where(.pf-acad)[data-skin="light"] .hero{background:radial-gradient(120% 90% at 100% 0%,rgba(163,91,255,.16),transparent 60%),#ffffff} html:where(.pf-acad)[data-skin="light"] .top{box-shadow:0 1px 0 var(--line)} html:where(.pf-acad)[data-skin="light"] .pt.ph{background:radial-gradient(80% 70% at 50% 30%,rgba(163,91,255,.14),transparent 70%),#f4f2f8;color:#16181d} html:where(.pf-acad)[data-skin="light"] .les .thumb,html:where(.pf-acad)[data-skin="light"] button.card .thumb{background:linear-gradient(135deg,#e9defa,#fbe3cf)!important} html:where(.pf-acad)[data-skin="light"] .crewhero .arg{border-color:rgba(122,53,224,.35)} :where(html.pf-acad) .skin{border:1px solid var(--line);background:var(--card);color:var(--fg);border-radius:999px;padding:5px 10px;font-size:12px;font-weight:600;white-space:nowrap} html:where(.pf-acad),:where(html.pf-acad) *,html:where(.pf-acad)::before,:where(html.pf-acad) *::before,html:where(.pf-acad)::after,:where(html.pf-acad) *::after{box-sizing:border-box} html:where(.pf-acad),:where(html.pf-acad) body{height:100%} :where(html.pf-acad) body{background:var(--bg);color:var(--fg);font-family:var(--body);font-size:14.5px;line-height:1.45;display:flex;flex-direction:column} :where(html.pf-acad) button{font:inherit;color:inherit;cursor:pointer} :where(html.pf-acad) button:focus-visible,:where(html.pf-acad) a:focus-visible,:where(html.pf-acad) select:focus-visible{outline:2px solid var(--or2);outline-offset:2px} :where(html.pf-acad) .top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg2);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:12px;padding-block:8px;padding-left:max(12px,env(safe-area-inset-left,0px));padding-right:max(12px,env(safe-area-inset-right,0px))} :where(html.pf-acad) body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--bg2)} :where(html.pf-acad) .brand{display:flex;align-items:center;gap:8px;font-weight:700;letter-spacing:.32em;font-size:13px;white-space:nowrap} :where(html.pf-acad) .brand .mk{width:28px;height:28px;border-radius:8px;display:grid;place-items:center;background:#07040d;border:1px solid rgba(163,91,255,.5);color:var(--violet);font-weight:700;letter-spacing:0} :where(html.pf-acad) .brand em{font-style:normal;color:var(--or2);font-family:var(--mono);font-size:10px;letter-spacing:.4em} :where(html.pf-acad) .tabs{display:flex;gap:4px;margin:0 auto;overflow-x:auto;scrollbar-width:none} :where(html.pf-acad) .tabs::-webkit-scrollbar{display:none} :where(html.pf-acad) .tabs button{border:0;background:transparent;color:var(--mute);padding:7px 11px;border-radius:9px;font-weight:500;white-space:nowrap} :where(html.pf-acad) .tabs button.on{background:var(--card2);color:var(--fg)} :where(html.pf-acad) .viewas{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--mute)} :where(html.pf-acad) .viewas select{background:var(--card);color:var(--fg);border:1px solid var(--line);border-radius:8px;padding:5px 6px;font:12.5px var(--body)} :where(html.pf-acad) .av{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--violet),#6d28d9);display:grid;place-items:center;font-weight:700;font-size:12px;color:#16101c;flex:none} :where(html.pf-acad) .burger{display:none;border:1px solid var(--line);background:var(--card);border-radius:9px;padding:6px 9px} :where(html.pf-acad) .shell{flex:1;display:grid;grid-template-columns:300px minmax(0,1fr);min-height:0} @media (min-width:601px){:where(html.pf-acad) .ag-pill,:where(html.pf-acad) .ag-panel{right:26px!important}} html:where(.pf-acad),:where(html.pf-acad) *{scrollbar-width:thin;scrollbar-color:#4a3878 transparent} html:where(.pf-acad)::-webkit-scrollbar,:where(html.pf-acad) *::-webkit-scrollbar{width:8px;height:8px} html:where(.pf-acad)::-webkit-scrollbar-track,:where(html.pf-acad) *::-webkit-scrollbar-track{background:transparent} html:where(.pf-acad)::-webkit-scrollbar-thumb,:where(html.pf-acad) *::-webkit-scrollbar-thumb{background:#4a3878;border-radius:999px;border:2px solid transparent;background-clip:padding-box} html:where(.pf-acad)::-webkit-scrollbar-thumb:hover,:where(html.pf-acad) *::-webkit-scrollbar-thumb:hover{background:#A35BFF;background-clip:padding-box} html:where(.pf-acad)::-webkit-scrollbar-corner,:where(html.pf-acad) *::-webkit-scrollbar-corner{background:transparent} html:where(.pf-acad)[data-skin="light"] *{scrollbar-color:#cbbbe8 transparent} html:where(.pf-acad)[data-skin="light"] *::-webkit-scrollbar-thumb{background:#cbbbe8;background-clip:padding-box} :where(html.pf-acad) .side{border-right:1px solid var(--line);background:var(--bg2);overflow-y:auto;padding:12px 10px 30px;padding-left:max(10px,env(safe-area-inset-left,0px))} :where(html.pf-acad) .side .feedbtn{width:100%;text-align:left;border:0;border-radius:10px;padding:9px 12px;background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;font-weight:700;margin-bottom:10px} :where(html.pf-acad) .grp{margin:12px 0 4px;padding:0 8px;font-weight:600;font-size:13px;display:flex;justify-content:space-between;align-items:center} :where(html.pf-acad) .grp small{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;color:var(--mute);font-weight:500} :where(html.pf-acad) .sp{width:100%;display:flex;align-items:center;gap:9px;border:0;background:transparent;color:var(--mute);padding:6px 8px;border-radius:8px;text-align:left;font-size:13.5px} :where(html.pf-acad) .sp:hover{background:var(--card)} :where(html.pf-acad) .sp.on{background:var(--card2);color:var(--fg)} :where(html.pf-acad) .sp .dot{width:8px;height:8px;border-radius:50%;flex:none} :where(html.pf-acad) .sp .cnt{margin-left:auto;font-size:11px;border:1px solid var(--line);border-radius:999px;padding:0 6px;color:var(--mute)} :where(html.pf-acad) .sp .lk{margin-left:auto;font-size:11px} :where(html.pf-acad) .main{overflow-y:auto;padding:18px 18px 60px;padding-right:max(18px,env(safe-area-inset-right,0px))} :where(html.pf-acad) .cols{display:grid;grid-template-columns:minmax(0,1180px) 300px;gap:18px;max-width:1498px;justify-content:center;margin:0 auto} :where(html.pf-acad) .cols.read{grid-template-columns:minmax(0,1180px);max-width:1180px} :where(html.pf-acad) .cols.read #right{display:none} :where(html.pf-acad) .col{display:flex;flex-direction:column;gap:12px;min-width:0} :where(html.pf-acad) .card{min-width:0} :where(html.pf-acad) .head{display:flex;align-items:center;justify-content:space-between;gap:10px} :where(html.pf-acad) .head h1{font-family:var(--display);font-size:20px;margin:0} :where(html.pf-acad) .btn{} :where(html.pf-acad) .btn.gh{} :where(html.pf-acad) .compose{display:flex;align-items:center;gap:10px;color:var(--mute)} :where(html.pf-acad) .post .meta{display:flex;align-items:center;gap:9px;margin-bottom:8px} :where(html.pf-acad) .post .meta b{display:block;font-size:13.5px} :where(html.pf-acad) .post .meta small{color:var(--mute);font-size:12px} :where(html.pf-acad) .post h2{font-size:17px;margin:0 0 6px} :where(html.pf-acad) .post p{margin:0 0 8px;color:var(--fg2)} :where(html.pf-acad) .post .acts{display:flex;gap:14px;border-top:1px solid var(--line);padding-top:8px;margin-top:8px;color:var(--mute);font-size:13px} :where(html.pf-acad) .role{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;padding:1px 6px;border-radius:999px;background:rgba(247,147,26,.18);color:var(--or2);margin-left:6px} :where(html.pf-acad) .hero{border-radius:16px;padding:18px;border:1px solid var(--line);background:radial-gradient(120% 90% at 100% 0%,rgba(163,91,255,.35),transparent 60%),var(--bg2)} :where(html.pf-acad) .hero h1{font-family:var(--display);font-size:24px;margin:4px 0 6px;line-height:1.15} :where(html.pf-acad) .hero h1 em{font-style:normal;color:var(--violet)} :where(html.pf-acad) .kick{font-family:var(--mono);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--or2)} :where(html.pf-acad) .mute{color:var(--mute)} :where(html.pf-acad) .sm{font-size:12.5px} :where(html.pf-acad) .ev{display:flex;gap:10px;align-items:center;padding:6px 0} :where(html.pf-acad) .ev .d{width:40px;text-align:center;border:1px solid var(--line);border-radius:9px;padding:3px 0;flex:none} :where(html.pf-acad) .ev .d b{display:block;font-size:15px;line-height:1.1} :where(html.pf-acad) .ev .d small{font-size:10px;color:var(--mute);text-transform:uppercase} :where(html.pf-acad) .ev .t b{display:block;font-size:13px} :where(html.pf-acad) .ev .t small{color:var(--mute);font-size:11.5px} :where(html.pf-acad) .plan{border-color:rgba(247,147,26,.45)} :where(html.pf-acad) .bar{height:8px;border-radius:8px;background:rgba(243,234,255,.08);overflow:hidden;margin:8px 0} :where(html.pf-acad) .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--violet),#6d28d9)} :where(html.pf-acad) .mod{border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:10px} :where(html.pf-acad) .mod .mh{display:flex;justify-content:space-between;padding:10px 12px;background:var(--card2);font-weight:600;font-size:13.5px} :where(html.pf-acad) .les{display:flex;align-items:center;gap:10px;padding:10px 12px;border-top:1px solid var(--line);font-size:13.5px} :where(html.pf-acad) .les .ck{width:18px;height:18px;border-radius:50%;border:1.5px solid var(--mute);flex:none} :where(html.pf-acad) .les .ck.done{background:var(--ok);border-color:var(--ok)} :where(html.pf-acad) .les .thumb{width:54px;height:32px;border-radius:6px;background:linear-gradient(135deg,#2a1745,#3b1f12);flex:none} :where(html.pf-acad) .les small{margin-left:auto;color:var(--mute)} :where(html.pf-acad) .locked{opacity:.55} :where(html.pf-acad) .lockpill{} :where(html.pf-acad) .lockpill.go{border-color:rgba(247,147,26,.5);color:var(--or2)} :where(html.pf-acad) .grid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr))} :where(html.pf-acad) .ag{display:flex;flex-direction:column;gap:6px} :where(html.pf-acad) .ag .top2{display:flex;gap:9px;align-items:center} :where(html.pf-acad) .mono{width:38px;height:38px;border-radius:10px;display:grid;place-items:center;font-weight:700;color:#fff;flex:none} :where(html.pf-acad) .c-core{background:radial-gradient(circle at 35% 30%,#d6b4ff,#A35BFF 45%,#4b1c8f)} :where(html.pf-acad) .c-foundation{background:linear-gradient(135deg,#E8B86B,#8a5a20);color:#160d02} :where(html.pf-acad) .c-plan{background:linear-gradient(135deg,#A35BFF,#5a20b3)} :where(html.pf-acad) .c-reach{background:linear-gradient(135deg,#7c3aed,#4c1d95)} :where(html.pf-acad) .c-run{background:linear-gradient(135deg,#A35BFF,#6d28d9)} :where(html.pf-acad) .c-studio{background:linear-gradient(135deg,#6d28d9,#A35BFF)} :where(html.pf-acad) .c-board{background:linear-gradient(135deg,#c4a6ff,#7c3aed)} :where(html.pf-acad) .c-office{background:linear-gradient(135deg,#d8c2ff,#7c3aed)} :where(html.pf-acad) .tiers{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,180px),1fr))} :where(html.pf-acad) .tier{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--card);display:flex;flex-direction:column;gap:4px} :where(html.pf-acad) .tier.me{border-color:var(--or2);background:radial-gradient(120% 80% at 100% 0%,rgba(124,58,237,.16),transparent 60%),var(--card)} :where(html.pf-acad) .tier .p{font-family:var(--display);font-size:24px;font-weight:700;line-height:1} :where(html.pf-acad) .tier ul{margin:4px 0 0;padding-left:16px;font-size:12.5px;color:var(--fg2)} :where(html.pf-acad) .mem{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--line)} :where(html.pf-acad) .mem:last-child{border-bottom:0} :where(html.pf-acad) .lb{display:grid;grid-template-columns:26px 30px minmax(0,1fr) auto;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid var(--line)} :where(html.pf-acad) .note{font-size:12px;color:var(--mute);border:1px dashed var(--line);border-radius:12px;padding:10px 12px} :where(html.pf-acad) .chips{display:flex;flex-wrap:wrap;gap:6px} :where(html.pf-acad) .chip{border:1px solid var(--line);background:var(--card);color:var(--mute);border-radius:999px;padding:6px 12px;font-size:13px} :where(html.pf-acad) .chip.on{background:var(--fg);color:var(--chipon);border-color:transparent} :where(html.pf-acad) .crewhero{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:center} :where(html.pf-acad) .crewhero .arg{width:120px;height:150px;object-fit:cover;border-radius:14px;border:1px solid rgba(163,91,255,.5)} @media(max-width:560px){:where(html.pf-acad) .crewhero{grid-template-columns:1fr} :where(html.pf-acad) .crewhero .arg{width:100%;height:220px}} :where(html.pf-acad) .crewgrid{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,190px),1fr))} :where(html.pf-acad) .soonag img.pt{filter:grayscale(.85);opacity:.6} :where(html.pf-acad) .soonag{border-style:dashed!important} :where(html.pf-acad) .crewtag.soontag{background:rgba(247,147,26,.12);color:var(--or2);border:1px solid rgba(247,147,26,.45)} :where(html.pf-acad) .bugsteps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px} :where(html.pf-acad) .bugsteps div{border:1px solid var(--line);border-radius:12px;padding:10px;background:var(--card2);display:flex;flex-direction:column;gap:3px} :where(html.pf-acad) .bugsteps b{color:var(--or2)} :where(html.pf-acad) .bugsteps span{font-size:13px;color:var(--mute)} :where(html.pf-acad) .audit3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:8px} :where(html.pf-acad) .audit3 div{border:1px solid var(--line);border-radius:12px;padding:12px;background:var(--card2)} :where(html.pf-acad) .audit3 b{display:block;font-family:var(--display);font-size:34px;line-height:1;background:linear-gradient(135deg,var(--violet),#c4a6ff);-webkit-background-clip:text;background-clip:text;color:transparent} :where(html.pf-acad) .audit3 span{font-size:13px;color:var(--mute)} :where(html.pf-acad) .chlog{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px} :where(html.pf-acad) .chlog li{display:grid;grid-template-columns:110px 150px minmax(0,1fr);gap:10px;align-items:baseline;border-top:1px solid var(--line);padding-top:8px;font-size:13.5px} :where(html.pf-acad) .chlog .d{font-family:var(--mono);font-size:11.5px;color:var(--mute)} :where(html.pf-acad) .chlog .okc{color:var(--ok)} :where(html.pf-acad) .chlog .opc{color:var(--or2)} @media(max-width:640px){:where(html.pf-acad) .chlog li{grid-template-columns:1fr} :where(html.pf-acad) .bugsteps,:where(html.pf-acad) .audit3{grid-template-columns:1fr}} :where(html.pf-acad) .ccard{display:flex;flex-direction:column;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden;padding:0} :where(html.pf-acad) .ccard:hover{border-color:var(--violet)} :where(html.pf-acad) .ccard.dim .pt{filter:grayscale(.75) brightness(.7)} :where(html.pf-acad) .pt{width:100%;height:190px;object-fit:cover;object-position:center 22%;display:block;background:#07040d} :where(html.pf-acad) .pt.ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:#fff} :where(html.pf-acad) .pt.ph{background:radial-gradient(80% 70% at 50% 30%,rgba(163,91,255,.18),transparent 70%),#0d0816} :where(html.pf-acad) .pt.ph .phm{width:76px;height:76px;border-radius:20px;display:grid;place-items:center;font-family:var(--display);font-size:32px;font-weight:700;color:#fff;box-shadow:0 0 24px rgba(163,91,255,.35)} :where(html.pf-acad) .pt.ph small{font-size:11px;opacity:.8} :where(html.pf-acad) .pt.big{height:260px;border-radius:14px} :where(html.pf-acad) .cb{padding:12px;display:flex;flex-direction:column;gap:4px;flex:1} :where(html.pf-acad) .cb p{margin:0;font-size:13px;color:var(--fg2)} :where(html.pf-acad) .cn{display:flex;align-items:center;gap:8px;flex-wrap:wrap} :where(html.pf-acad) .crewtag{font-family:var(--mono);font-size:9.5px;letter-spacing:.06em;padding:2px 7px;border-radius:999px;color:#fff} :where(html.pf-acad) .sig{color:var(--or2)!important;font-style:italic} :where(html.pf-acad) .inc{align-self:flex-start;margin-top:auto;font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;white-space:nowrap} :where(html.pf-acad) .inc.yes{background:rgba(76,196,127,.16);color:var(--ok)} :where(html.pf-acad) .inc.no{background:rgba(247,147,26,.14);color:var(--or2)} :where(html.pf-acad) .crewh{display:flex;gap:10px;align-items:center;margin-bottom:6px} :where(html.pf-acad) .sw{width:14px;height:14px;border-radius:4px;flex:none} :where(html.pf-acad) .arow{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--line)} :where(html.pf-acad) .arow.dim .mini,:where(html.pf-acad) .arow.dim .mono{filter:grayscale(.8);opacity:.7} :where(html.pf-acad) .arow .mini{width:38px;height:38px;border-radius:10px;object-fit:cover;object-position:center 20%;flex:none} :where(html.pf-acad) .arow .ai{display:flex;flex-direction:column;min-width:0} :where(html.pf-acad) .arow .aa{margin-left:auto;display:flex;flex-direction:column;align-items:flex-end;gap:5px} :where(html.pf-acad) .sm2{padding:5px 11px;font-size:12.5px} :where(html.pf-acad) code{font-family:var(--mono);font-size:12px;background:rgba(163,91,255,.12);border:1px solid var(--line);border-radius:7px;padding:1px 6px} :where(html.pf-acad) code.cmd{display:block;margin:5px 0;padding:6px 9px} :where(html.pf-acad) .sheet{position:fixed;inset:0;z-index:70;background:rgba(5,3,10,.6);display:flex;justify-content:flex-end} :where(html.pf-acad) .sheet[hidden]{display:none} :where(html.pf-acad) .sin{width:min(100%,430px);height:100%;overflow-y:auto;background:var(--bg2);border-left:1px solid var(--line);padding:16px;padding-top:calc(16px + env(safe-area-inset-top,0px));padding-right:max(16px,env(safe-area-inset-right,0px))} :where(html.pf-acad) .kv{display:grid;grid-template-columns:110px minmax(0,1fr);gap:6px 10px;font-size:13.5px;margin:10px 0} :where(html.pf-acad) .kv dt{color:var(--mute)} :where(html.pf-acad) .kv dd{margin:0} :where(html.pf-acad) .sin ul{margin:4px 0 10px;padding-left:18px;font-size:13.5px} :where(html.pf-acad) .em,:where(html.pf-acad) .phem,:where(html.pf-acad) .dlem{display:block} :where(html.pf-acad) .brk{color:var(--fg);opacity:.85} :where(html.pf-acad) .pt.ph .phem{width:96px;height:96px} :where(html.pf-acad) .pt.big .phem{width:130px;height:130px} :where(html.pf-acad) .agrid{display:grid;gap:10px;grid-template-columns:repeat(auto-fill,minmax(min(100%,150px),1fr))} :where(html.pf-acad) .atile{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:var(--card2);display:flex;flex-direction:column} :where(html.pf-acad) .atile .hs{width:100%;height:150px;object-fit:cover;object-position:center 22%;display:block} :where(html.pf-acad) .atile .hs.ph{display:grid;place-items:center;background:radial-gradient(80% 70% at 50% 30%,rgba(163,91,255,.16),transparent 70%),var(--bg2)} :where(html.pf-acad) .atile .hs.ph .phem{width:84px;height:84px} :where(html.pf-acad) .atile .ab{padding:8px 10px 4px;display:flex;flex-direction:column} :where(html.pf-acad) .dl{margin:6px 10px 10px;display:flex;align-items:center;gap:8px;border:1px solid rgba(76,196,127,.5);background:rgba(76,196,127,.1);border-radius:12px;padding:6px 10px 6px 6px;font-weight:600;font-size:13px;color:var(--ok)} :where(html.pf-acad) .dl .dlem{width:34px;height:34px} :where(html.pf-acad) .atile.off .hs{filter:grayscale(1) brightness(.75);opacity:.6} :where(html.pf-acad) .atile.off .dl{border-color:var(--line);background:transparent;color:var(--mute)} :where(html.pf-acad) .atile.off .dl .dlem{filter:grayscale(1);opacity:.45} :where(html.pf-acad) .drow{display:flex;align-items:center;gap:12px} :where(html.pf-acad) .dlem.big{width:46px;height:46px;flex:none} :where(html.pf-acad) .drow.off .dlem{filter:grayscale(1);opacity:.45} :where(html.pf-acad) .fp{font-family:var(--mono);font-size:11px;color:var(--mute)} :where(html.pf-acad) ol.parts{margin:8px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:6px} :where(html.pf-acad) ol.parts li b{display:block} :where(html.pf-acad) a.sp{text-decoration:none} :where(html.pf-acad) a.btn{text-decoration:none;display:inline-block} :where(html.pf-acad) .alist{display:flex;flex-direction:column;gap:10px} :where(html.pf-acad) .arow2{display:grid;grid-template-columns:96px minmax(0,1fr) 104px;gap:12px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:8px;background:var(--card2)} :where(html.pf-acad) .hs2{width:96px;height:96px;border-radius:12px;object-fit:cover;object-position:center 20%;display:block} :where(html.pf-acad) .hs2.ph{display:grid;place-items:center;background:radial-gradient(80% 70% at 50% 30%,rgba(163,91,255,.16),transparent 70%),var(--bg2)} :where(html.pf-acad) .hs2.ph .phem{width:64px;height:64px} :where(html.pf-acad) .ab2{display:flex;flex-direction:column;gap:2px;min-width:0} :where(html.pf-acad) .ab2 b{font-size:16px} :where(html.pf-acad) .dlbox{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;border:1px solid rgba(76,196,127,.55);background:rgba(76,196,127,.1);border-radius:14px;padding:8px 6px;color:var(--ok);font-size:11.5px;line-height:1.2;text-align:center} :where(html.pf-acad) .dlbox .dlem{width:52px;height:52px} :where(html.pf-acad) .dlbox .dlt b{font-size:13px} :where(html.pf-acad) .arow2.off .hs2{filter:grayscale(1) brightness(.8);opacity:.65} :where(html.pf-acad) .arow2.off .dlbox{border-color:rgba(247,147,26,.5);background:rgba(247,147,26,.08);color:var(--or2)} :where(html.pf-acad) .arow2.off .dlbox .dlem{filter:grayscale(1);opacity:.4} @media(max-width:520px){:where(html.pf-acad) .arow2{grid-template-columns:72px minmax(0,1fr) 86px} :where(html.pf-acad) .hs2{width:72px;height:72px} :where(html.pf-acad) .dlbox .dlem{width:40px;height:40px}} :where(html.pf-acad) .pcards{display:grid;gap:10px;grid-template-columns:repeat(5,minmax(0,1fr));margin:12px 0} @media(max-width:1100px){:where(html.pf-acad) .pcards{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:640px){:where(html.pf-acad) .pcards{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:420px){:where(html.pf-acad) .pcards{grid-template-columns:1fr}} :where(html.pf-acad) .stepw{border-color:rgba(247,147,26,.45)} :where(html.pf-acad) .splhere{display:flex;flex-direction:column;gap:2px;margin:6px 0 10px;padding:10px 12px;border-radius:12px;background:rgba(163,91,255,.12);border:1px solid rgba(163,91,255,.35)} :where(html.pf-acad) .splhere b{font-family:var(--display);font-size:18px} :where(html.pf-acad) .pc2 s.was{color:var(--mute);font-size:.62em;font-weight:500;text-decoration-thickness:2px} :where(html.pf-acad) .pc2 .sm s.was{font-size:1em} :where(html.pf-acad) .lpill{align-self:flex-start;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:999px;border:1px solid rgba(76,196,127,.6);color:var(--ok,#4CC47F)} :where(html.pf-acad) .pc2 .deal{color:var(--or2)} :where(html.pf-acad) .spl{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;border-top:1px solid var(--line);padding:10px 0} :where(html.pf-acad) .splt{display:flex;flex-direction:column;gap:3px} :where(html.pf-acad) .splb{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end} :where(html.pf-acad) .spls,:where(html.pf-acad) .splx{font-size:12.5px;border:1px dashed var(--line);border-radius:999px;padding:6px 12px;color:var(--mute);white-space:nowrap} :where(html.pf-acad) .spl.spl-side .splt b{color:var(--or2)} @media(max-width:640px){:where(html.pf-acad) .spl{grid-template-columns:1fr} :where(html.pf-acad) .splb{justify-content:flex-start}} :where(html.pf-acad) .planbox{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1.3fr) auto;gap:14px;align-items:center;border-color:rgba(163,91,255,.45)} :where(html.pf-acad) .planbox .pbl,:where(html.pf-acad) .planbox .pbm{display:flex;flex-direction:column;gap:3px} :where(html.pf-acad) .planbox .pbn{font-family:var(--display);font-size:19px} :where(html.pf-acad) .planbox ul{margin:4px 0 0;padding-left:18px;font-size:13.5px} :where(html.pf-acad) .planbox .pbr{display:flex;flex-direction:column;gap:6px} :where(html.pf-acad) .planbox .pblife{margin-top:4px;color:var(--or2)} :where(html.pf-acad) .planbox .lnk{background:none;border:0;color:var(--or2);text-decoration:underline;cursor:pointer;padding:0;font:inherit} @media(max-width:760px){:where(html.pf-acad) .planbox{grid-template-columns:1fr} :where(html.pf-acad) .planbox .pbr{flex-direction:row;flex-wrap:wrap}} :where(html.pf-acad) .pc2{position:relative;border:1px solid var(--line);border-radius:16px;padding:14px 12px;background:var(--card);display:flex;flex-direction:column;gap:5px} :where(html.pf-acad) .lifewrap{display:grid;grid-template-columns:1fr;gap:12px;align-items:stretch;border:1px dashed rgba(247,147,26,.5);border-radius:18px;padding:12px} :where(html.pf-acad) .lifehead{display:flex;flex-direction:column;gap:4px;justify-content:center} :where(html.pf-acad) .lifewrap>.pc2{max-width:none;width:100%} :where(html.pf-acad) .dhero h1{font-family:var(--display);font-size:26px;margin:6px 0 4px} :where(html.pf-acad) .dstats{display:flex;flex-wrap:wrap;gap:10px;margin:12px 0} :where(html.pf-acad) .dstats>div{border:1px solid var(--line);border-radius:12px;padding:8px 14px;display:flex;flex-direction:column;min-width:110px} :where(html.pf-acad) .dstats b{font-family:var(--display);font-size:24px;line-height:1.1} :where(html.pf-acad) .dstats span{font-size:12px;color:var(--mute)} :where(html.pf-acad) .dstats .hot{border-color:rgba(247,147,26,.7);background:rgba(247,147,26,.08)} :where(html.pf-acad) .dstats .hot b{color:#F7931A} :where(html.pf-acad) .dsteps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px} :where(html.pf-acad) .dsteps>div{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:10px;font-size:13px} :where(html.pf-acad) .dsteps>div>b{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;font-size:12px} :where(html.pf-acad) .dgrp{margin-top:14px} :where(html.pf-acad) .dgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px;margin-top:6px} :where(html.pf-acad) .dtile{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:12px;padding:10px;background:rgba(255,255,255,.02)} :where(html.pf-acad) .dtile .dph{width:44px;height:44px;flex:none;border-radius:12px;object-fit:cover;object-position:50% 22%;border:1px solid var(--line)} :where(html.pf-acad) .dchip .dph.sm{width:24px;height:24px;border-radius:50%;object-fit:cover;object-position:50% 20%} :where(html.pf-acad) .dtile .dlem{width:40px!important;height:40px!important;flex:none} :where(html.pf-acad) .dtile .dl1{display:block;margin-top:2px;line-height:1.35} :where(html.pf-acad) .dlet{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;background:rgba(163,91,255,.25);font-weight:700} :where(html.pf-acad) .dtag{font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:1px 7px;border-radius:999px;vertical-align:middle} :where(html.pf-acad) .dtag.new{background:rgba(247,147,26,.18);color:#F7931A;border:1px solid rgba(247,147,26,.6)} :where(html.pf-acad) .dtag.upd{background:rgba(163,91,255,.15);color:#c9a5ff;border:1px solid rgba(163,91,255,.5)} :where(html.pf-acad) .dup{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:18px;align-items:center;border:1.5px dashed rgba(247,147,26,.7);background:radial-gradient(120% 140% at 100% 0%,rgba(124,58,237,.12),transparent 60%),var(--card)} :where(html.pf-acad) .dup h2{font-family:var(--display);font-size:20px;margin:4px 0 8px} :where(html.pf-acad) .dchips{display:flex;flex-wrap:wrap;gap:6px} :where(html.pf-acad) .dchip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:4px 10px 4px 4px;font-size:12.5px} :where(html.pf-acad) .dchip .dlem.sm{width:22px;height:22px} :where(html.pf-acad) .dupr{display:flex;flex-direction:column;gap:6px;align-items:flex-start} :where(html.pf-acad) .dupr .p2{font-family:var(--display);font-size:30px;font-weight:800} :where(html.pf-acad) .dupr s{font-size:.5em;color:var(--mute);margin-right:6px} @media (max-width:800px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-acad) .dsteps{grid-template-columns:1fr} :where(html.pf-acad) .dup{grid-template-columns:1fr}} :where(html.pf-acad) .pcards>.pc2{margin:24px 0 10px} :where(html.pf-acad) .soonw>.pc2{height:100%} @media(max-width:1100px){:where(html.pf-acad) .pcards>.pc2{margin:0}} :where(html.pf-acad) .mxt thead th{vertical-align:top} :where(html.pf-acad) .agrid{--panel:#140e20;--fg:#f3eaff;--fg2:#d8cdef;--mute:#a99cc8;--gold:#F2D58A;--or2:#F7931A;--ok:#3ddc97;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:14px!important} :where(html.pf-acad) .agrid .ag{position:relative;display:flex;flex-direction:column;text-align:left;background:var(--panel);border:1px solid #2a1f3d;border-radius:14px;overflow:hidden;padding:0;color:var(--fg);cursor:pointer;font:inherit;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease} :where(html.pf-acad) .agrid .ag:hover,:where(html.pf-acad) .agrid .ag:focus-visible{transform:translateY(-3px);border-color:var(--cc);box-shadow:0 14px 40px rgba(0,0,0,.45)} :where(html.pf-acad) .agrid .ag .ph{position:relative;aspect-ratio:3/4;overflow:hidden;background:#07040d} :where(html.pf-acad) .agrid .ag .ph img{width:100%;height:100%;object-fit:cover;object-position:50% 14%;display:block} :where(html.pf-acad) .agrid .ag .ph::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(11,7,17,.95) 0%,rgba(11,7,17,.1) 45%,transparent 70%)} :where(html.pf-acad) .agrid .ag .plan{position:absolute;top:10px;right:10px;z-index:2;font:500 10.5px var(--mono,monospace);letter-spacing:.08em;text-transform:uppercase;padding:3px 9px;border-radius:999px;background:rgba(11,7,17,.7);border:1px solid rgba(255,255,255,.18);color:var(--fg)} :where(html.pf-acad) .agrid .ag .plan.free{background:var(--ok);color:#0b0711;border-color:transparent} :where(html.pf-acad) .agrid .ag .plan.later{color:var(--gold);border-color:rgba(242,213,138,.5)} :where(html.pf-acad) .agrid .ag .cap{position:absolute;left:12px;right:12px;bottom:10px;z-index:2;display:grid;gap:2px} :where(html.pf-acad) .agrid .ag .cap b{font:700 21px var(--display)} :where(html.pf-acad) .agrid .ag .cap span{font:500 11px var(--mono,monospace);letter-spacing:.12em;text-transform:uppercase;color:var(--cc)} :where(html.pf-acad) .agrid .ag .bd{padding:12px 14px 14px;display:grid;gap:6px;align-content:start;flex:1} :where(html.pf-acad) .agrid .ag .bd p{font-size:14px;color:var(--fg2);margin:0} :where(html.pf-acad) .agrid .ag .bd em{font-style:normal;font-size:14px;color:var(--or2)} :where(html.pf-acad) .agrid .ag .bd small{font-size:12px;color:var(--mute)} :where(html.pf-acad) .agrid .ag.dim .ph img{filter:grayscale(.6) brightness(.8)} :where(html.pf-acad) .agrid .ag.wide{grid-column:1/-1;flex-direction:row;border-color:rgba(242,213,138,.5);background:radial-gradient(80% 120% at 100% 0%,rgba(242,213,138,.12),transparent 60%),var(--panel)} :where(html.pf-acad) .agrid .ag.wide .ph{width:min(36%,330px);flex:none} :where(html.pf-acad) .agrid .ag.wide .bd{padding:26px 28px;gap:10px;justify-content:center;align-content:center} :where(html.pf-acad) .agrid .ag.wide .bd .wk{font:500 12px var(--mono,monospace);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)} :where(html.pf-acad) .agrid .ag.wide .bd h3{font:700 clamp(26px,3.2vw,38px)/1.1 var(--display);margin:0} :where(html.pf-acad) .agrid .ag.wide .bd p{font-size:16px} :where(html.pf-acad) .agrid .ag.wide .bd em{font:600 20px var(--display)} :where(html.pf-acad) .agrid .ag.wide .bd ul{margin:2px 0 0;padding-left:18px;color:var(--fg2);font-size:15px;display:grid;gap:4px} @media(max-width:1100px){:where(html.pf-acad) .agrid{grid-template-columns:repeat(3,minmax(0,1fr))!important}} @media(max-width:760px){:where(html.pf-acad) .agrid{grid-template-columns:repeat(2,minmax(0,1fr))!important} :where(html.pf-acad) .agrid .ag.wide{flex-direction:column} :where(html.pf-acad) .agrid .ag.wide .ph{width:100%;aspect-ratio:4/5;max-height:460px} :where(html.pf-acad) .agrid .ag.wide .bd{padding:16px}} :where(html.pf-acad) .mxw{margin:12px 0} :where(html.pf-acad) .mxs{overflow-x:auto} :where(html.pf-acad) .mxt{width:100%;border-collapse:collapse;font-size:13px;min-width:720px} :where(html.pf-acad) .mxt th,:where(html.pf-acad) .mxt td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:center;vertical-align:middle} :where(html.pf-acad) .mxt th:first-child,:where(html.pf-acad) .mxt td:first-child{text-align:left;color:var(--fg,#eee)} :where(html.pf-acad) .mxt th{font-size:12px;position:sticky;top:0;background:var(--card)} :where(html.pf-acad) .mxt .pro{background:rgba(163,91,255,.08)} :where(html.pf-acad) .mxt tr.g td{font-weight:700;color:#F7931A;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding-top:14px;text-align:left} :where(html.pf-acad) .mxt .mxy{color:#3ccf91;font-weight:700} :where(html.pf-acad) .mxt .mxn{color:var(--mute)} :where(html.pf-acad) .mxt s.was{color:var(--mute);margin-right:4px;text-decoration-color:#F7931A} :where(html.pf-acad) .mxt .lpill{font-size:9px} :where(html.pf-acad) .launchb{border:1.5px dashed rgba(247,147,26,.8);border-radius:16px;padding:16px 18px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:14px 18px;background:radial-gradient(120% 140% at 0% 0%,rgba(124,58,237,.14),transparent 60%),rgba(247,147,26,.04);margin:12px 0} :where(html.pf-acad) .launchb .lbl{display:flex;flex-direction:column;gap:4px} :where(html.pf-acad) .launchb .kick{color:#F7931A} :where(html.pf-acad) .launchb .lbh{font-family:var(--display);font-size:18px;line-height:1.2} :where(html.pf-acad) .launchb .lbts{grid-column:1/-1;grid-row:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px} :where(html.pf-acad) .launchb .lbt{border:1px solid rgba(247,147,26,.4);border-radius:12px;padding:10px 12px;background:rgba(0,0,0,.25);display:flex;flex-direction:column;gap:2px} :where(html.pf-acad) .launchb .lbn{font-size:11.5px;color:var(--mute)} :where(html.pf-acad) .launchb .lbp{white-space:nowrap;font-family:var(--display);font-size:26px;font-weight:700;line-height:1.1} :where(html.pf-acad) .launchb .lbp s{font-size:.55em;color:var(--mute);margin-right:6px;text-decoration-color:#F7931A;text-decoration-thickness:2px} :where(html.pf-acad) .launchb .lbper{font-size:12px;color:var(--mute)} @media(max-width:700px){:where(html.pf-acad) .launchb{grid-template-columns:1fr} :where(html.pf-acad) .launchb .lbts{grid-row:auto}} @media(max-width:480px){:where(html.pf-acad) .launchb .lbts{grid-template-columns:1fr}} :where(html.pf-acad) .lifebx{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(0,1fr);gap:20px;align-items:center;border:1.5px solid rgba(247,147,26,.6);border-radius:18px;padding:20px 22px;background:radial-gradient(120% 120% at 100% 0%,rgba(124,58,237,.16),transparent 60%),var(--card);margin:12px 0} :where(html.pf-acad) .lifebx .kick{color:#F7931A} :where(html.pf-acad) .lifebx h2{font-family:var(--display);font-size:24px;margin:6px 0 4px} :where(html.pf-acad) .lifebx .an{font-weight:700;font-size:13px;color:#F2D58A} :where(html.pf-acad) .lifebx ul{list-style:none;padding:0;margin:8px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:5px 16px;font-size:13.5px} :where(html.pf-acad) .lifebx li{padding-left:18px;position:relative} :where(html.pf-acad) .lifebx li::before{content:"✓";position:absolute;left:0;color:var(--ok,#3ccf91);font-weight:700} :where(html.pf-acad) .lifebx .rt{display:flex;flex-direction:column;align-items:flex-start;gap:6px} :where(html.pf-acad) .lifebx .big{font-family:var(--display);font-size:46px;font-weight:800;line-height:1} :where(html.pf-acad) .lifebx .big s{font-size:.45em;color:var(--mute);margin-right:8px;text-decoration-color:#F7931A;text-decoration-thickness:2px;vertical-align:middle} :where(html.pf-acad) .lifebx .big small{font-size:15px;font-weight:500;color:var(--mute)} :where(html.pf-acad) .lifebx .btn{width:100%} @media (max-width:800px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-acad) .lifebx{grid-template-columns:1fr} :where(html.pf-acad) .lifebx ul{grid-template-columns:1fr}} :where(html.pf-acad) .pcards{grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,2.1fr)!important;align-items:stretch} :where(html.pf-acad) .soonw{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:10px;border:1.5px dashed rgba(242,213,138,.6);border-radius:18px;padding:24px 10px 10px;background:rgba(242,213,138,.04)} :where(html.pf-acad) .soonw>.swb{position:absolute;top:-12px;left:14px;white-space:nowrap;line-height:1.4;z-index:2;font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:3px 10px;border-radius:999px;background:#2a2112;border:1px solid rgba(242,213,138,.6);color:#F2D58A} @media(max-width:1100px){:where(html.pf-acad) .pcards{grid-template-columns:repeat(3,minmax(0,1fr))!important} :where(html.pf-acad) .soonw{grid-column:1/-1}} @media(max-width:640px){:where(html.pf-acad) .pcards{grid-template-columns:1fr!important} :where(html.pf-acad) .soonw{grid-template-columns:1fr}} :where(html.pf-acad) .post ul.plist{margin:8px 0 0 18px;line-height:1.6} :where(html.pf-acad) .lifehead b{font-family:var(--display);font-size:18px} @media(max-width:620px){:where(html.pf-acad) .lifewrap{grid-template-columns:1fr}} :where(html.pf-acad) .pc2 .p{font-family:var(--display);font-size:28px;font-weight:700;line-height:1} :where(html.pf-acad) .pc2 ul{margin:2px 0 6px;padding-left:16px;font-size:12.5px;color:var(--fg2);display:flex;flex-direction:column;gap:2px} :where(html.pf-acad) .pc2.below{opacity:.62} :where(html.pf-acad) .pc2.me{border:2px solid var(--or2);background:radial-gradient(120% 80% at 100% 0%,rgba(124,58,237,.16),transparent 60%),var(--card)} :where(html.pf-acad) .pc2.t-vip .p{color:var(--gold)} :where(html.pf-acad) .here{position:absolute;top:-10px;left:12px;font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;padding:2px 8px;border-radius:999px;background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff} :where(html.pf-acad) .lab2{font-size:11px;font-weight:600;color:var(--violet);margin-top:6px} :where(html.pf-acad) .worth{border-top:1px dashed var(--line);padding-top:6px;display:flex;flex-direction:column;gap:4px;margin-bottom:6px} :where(html.pf-acad) .worth div{display:flex;flex-direction:column;font-size:11.5px} :where(html.pf-acad) .worth b{font-weight:600} :where(html.pf-acad) .worth span{color:var(--ok)} :where(html.pf-acad) .nextup{border-color:rgba(163,91,255,.55)} :where(html.pf-acad) .nextup ul,:where(html.pf-acad) .nx ul{margin:6px 0 10px;padding-left:16px;font-size:13px;color:var(--fg2)} :where(html.pf-acad) .p2{font-family:var(--display);font-weight:700;font-size:18px} :where(html.pf-acad) .nx{margin-top:6px} :where(html.pf-acad) .nx ul{margin:4px 0 6px;font-size:12px} @media(max-width:1060px){:where(html.pf-acad) .cols{grid-template-columns:minmax(0,1fr)}} @media (max-width:820px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-acad) .shell{grid-template-columns:minmax(0,1fr)} :where(html.pf-acad) .side{position:fixed;inset:0 auto 0 0;width:min(84vw,300px);z-index:40;transform:translateX(-105%);transition:transform .2s;padding-top:calc(14px + env(safe-area-inset-top,0px))} :where(html.pf-acad) .side.open{transform:none;box-shadow:0 0 0 100vmax rgba(0,0,0,.5)} :where(html.pf-acad) .burger{display:inline-block} :where(html.pf-acad) .tabs{display:none} :where(html.pf-acad) .viewas span{display:none} :where(html.pf-acad) .brand{letter-spacing:.14em;font-size:12px} :where(html.pf-acad) .brand em{display:none} :where(html.pf-acad) .viewas{margin-left:auto} :where(html.pf-acad) .viewas select{max-width:128px} :where(html.pf-acad) .top>.av{display:none} :where(html.pf-acad) .skin{padding:5px 8px} :where(html.pf-acad) .main{padding:14px max(14px,env(safe-area-inset-left,0px)) 60px}} :where(html.pf-acad) .sp .nm{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} :where(html.pf-acad) .sp .rs{flex:none;min-width:18px;margin-left:4px;display:flex;justify-content:flex-end;align-items:center} :where(html.pf-acad) .sp .rs .cnt,:where(html.pf-acad) .sp .rs .lk{margin-left:0} :where(html.pf-acad) .sp.lockd{color:var(--mute);opacity:.62} :where(html.pf-acad) .sp.lockd .dot{filter:grayscale(1)} :where(html.pf-acad) .lkt{display:inline-flex;align-items:center;gap:3px;font-family:var(--mono);font-size:9.5px;letter-spacing:.04em;border:1px solid var(--line);border-radius:999px;padding:1px 6px;white-space:nowrap} :where(html.pf-acad) .hdl{display:flex;gap:4px;align-items:center} :where(html.pf-acad) .hlink{border:1px solid var(--line);background:transparent;color:var(--fg);padding:6px 10px;border-radius:9px;font-size:13px;font-weight:500;text-decoration:none;white-space:nowrap} :where(html.pf-acad) .hlink:hover{border-color:var(--or2)} :where(html.pf-acad) .stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:10px} :where(html.pf-acad) .stat{border:1px solid var(--line);border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:4px} :where(html.pf-acad) .stat b{font-family:var(--display);font-size:22px;background:linear-gradient(90deg,#4c1d95,#7c3aed);-webkit-background-clip:text;background-clip:text;color:transparent} :where(html.pf-acad) .osgrid,:where(html.pf-acad) .pow{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px} :where(html.pf-acad) .pow{grid-template-columns:repeat(2,minmax(0,1fr))} :where(html.pf-acad) .osgrid>div,:where(html.pf-acad) .pow>div{border:1px solid var(--line);border-radius:10px;padding:9px 10px;display:flex;flex-direction:column;gap:2px} :where(html.pf-acad) .steps{list-style:none;margin:10px 0 0;padding:0;display:flex;flex-direction:column;gap:8px} :where(html.pf-acad) .steps li{display:flex;gap:10px;align-items:flex-start} :where(html.pf-acad) .steps li>div{display:flex;flex-direction:column} :where(html.pf-acad) .sn{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:12px;color:#fff;background:linear-gradient(135deg,#4c1d95,#7c3aed)} :where(html.pf-acad) .wpcard{display:flex;flex-direction:column;gap:4px;text-align:left;width:100%;cursor:pointer;color:var(--fg);border:1px solid rgba(247,147,26,.45)} :where(html.pf-acad) .wptoc ol{margin:8px 0 0;padding-left:20px;columns:2;column-gap:20px} :where(html.pf-acad) .wptoc li{margin:2px 0} :where(html.pf-acad) .wptoc button{border:0;background:none;color:var(--fg);padding:2px 0;text-align:left;font-size:13.5px;cursor:pointer} :where(html.pf-acad) .wptoc button:hover{color:var(--or2)} :where(html.pf-acad) .wp{line-height:1.65;font-size:15px} :where(html.pf-acad) .wp h3{font-family:var(--display);font-size:18px;margin:22px 0 6px;scroll-margin-top:70px} :where(html.pf-acad) .wp h3:first-of-type{margin-top:12px} :where(html.pf-acad) .wp p{margin:0 0 10px} :where(html.pf-acad) .wp ul,:where(html.pf-acad) .wp ol{margin:0 0 12px;padding-left:20px} :where(html.pf-acad) .wp li{margin:3px 0} :where(html.pf-acad) .wp a{color:var(--or2)} :where(html.pf-acad) .wtw{overflow-x:auto;margin:6px 0 14px} :where(html.pf-acad) .wt{width:100%;border-collapse:collapse;font-size:13.5px;min-width:420px} :where(html.pf-acad) .wt th,:where(html.pf-acad) .wt td{border:1px solid var(--line);padding:7px 9px;text-align:left;vertical-align:top} :where(html.pf-acad) .wt th{background:var(--card2);font-weight:600} @media(max-width:1380px){:where(html.pf-acad) .hdl .hlink:not(.hask){display:none} :where(html.pf-acad) .viewas span{display:none}} @media(max-width:900px){:where(html.pf-acad) .hdl{display:none}} @media(max-width:620px){:where(html.pf-acad) .stats,:where(html.pf-acad) .osgrid,:where(html.pf-acad) .pow{grid-template-columns:1fr} :where(html.pf-acad) .wptoc ol{columns:1}} @media print{:where(html.pf-acad) .top,:where(html.pf-acad) .side,:where(html.pf-acad) #right,:where(html.pf-acad) .wptoc,:where(html.pf-acad) .wphero .btn{display:none!important} :where(html.pf-acad) .shell,:where(html.pf-acad) .cols{display:block!important} :where(html.pf-acad) .wp{border:0}} :where(html.pf-acad) .urg{display:flex;flex-direction:column;gap:5px;margin:6px 0;padding:9px 10px;border-radius:12px;background:rgba(247,147,26,.08);border:1px solid rgba(247,147,26,.35)} :where(html.pf-acad) .cd{font-family:var(--mono);font-size:13px;color:var(--or2)} :where(html.pf-acad) .cd b{font-size:17px;color:var(--fg)} :where(html.pf-acad) .soon{font-family:var(--mono);font-size:9.5px;font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:999px;color:#fff;background:linear-gradient(90deg,#4c1d95,#7c3aed)} :where(html.pf-acad) .soonc{border-color:rgba(247,147,26,.5);display:flex;flex-direction:column;gap:4px} :where(html.pf-acad) .tgl{display:inline-flex;align-items:center;gap:10px;margin-top:10px;border:1px solid var(--line);background:transparent;color:var(--fg);border-radius:999px;padding:6px 14px 6px 6px;font-size:13.5px;cursor:pointer;align-self:flex-start} :where(html.pf-acad) .tgl .kn{width:36px;height:20px;border-radius:999px;background:var(--card2);border:1px solid var(--line);position:relative;flex:none} :where(html.pf-acad) .tgl .kn::after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--mute);transition:left .15s} :where(html.pf-acad) .tgl.on .kn{background:linear-gradient(90deg,#4c1d95,#7c3aed)} :where(html.pf-acad) .tgl.on .kn::after{left:18px;background:#fff} :where(html.pf-acad) .cfab{position:fixed;right:18px;bottom:18px;z-index:45;display:flex;align-items:center;gap:8px;border:1px solid rgba(163,91,255,.6);background:var(--bg2);color:var(--fg);border-radius:999px;padding:5px 14px 5px 5px;font-weight:600;box-shadow:0 8px 30px rgba(0,0,0,.35);cursor:pointer} :where(html.pf-acad) .cfab img{width:34px;height:34px;border-radius:50%;object-fit:cover} :where(html.pf-acad) body.chaton .cfab{display:none} :where(html.pf-acad) .chat{position:fixed;right:14px;bottom:14px;top:72px;width:min(400px,calc(100vw - 28px));z-index:46;display:flex;flex-direction:column;background:var(--bg2);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 60px rgba(0,0,0,.45);overflow:hidden} :where(html.pf-acad) .chat[hidden]{display:none} :where(html.pf-acad) .chead{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--line);background:radial-gradient(120% 120% at 100% 0%,rgba(163,91,255,.25),transparent 60%)} :where(html.pf-acad) .chead img{width:38px;height:38px;border-radius:50%;object-fit:cover;border:1px solid rgba(163,91,255,.6)} :where(html.pf-acad) .chead div{flex:1;display:flex;flex-direction:column} :where(html.pf-acad) .chead small{color:var(--mute);font-size:11.5px} :where(html.pf-acad) .cx{border:1px solid var(--line);background:transparent;color:var(--fg);border-radius:8px;padding:4px 9px;font-size:12px;cursor:pointer} :where(html.pf-acad) .clog{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:10px} :where(html.pf-acad) .cm{display:flex;gap:8px;align-items:flex-start} :where(html.pf-acad) .cm.u{justify-content:flex-end} :where(html.pf-acad) .cav{width:28px;height:28px;border-radius:50%;object-fit:cover;flex:none} :where(html.pf-acad) .cav.big{width:56px;height:56px} :where(html.pf-acad) .cm .cb{max-width:85%;padding:9px 12px;border-radius:14px;font-size:14px;line-height:1.5;background:var(--card2);border:1px solid var(--line);flex:none;display:block} :where(html.pf-acad) .cm.u .cb{background:linear-gradient(135deg,rgba(76,29,149,.9),rgba(124,58,237,.9));color:#fff;border:0} :where(html.pf-acad) .cgo{display:inline-block;width:auto;margin:6px 6px 0 0;border:1px solid rgba(247,147,26,.6);background:transparent;color:var(--or2);border-radius:999px;padding:4px 11px;font-size:12.5px;font-weight:600;cursor:pointer} :where(html.pf-acad) .cbr{display:inline-block;margin-top:6px;font-family:var(--mono);font-size:10.5px;color:var(--ok);border:1px solid rgba(76,196,127,.5);border-radius:999px;padding:2px 9px} :where(html.pf-acad) .csug{display:flex;flex-wrap:wrap;gap:6px} :where(html.pf-acad) .csug button{border:1px solid var(--line);background:transparent;color:var(--fg);border-radius:999px;padding:6px 11px;font-size:12.5px;cursor:pointer} :where(html.pf-acad) .csug button:hover{border-color:var(--violet)} :where(html.pf-acad) .cfoot{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line)} :where(html.pf-acad) .cfoot textarea{flex:1;resize:none;border:1px solid var(--line);background:var(--bg);color:var(--fg);border-radius:12px;padding:9px 11px;font:inherit;font-size:16px;max-height:120px} :where(html.pf-acad) .cnote{margin:0;padding:0 12px 10px;font-size:11px;color:var(--mute)} :where(html.pf-acad) .dots{display:inline-flex;gap:4px} :where(html.pf-acad) .dots i{width:6px;height:6px;border-radius:50%;background:var(--mute);animation:dp 1s infinite} :where(html.pf-acad) .dots i:nth-child(2){animation-delay:.15s} :where(html.pf-acad) .dots i:nth-child(3){animation-delay:.3s} @keyframes dp{0%,100%{opacity:.25}50%{opacity:1}} :where(html.pf-acad) .hask{border-color:rgba(163,91,255,.6)} :where(html.pf-acad) .bchat{display:flex;gap:14px;align-items:center;border-color:rgba(163,91,255,.5)} :where(html.pf-acad) .parts li.bdone b{color:var(--ok)} @media(max-width:620px){:where(html.pf-acad) .chat{inset:0;width:auto;top:0;border-radius:0} :where(html.pf-acad) .bchat{flex-wrap:wrap} :where(html.pf-acad) .cfab span{display:none} :where(html.pf-acad) .cfab{padding:5px}} :where(html.pf-acad) .arghero{display:grid;grid-template-columns:minmax(0,300px) minmax(0,1fr);gap:22px;align-items:start;padding:22px} :where(html.pf-acad) .argbig{width:100%;aspect-ratio:3/4;object-fit:cover;object-position:50% 20%;border-radius:16px;border:1px solid rgba(163,91,255,.55);box-shadow:0 18px 50px rgba(122,53,224,.35)} :where(html.pf-acad) .arghero h1{font-family:var(--display);font-size:30px;line-height:1.1;margin:6px 0 8px} :where(html.pf-acad) .lead2{font-size:16px;line-height:1.55;margin:0 0 12px} :where(html.pf-acad) .argroles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} :where(html.pf-acad) .argroles div{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:3px;background:rgba(163,91,255,.06)} :where(html.pf-acad) .argroles b{color:var(--or2)} :where(html.pf-acad) .argroles span{font-size:13.5px;color:var(--mute);line-height:1.45} :where(html.pf-acad) .argsig{font-family:var(--display);font-size:20px;margin:14px 0 2px;background:linear-gradient(90deg,var(--violet),#c4a6ff);-webkit-background-clip:text;background-clip:text;color:transparent} :where(html.pf-acad) .crewstrip{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap} @media(max-width:760px){:where(html.pf-acad) .arghero{grid-template-columns:1fr} :where(html.pf-acad) .argbig{max-height:360px} :where(html.pf-acad) .argroles{grid-template-columns:1fr}} :where(html.pf-acad) [data-skin="light"]{--ok:#1c7d44;--ort:#a94e08} :where(html.pf-acad) [data-skin="light"] .brand em,:where(html.pf-acad) [data-skin="light"] .role,:where(html.pf-acad) [data-skin="light"] .kick,:where(html.pf-acad) [data-skin="light"] .lockpill.go,:where(html.pf-acad) [data-skin="light"] .inc.no,:where(html.pf-acad) [data-skin="light"] .arow2.off .dlbox,:where(html.pf-acad) [data-skin="light"] .cd,:where(html.pf-acad) [data-skin="light"] .cgo,:where(html.pf-acad) [data-skin="light"] .argroles b,:where(html.pf-acad) [data-skin="light"] .sig,:where(html.pf-acad) [data-skin="light"] [style*="color:var(--or2)"]{color:var(--ort)!important} :where(html.pf-acad) [data-skin="light"] .cgo{border-color:rgba(169,78,8,.55)} :where(html.pf-acad) [data-skin="light"] .argsig{background:linear-gradient(90deg,#6a2bd0,#4c1d95);-webkit-background-clip:text;background-clip:text} :where(html.pf-acad) [data-skin="light"] .sp.lockd{opacity:.8} :where(html.pf-acad) [data-skin="light"] .lockpill,:where(html.pf-acad) [data-skin="light"] .lkt{color:#4d4a55;border-color:#cfcbd8} :where(html.pf-acad) [data-skin="light"] .soon{color:#16101c} :where(html.pf-acad) [data-skin="light"] .hlink,:where(html.pf-acad) [data-skin="light"] .cx,:where(html.pf-acad) [data-skin="light"] .csug button{color:var(--fg);border-color:#cfcbd8} :where(html.pf-acad) [data-skin="light"] .tierb{color:var(--ort);border-color:rgba(169,78,8,.5)} :where(html.pf-acad) .ccard.wide{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,260px) minmax(0,1fr)} :where(html.pf-acad) .ccard.wide .pt{height:100%;min-height:260px} :where(html.pf-acad) .ccard.wide .cb{padding:16px 18px;display:flex;flex-direction:column;gap:6px} :where(html.pf-acad) .wcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:4px 0} :where(html.pf-acad) .wcols ul{margin:4px 0 0;padding-left:18px;font-size:13.5px} :where(html.pf-acad) .wcols .cmd{display:block;margin-top:5px} @media(max-width:700px){:where(html.pf-acad) .ccard.wide{grid-template-columns:1fr} :where(html.pf-acad) .ccard.wide .pt{min-height:180px} :where(html.pf-acad) .wcols{grid-template-columns:1fr}} :where(html.pf-acad) .addg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:10px} :where(html.pf-acad) .addg>div{border:1px solid var(--line);border-radius:12px;padding:10px 12px;display:flex;flex-direction:column;gap:4px} :where(html.pf-acad) .addg .btn{align-self:flex-start;margin-top:auto} @media(max-width:700px){:where(html.pf-acad) .addg{grid-template-columns:1fr}} html:where(.pf-acad){background-color:#0b0711!important} :where(html.pf-acad) body{background-color:transparent!important;background-image:none!important} :where(html.pf-acad) body::after{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(1100px 900px at 85% 0,rgba(124,58,190,.42),transparent 70%),radial-gradient(900px 900px at 0% 100%,rgba(110,50,180,.22),transparent 70%),radial-gradient(900px 700px at 35% 60%,rgba(124,58,190,.08),transparent 70%)} html:where(.pf-acad)::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(rgba(255,255,255,.16) 1px,transparent 1.5px);background-size:24px 24px;-webkit-mask-image:radial-gradient(1000px 800px at 85% 0,#000,transparent 70%),radial-gradient(800px 800px at 0% 100%,#000,transparent 70%);mask-image:radial-gradient(1000px 800px at 85% 0,#000,transparent 70%),radial-gradient(800px 800px at 0% 100%,#000,transparent 70%)} :where(html.pf-acad) [data-skin="light"]{background-color:#f4f0fb!important} :where(html.pf-acad) [data-skin="light"] body::after{background:radial-gradient(1100px 900px at 85% 0,rgba(163,91,255,.20),transparent 70%),radial-gradient(900px 900px at 0% 100%,rgba(124,58,237,.08),transparent 70%)} :where(html.pf-acad) [data-skin="light"]::before{background-image:radial-gradient(rgba(40,20,70,.14) 1px,transparent 1.5px)} :where(html.pf-acad) .top{background:rgba(11,7,17,.62)!important;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)} :where(html.pf-acad) .side{background:rgba(16,10,24,.45)!important} :where(html.pf-acad) [data-skin="light"] .top{background:rgba(255,255,255,.72)!important} :where(html.pf-acad) [data-skin="light"] .side{background:rgba(255,255,255,.55)!important} :where(html.pf-acad) .tierb{font-family:var(--mono);font-size:11px;letter-spacing:.06em;padding:5px 10px;border-radius:999px;border:1px solid rgba(247,147,26,.5);color:var(--or2);white-space:nowrap} :where(html.pf-acad) a.av{text-decoration:none;color:inherit} :where(html.pf-acad) .glist{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px;margin-top:8px} :where(html.pf-acad) .gl{display:flex;flex-direction:column;gap:3px;text-align:left;border:1px solid var(--line);background:transparent;color:var(--fg);border-radius:12px;padding:10px 12px;cursor:pointer} :where(html.pf-acad) .gl:hover{border-color:var(--violet)} :where(html.pf-acad) .askf{display:flex;flex-direction:column;gap:8px} :where(html.pf-acad) .askf label{display:flex;flex-direction:column;gap:4px;font-size:13px;color:var(--mute)} :where(html.pf-acad) .askf input,:where(html.pf-acad) .askf select,:where(html.pf-acad) .askf textarea{} :where(html.pf-acad) .askf .btn{align-self:flex-start} :where(html.pf-acad) .bub{border:1px solid var(--line);border-radius:12px;padding:9px 12px;margin-top:8px} :where(html.pf-acad) .bub.staff{border-color:rgba(163,91,255,.5)} :where(html.pf-acad) .bub small{color:var(--mute)} :where(html.pf-acad) .bub p{margin:4px 0 0} :where(html.pf-acad) .trow{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;text-align:left;border:0;border-top:1px solid var(--line);background:none;color:var(--fg);padding:10px 2px;cursor:pointer} :where(html.pf-acad) .trow span:first-child{display:flex;flex-direction:column} :where(html.pf-acad) .dlbox.soon{opacity:.85;cursor:default} :where(html.pf-acad) a.dlbox{text-decoration:none;color:inherit} :where(html.pf-acad) a.btn{text-decoration:none;display:inline-flex;align-items:center;justify-content:center} :where(html.pf-acad) .flash{position:sticky;top:calc(env(safe-area-inset-top,0px) + 52px);z-index:19;display:flex;align-items:center;gap:12px;width:100%;padding:14px max(16px,env(safe-area-inset-right,0px)) 14px max(16px,env(safe-area-inset-left,0px));font-size:16px;font-weight:600;line-height:1.35;color:#062611;background:#3ddc84;border-bottom:1px solid rgba(0,0,0,.25)} :where(html.pf-acad) .flash .fi{font-size:20px;flex:none} :where(html.pf-acad) .flash .ft{flex:1;min-width:0} :where(html.pf-acad) .flash .x{flex:none;background:none;border:0;color:inherit;font-size:26px;line-height:1;cursor:pointer;padding:0 4px;opacity:.8} :where(html.pf-acad) .rec>summary{cursor:pointer;list-style:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px} :where(html.pf-acad) .rec>summary::-webkit-details-marker{display:none} :where(html.pf-acad) .rec>summary::after{content:"▾";margin-left:auto;opacity:.6} :where(html.pf-acad) .rec[open]>summary::after{content:"▴"} :where(html.pf-acad) .rec .lrow{padding:4px 0} :where(html.pf-acad) .rec .audit{max-height:360px;overflow:auto} :where(html.pf-acad) .kitrow>summary{cursor:pointer;list-style:none} :where(html.pf-acad) .kitrow>summary::-webkit-details-marker{display:none} :where(html.pf-acad) .kitrow>.arow{padding-left:14px;opacity:.9} :where(html.pf-acad) .flash.bad{background:#ff6b6b;color:#2a0505} :where(html.pf-acad) .lgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:12px} :where(html.pf-acad) .lgrid div{border:1px solid var(--line);border-radius:10px;padding:8px 10px;display:flex;flex-direction:column;gap:2px} :where(html.pf-acad) .lgrid b{font-family:var(--mono);font-size:14px} :where(html.pf-acad) .terms{max-height:300px;overflow:auto;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13.5px;line-height:1.5} :where(html.pf-acad) .terms p{margin:0 0 8px} :where(html.pf-acad) .agree{flex-direction:row!important;align-items:center;gap:10px!important;font-size:15px!important;color:var(--fg)!important;cursor:pointer;position:relative} :where(html.pf-acad) .agree input{position:absolute;opacity:0;width:1px;height:1px} :where(html.pf-acad) .sw2{width:40px;height:22px;border-radius:999px;background:var(--card2);border:1px solid var(--line);position:relative;flex:none} :where(html.pf-acad) .sw2::after{content:"";position:absolute;top:2px;left:2px;width:16px;height:16px;border-radius:50%;background:var(--mute);transition:left .15s} :where(html.pf-acad) .agree input:checked+.sw2{background:linear-gradient(90deg,#4c1d95,#7c3aed)} :where(html.pf-acad) .agree input:checked+.sw2::after{left:20px;background:#fff} :where(html.pf-acad) .agree input:focus-visible+.sw2{outline:2px solid var(--or2);outline-offset:2px} :where(html.pf-acad) .lrow{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:8px 2px;margin-top:6px} :where(html.pf-acad) .audit{display:flex;flex-direction:column;margin-top:6px} :where(html.pf-acad) .arow{display:grid;grid-template-columns:140px minmax(0,1fr);gap:4px 10px;border-top:1px solid var(--line);padding:8px 2px} :where(html.pf-acad) .arow .fp{grid-column:2} @media(max-width:620px){:where(html.pf-acad) .lgrid{grid-template-columns:repeat(2,minmax(0,1fr))} :where(html.pf-acad) .arow{grid-template-columns:1fr} :where(html.pf-acad) .arow .fp{grid-column:1}} :where(html.pf-acad) .mtlist{display:flex;flex-direction:column;gap:12px;margin-top:14px} :where(html.pf-acad) .mtday b{display:block;font-size:13px;margin-bottom:6px} :where(html.pf-acad) .mtslots{display:flex;flex-wrap:wrap;gap:8px} :where(html.pf-acad) .mtslots form{margin:0} :where(html.pf-acad) .mtslot{display:flex;flex-direction:column;align-items:center;min-width:76px;min-height:52px;justify-content:center;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--fg);font:inherit;font-weight:700;font-size:15px;cursor:pointer} :where(html.pf-acad) .mtslot small{font-weight:500;font-size:11px;color:var(--mute)} :where(html.pf-acad) .mtslot:hover{border-color:var(--org2,#F7931A)} @media (prefers-reduced-motion:reduce){html:where(.pf-acad),:where(html.pf-acad) *{transition:none!important}} :where(html.pf-acad) .ctw{container-type:inline-size} :where(html.pf-acad) .ctw .ctcert{border-radius:22px;padding:3px;background:linear-gradient(135deg,#A35BFF,#6d28d9 55%,#A35BFF);margin-top:10px} :where(html.pf-acad) .ctw .ctcin{position:relative;border-radius:20px;background:#0b0711;background-image:radial-gradient(circle at 100% 0%,rgba(163,91,255,.35),transparent 50%),radial-gradient(rgba(190,160,255,.12) 1px,transparent 1.2px);background-size:auto,20px 20px;padding:18px;overflow:hidden} :where(html.pf-acad) .ctw .cthead{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:18px} :where(html.pf-acad) .ctw .cthead svg{width:40px;height:40px;flex:none} :where(html.pf-acad) .ctw .cthead b{font-size:13px;letter-spacing:.28em;text-transform:uppercase} :where(html.pf-acad) .ctw .cthead small{display:block;font-size:12px;color:#a99fb8;letter-spacing:.16em;text-transform:uppercase;margin-top:3px} :where(html.pf-acad) .ctw .ctno{margin-left:auto;text-align:right;background:none} :where(html.pf-acad) .ctw .ctno i{display:block;font-style:normal;font-size:11px;color:#a99fb8;letter-spacing:.2em} :where(html.pf-acad) .ctw .ctno span{white-space:nowrap;font-family:"Geist Mono",ui-monospace,monospace;font-size:19px;font-weight:700;background:linear-gradient(90deg,#A35BFF,#c4a6ff);-webkit-background-clip:text;background-clip:text;color:transparent} :where(html.pf-acad) .ctw .ctbody{display:grid;grid-template-columns:minmax(0,1fr);gap:20px} :where(html.pf-acad) .ctw .ctbody>*{min-width:0} :where(html.pf-acad) .ctw .ctart{border-radius:16px;overflow:hidden;border:1px solid rgba(163,91,255,.5);box-shadow:0 0 40px rgba(163,91,255,.3);max-width:300px;width:100%;margin:0 auto;aspect-ratio:1} :where(html.pf-acad) .ctw .ctart svg{display:block;width:100%;height:100%} :where(html.pf-acad) .ctw .ctname{font-size:34px;font-weight:800;margin:0;line-height:1.05;overflow-wrap:anywhere} :where(html.pf-acad) .ctw .ctrole{color:#d8c2ff;font-size:16px;margin:6px 0 12px} :where(html.pf-acad) .ctw .ctfacts{margin:0} :where(html.pf-acad) .ctw .ctfacts div{display:grid;grid-template-columns:112px minmax(0,1fr);gap:10px;padding:8px 0;border-bottom:1px solid var(--line);font-size:14px} :where(html.pf-acad) .ctw .ctfacts dt{color:#a99fb8} :where(html.pf-acad) .ctw .ctfacts dd{margin:0;overflow-wrap:anywhere} :where(html.pf-acad) .ctw .ctsha{display:block;position:static;width:auto;font-family:"Geist Mono",ui-monospace,monospace;font-size:12px;line-height:1.5;word-break:break-all;white-space:normal;background:none;padding:0;color:#e6d8ff} :where(html.pf-acad) .ctw .cpill{display:inline-block;font-size:12px;border-radius:999px;padding:4px 10px;border:1px solid rgba(247,147,26,.6);color:#ffd4a3} :where(html.pf-acad) .ctw .cpill.ok{border-color:rgba(47,191,113,.6);color:#9ff0b8} :where(html.pf-acad) .ctw .cset{display:grid;gap:8px;margin-top:12px} :where(html.pf-acad) .ctw .seg{display:flex;flex-wrap:wrap;gap:6px} :where(html.pf-acad) .ctw .seg label{cursor:pointer;position:relative} :where(html.pf-acad) .ctw .seg input{position:absolute;opacity:0;pointer-events:none} :where(html.pf-acad) .ctw .seg span{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:14px;font-weight:600} :where(html.pf-acad) .ctw .seg input:checked+span{background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;border-color:transparent} :where(html.pf-acad) .ctw .cacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px} :where(html.pf-acad) .ctw .agree{display:flex} :where(html.pf-acad) .ctw .sw2{display:inline-block} :where(html.pf-acad) .ctw .ctsha{border:0!important;box-shadow:none!important} @container (min-width:640px){:where(html.pf-acad) .ctw .ctcin{padding:28px 30px} :where(html.pf-acad) .ctw .ctbody{grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:28px} :where(html.pf-acad) .ctw .ctname{font-size:44px} :where(html.pf-acad) .ctw .ctno span{font-size:24px}} :where(html.pf-acad) .wvid{position:relative;margin:10px 0 4px;border-radius:12px;overflow:hidden;background:#000;aspect-ratio:16/9} :where(html.pf-acad) .wvid video{display:block;width:100%;height:100%;object-fit:cover} :where(html.pf-acad) .wvidw{margin:10px 0 4px} :where(html.pf-acad) .wvidw .wvid{margin:0} :where(html.pf-acad) .wbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px} :where(html.pf-acad) .wsnd{background:rgba(10,8,20,.75);color:#fff;border:1px solid rgba(232,184,107,.7);border-radius:999px;padding:8px 14px;font:600 13px/1 inherit;cursor:pointer} :where(html.pf-acad) .wsnd[aria-pressed="true"]{border-color:rgba(255,255,255,.4)} :where(html.pf-acad) .post.pinned{position:relative;border-color:rgba(247,147,26,.45)} :where(html.pf-acad) .pintag{position:absolute;top:12px;right:12px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:#ffd4a3;border:1px solid rgba(247,147,26,.6);border-radius:999px;padding:2px 9px} @media (max-width:820px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(html.pf-acad) .side{background:#100a18!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;z-index:80!important} :where(html.pf-acad) [data-skin="light"] .side{background:#fbf9fe!important} :where(html.pf-acad) .side.open{box-shadow:0 0 0 100vmax rgba(5,3,9,.7)!important} :where(html.pf-acad) .cols{padding-bottom:200px}} @media(max-width:600px){html:where(.pf-acad){--ag-orb:112px!important}} :where(html.pf-acad) .brand{gap:10px;text-decoration:none;color:var(--fg);letter-spacing:0;min-width:0;flex:0 1 auto} :where(html.pf-acad) .brand .bmk{width:34px;height:34px;border-radius:9px;display:block;flex:none;border:1px solid rgba(163,91,255,.35)} :where(html.pf-acad) .brand .bwm{height:17px;width:auto;display:block;flex:none} :where(html.pf-acad) .brand .bwm.ink{display:none} :where(html.pf-acad) [data-skin="light"] .brand .bwm{display:none} :where(html.pf-acad) [data-skin="light"] .brand .bwm.ink{display:block} :where(html.pf-acad) .brand .bdv{width:1px;height:22px;background:var(--line);flex:none} :where(html.pf-acad) .brand .bac{font-family:var(--mono);font-size:10px;letter-spacing:.42em;text-transform:uppercase;color:var(--or2);white-space:nowrap;font-weight:500} :where(html.pf-acad) [data-skin="light"] .brand .bac{color:var(--ort)} :where(html.pf-acad) [data-skin="light"] .bar{background:rgba(22,24,29,.08)} :where(html.pf-acad) .burger{border:0!important;background:none!important;padding:8px!important;margin-left:-6px;color:#fff;line-height:0} :where(html.pf-acad) [data-skin="light"] .burger{color:#16181d} :where(html.pf-acad) .burger svg path{transition:transform .25s ease,opacity .2s ease;transform-origin:12px 12px} :where(html.pf-acad) .burger[aria-expanded="true"] .l1{transform:translateY(5px) rotate(45deg)} :where(html.pf-acad) .burger[aria-expanded="true"] .l2{transform:translateY(-1px) rotate(-45deg)} :where(html.pf-acad) .burger[aria-expanded="true"] .dots{opacity:0} :where(html.pf-acad) .stools{display:none} :where(html.pf-acad) .sp .soon{background:none!important;color:var(--mute)!important;border:1px solid var(--line);font-weight:500;letter-spacing:.04em} @media (max-width:820px), (max-width:1400px) and (hover:none) and (pointer:coarse){html:where(.pf-acad),:where(html.pf-acad) body{height:auto!important} :where(html.pf-acad) body{display:block!important;min-height:100%} :where(html.pf-acad) .shell{display:block!important} :where(html.pf-acad) .main{overflow:visible!important;padding-bottom:40px!important} :where(html.pf-acad) .cols{padding-bottom:150px!important} :where(html.pf-acad) .top{gap:8px!important} :where(html.pf-acad) .top .viewas,:where(html.pf-acad) .top .skin{display:none!important} :where(html.pf-acad) .brand .bmk{width:32px;height:32px} :where(html.pf-acad) .brand .bwm{height:15px} :where(html.pf-acad) .top>.av{display:grid!important;margin-left:auto;width:32px;height:32px} :where(html.pf-acad) .side{position:fixed!important;top:var(--toph,60px)!important;bottom:0!important;left:0!important;width:min(86vw,320px)!important;transform:translateX(-105%);transition:transform .28s cubic-bezier(.22,1,.36,1)!important;padding:12px 12px calc(28px + env(safe-area-inset-bottom,0px))!important;padding-left:max(12px,env(safe-area-inset-left,0px))!important;z-index:80!important;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch; background:linear-gradient(180deg,rgba(11,7,17,.86),rgba(11,7,17,.78))!important;-webkit-backdrop-filter:blur(22px) saturate(140%)!important;backdrop-filter:blur(22px) saturate(140%)!important;border-right:1px solid rgba(163,91,255,.22)!important} :where(html.pf-acad) .side::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(60% 30% at 100% 0%,rgba(110,55,190,.32),transparent 70%),radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.4px);background-size:auto,22px 22px;z-index:-1} :where(html.pf-acad) [data-skin="light"] .side{background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(250,247,255,.84))!important;border-right-color:rgba(122,53,224,.2)!important} :where(html.pf-acad) [data-skin="light"] .side::before{background:radial-gradient(60% 30% at 100% 0%,rgba(163,91,255,.16),transparent 70%)} :where(html.pf-acad) .side.open{transform:none!important;box-shadow:0 0 0 100vmax rgba(5,3,9,.55)!important} html:where(.pf-acad).nav-open .top{z-index:90!important} html:where(.pf-acad).nav-open,html:where(.pf-acad).nav-open body{overflow:hidden!important} html:where(.pf-acad).nav-open .ag-pill{opacity:0!important;pointer-events:none!important} html:where(.pf-acad).sheet-open,html:where(.pf-acad).sheet-open body{overflow:hidden!important} :where(html.pf-acad) .stools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:2px 2px 12px;margin-bottom:6px;border-bottom:1px solid var(--line)} :where(html.pf-acad) .stools .viewas{display:flex!important;flex:1 1 auto;min-width:0;margin:0} :where(html.pf-acad) .stools .viewas span{display:none!important} :where(html.pf-acad) .stools .viewas select{max-width:none!important;flex:1;min-width:0;font-size:14px;padding:7px 8px} :where(html.pf-acad) .stools .tierb{flex:1 1 auto} :where(html.pf-acad) .stools .skin{display:inline-block!important;padding:7px 12px!important;font-size:13px} :where(html.pf-acad) .sp{padding:9px 8px!important;font-size:14.5px!important} :where(html.pf-acad) .side .feedbtn{padding:11px 12px!important} :where(html.pf-acad) .crewgrid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important} :where(html.pf-acad) .crewgrid .pt{height:auto!important;aspect-ratio:3/4;object-position:50% 16%!important} :where(html.pf-acad) .ccard.wide .pt{min-height:0!important;height:auto!important;aspect-ratio:4/5;max-height:440px} :where(html.pf-acad) .argbig{max-height:none!important;aspect-ratio:3/4;object-position:50% 14%!important} :where(html.pf-acad) .bchat{display:grid!important;grid-template-columns:56px minmax(0,1fr);gap:12px!important;align-items:start!important} :where(html.pf-acad) .bchat>.btn{grid-column:1/-1;width:100%}} @media(max-width:600px){:where(html.pf-acad) .ag-pill{--ag-orb:76px;right:10px!important;bottom:calc(10px + env(safe-area-inset-bottom,0px))!important} :where(html.pf-acad) .ag-pill span{display:none!important} :where(html.pf-acad) .ag-pill.scrolling{opacity:.18;transform:translateY(8px) scale(.94)} :where(html.pf-acad) .cols{padding-bottom:110px!important}} @media(max-width:380px){:where(html.pf-acad) .brand .bac{letter-spacing:.3em;font-size:9px} :where(html.pf-acad) .brand .bwm{height:13px}} :where(html.pf-acad) .crewgrid{grid-template-columns:repeat(4,minmax(0,1fr))} @media(max-width:1180px){:where(html.pf-acad) .crewgrid{grid-template-columns:repeat(3,minmax(0,1fr))}} :where(html.pf-acad) .leadband{display:grid;grid-template-columns:150px minmax(0,1fr);gap:18px;align-items:start;border:1px solid rgba(247,147,26,.45);border-left:6px solid #F7931A;border-radius:16px;padding:18px;margin:14px 0;background:radial-gradient(70% 120% at 0% 0%,rgba(124,58,237,.12),transparent 60%),rgba(19,13,29,.6)} :where(html.pf-acad) .leadband .pt{width:150px;aspect-ratio:3/4;height:auto;object-fit:cover;object-position:50% 15%;border-radius:12px;border:1px solid rgba(255,255,255,.12)} :where(html.pf-acad) .ldtag{background:rgba(247,147,26,.18);color:#F7931A;border:1px solid rgba(247,147,26,.45);vertical-align:middle;font-size:11px} :where(html.pf-acad) .ldl{margin:0 0 8px;padding-left:18px;font-size:14px} @media (max-width:560px){:where(html.pf-acad) .leadband{grid-template-columns:96px minmax(0,1fr);gap:12px} :where(html.pf-acad) .leadband .pt{width:96px}} :where(html.pf-acad) .sband{display:grid;gap:14px;border:1px dashed rgba(141,130,171,.55);border-radius:16px;padding:18px;margin:14px 0;background:radial-gradient(70% 120% at 0% 0%,rgba(141,130,171,.12),transparent 60%),rgba(19,13,29,.35)} :where(html.pf-acad) .crewgrid.soon5{grid-template-columns:repeat(5,minmax(0,1fr))} @media(max-width:1180px){:where(html.pf-acad) .crewgrid.soon5{grid-template-columns:repeat(3,minmax(0,1fr))}} @media(max-width:560px){:where(html.pf-acad) .crewgrid.soon5{grid-template-columns:repeat(2,minmax(0,1fr))}} :where(html.pf-acad) .crewgrid{gap:16px} :where(html.pf-acad) .crewgrid .ccard{border-radius:14px} :where(html.pf-acad) .crewgrid .ccard:not(.wide) .pt{height:auto;aspect-ratio:3/4;object-position:50% 14%} @media(max-width:700px){:where(html.pf-acad) .crewgrid.soon5{grid-template-columns:repeat(5,minmax(70vw,1fr))!important;overflow-x:auto}} :where(html.pf-acad) .stl{display:inline-flex;flex-direction:column;gap:3px;padding:4px;border-radius:8px;background:#000;border:1px solid var(--line);flex:none} :where(html.pf-acad) .stl i{width:10px;height:10px;border-radius:50%;background:#2a2430} :where(html.pf-acad) .sth.big .stl{gap:5px;padding:6px} :where(html.pf-acad) .sth.big .stl i{width:16px;height:16px} :where(html.pf-acad) .stl i.on.r{background:#ff5a5a;box-shadow:0 0 8px #ff5a5a} :where(html.pf-acad) .stl i.on.a{background:#F7931A;box-shadow:0 0 8px #F7931A} :where(html.pf-acad) .stl i.on.g{background:#2fbf71;box-shadow:0 0 8px #2fbf71} :where(html.pf-acad) .stl i.on.b{background:#d8c2ff;box-shadow:0 0 8px #d8c2ff} @media(max-width:560px){:where(html.pf-acad) .top:has(.admbtn) .bdv,:where(html.pf-acad) .top:has(.admbtn) .bac{display:none} :where(html.pf-acad) .admbtn{min-height:30px!important;padding:0 11px!important;font-size:12px!important}} :where(html.pf-acad) .admbtn{display:inline-flex;align-items:center;min-height:34px;padding:0 14px;border-radius:999px;font:700 13px var(--body);color:#fff;background:linear-gradient(90deg,#4c1d95,#7c3aed);text-decoration:none;white-space:nowrap} :where(html.pf-acad) .osc{padding:12px 14px} :where(html.pf-acad) .msc{display:block;text-decoration:none;color:inherit} :where(html.pf-acad) .msr{border-top:1px solid var(--line);padding-top:6px;margin-top:6px;font-size:12.5px} :where(html.pf-acad) .msr b{color:var(--or2)} :where(html.pf-acad) .msr.gen{border-left:3px solid #F2D58A;padding-left:8px} :where(html.pf-acad) .msr.gen b{color:#F2D58A} :where(html.pf-acad) .msn{margin-top:8px} :where(html.pf-acad) .msb{height:6px;border-radius:4px;background:var(--line);overflow:hidden;margin-top:3px} :where(html.pf-acad) .msb i{display:block;height:100%;background:linear-gradient(90deg,#A35BFF,#6d28d9)} :where(html.pf-acad) .os4{grid-template-columns:repeat(4,1fr)} :where(html.pf-acad) .osd{margin-top:8px} :where(html.pf-acad) .osr{display:flex;justify-content:space-between;gap:8px;font-size:12px;padding-top:6px;border-top:1px solid var(--line);margin-top:6px} :where(html.pf-acad) .osr span{min-width:0;overflow-wrap:anywhere} :where(html.pf-acad) .osr b{color:var(--or2)} :where(html.pf-acad) .osr2{font-size:10.5px;color:var(--mute)} :where(html.pf-acad) .dkc{display:block;padding:12px 14px;text-decoration:none;color:inherit;border-left:3px solid var(--or2)} :where(html.pf-acad) .dkc:hover{border-color:var(--or2)} :where(html.pf-acad) .dkr{display:flex;gap:14px;margin:8px 0 4px} :where(html.pf-acad) .dkl{display:inline-flex;align-items:center;gap:6px;font-size:18px;font-weight:700} :where(html.pf-acad) .dkl i{width:11px;height:11px;border-radius:50%;display:inline-block} :where(html.pf-acad) .dkb{display:inline-block;margin-top:6px;font-size:12.5px;font-weight:600;color:var(--or2)} :where(html.pf-acad) .osh{display:flex;justify-content:space-between;align-items:baseline;gap:8px} :where(html.pf-acad) .osn{font-size:20px;font-weight:700;color:var(--or2);line-height:1} :where(html.pf-acad) .osn small{font-size:11px;font-weight:500;color:var(--mute)} :where(html.pf-acad) .osgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-top:8px} :where(html.pf-acad) .ost{background:rgba(255,255,255,.04);border-radius:8px;padding:5px 6px;text-align:center;line-height:1.15} :where(html.pf-acad) .ost b{display:block;font-size:14px} :where(html.pf-acad) .ost span{font-size:10px;color:var(--mute)} :where(html.pf-acad) .ost.z{opacity:.45} :where(html.pf-acad) .osl{margin:8px 0 0;font-size:11px;line-height:1.45;color:var(--mute)} :where(html.pf-acad) .osw{color:#ff7a7a} :where(html.pf-acad) .sth{display:flex;gap:12px;align-items:center} :where(html.pf-acad) .stc{cursor:pointer} :where(html.pf-acad) .stdots{display:flex;flex-wrap:wrap;gap:4px 12px;margin-top:10px;font-size:12px;color:var(--mute)} :where(html.pf-acad) .stdots i,:where(html.pf-acad) .sd{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:5px;vertical-align:1px} :where(html.pf-acad) .sd{width:10px;height:10px;margin-right:8px} :where(html.pf-acad) .stban{display:flex;gap:12px;align-items:center;padding:10px 14px;margin:0 0 12px;border-radius:14px;border:1px solid var(--line);background:var(--card,rgba(255,255,255,.04));font-size:14px} :where(html.pf-acad) .stban.b{border-left:3px solid #d8c2ff} :where(html.pf-acad) .stban.a{border-left:3px solid #F7931A} :where(html.pf-acad) .stban.r{border-left:3px solid #ff5a5a} :where(html.pf-acad) .stban .lnk,:where(html.pf-acad) .lnk{background:none;border:0;color:#c9a7ff;text-decoration:underline;cursor:pointer;font:inherit;padding:0} :where(html.pf-acad) .strow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 0;border-top:1px solid var(--line)} :where(html.pf-acad) .card>b+.strow{margin-top:8px} :where(html.pf-acad) .stp{font-size:12px;padding:2px 9px;border-radius:99px;border:1px solid currentColor;white-space:nowrap} :where(html.pf-acad) .stdt{display:grid;grid-template-columns:1fr 1fr;gap:10px} :where(html.pf-acad) .stck{display:flex;flex-wrap:wrap;gap:6px 16px;margin:8px 0} :where(html.pf-acad) .stck label{display:flex;gap:6px;align-items:center;font-size:14px} @media(max-width:640px){:where(html.pf-acad) .stdt{grid-template-columns:1fr} :where(html.pf-acad) .strow{flex-direction:column;align-items:flex-start}} :where(html.pf-acad) .mustdo{border:2px solid #F7931A!important;box-shadow:0 0 0 4px rgba(247,147,26,.18),0 0 26px rgba(247,147,26,.35);animation:mustp 1.6s ease-in-out infinite} @keyframes mustp{50%{box-shadow:0 0 0 7px rgba(247,147,26,.08),0 0 34px rgba(247,147,26,.5)}} @media (prefers-reduced-motion:reduce){:where(html.pf-acad) .mustdo{animation:none}} :where(html.pf-acad) #acg{position:fixed;inset:0;z-index:2147482000;background:rgba(8,5,14,.86);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;padding:calc(16px + env(safe-area-inset-top,0px)) 16px calc(16px + env(safe-area-inset-bottom,0px))} :where(html.pf-acad) #acg .box{width:min(620px,100%);max-height:100%;overflow:auto;background:#130d1d;border:1px solid rgba(163,91,255,.55);border-radius:16px;box-shadow:0 30px 80px rgba(0,0,0,.6);padding:22px;display:grid;gap:12px;color:#f3eaff} :where(html.pf-acad) #acg .acgbar{display:flex!important;gap:6px;margin:0} :where(html.pf-acad) #acg .acgbar span{display:block;flex:1;height:6px;border-radius:6px;background:rgba(255,255,255,.14)} :where(html.pf-acad) #acg .acgbar span.on{background:linear-gradient(90deg,#A35BFF,#6d28d9)} :where(html.pf-acad) #acg .kick{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#F7931A} :where(html.pf-acad) #acg h2{margin:0;font-size:24px;line-height:1.2} :where(html.pf-acad) #acg h2 em{font-style:normal;color:#A35BFF} :where(html.pf-acad) #acg p{margin:0;color:#d9cdf0;font-size:15px;line-height:1.5} :where(html.pf-acad) #acg ul{margin:0;padding-left:20px;color:#e6dcf7;font-size:15px;line-height:1.5} :where(html.pf-acad) #acg .full{max-height:150px;overflow:auto;border:1px solid rgba(255,255,255,.1);border-radius:10px;padding:10px;font-size:13px;color:#b9addb} :where(html.pf-acad) #acg .full p{font-size:13px;color:#b9addb;margin:0 0 6px} :where(html.pf-acad) #acg label{display:flex;gap:10px;align-items:flex-start;font-size:15px;cursor:pointer;padding:10px;border:1px solid rgba(163,91,255,.4);border-radius:10px} :where(html.pf-acad) #acg label input{width:22px;height:22px;accent-color:#A35BFF;flex:none;margin-top:1px} :where(html.pf-acad) #acg .row{display:flex;gap:10px;flex-wrap:wrap;align-items:center} :where(html.pf-acad) #acg button{min-height:48px;border-radius:999px;padding:0 22px;font:inherit;font-size:15px;font-weight:700;cursor:pointer;border:1px solid rgba(163,91,255,.6);background:#1c1229;color:#f3eaff} :where(html.pf-acad) #acg button.go{background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;border-color:transparent;flex:1} :where(html.pf-acad) #acg button:disabled{opacity:.45;cursor:default} :where(html.pf-acad) #acg .sm{font-size:12px;color:#8d82ab} :where(html.pf-acad) #acg .err{color:#ffb4b4;font-size:13px;min-height:16px} :where(html.pf-acad) .crcover{display:flex;gap:12px;align-items:center} :where(html.pf-acad) .crbar{height:8px;border-radius:6px;background:rgba(127,127,127,.2);margin:12px 0 4px;overflow:hidden} :where(html.pf-acad) .crbar>div{height:8px;background:linear-gradient(90deg,#4c1d95,#7c3aed)} :where(html.pf-acad) .crout{margin:6px 0 10px;padding-left:18px;font-size:13.5px} :where(html.pf-acad) .crout li{margin:3px 0} :where(html.pf-acad) .crles{display:flex;align-items:center;gap:10px;width:100%;text-align:left;border:0;border-top:1px solid var(--line);background:none;color:inherit;cursor:pointer;padding:10px 4px} :where(html.pf-acad) .crnum{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--mute);display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;line-height:1;flex:none} :where(html.pf-acad) .crnum.on{background:var(--ok);border-color:var(--ok);color:#0b0711} :where(html.pf-acad) .crlt{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1} :where(html.pf-acad) .crlt b{font-size:14px;font-weight:600} :where(html.pf-acad) .crlt small{color:var(--mute);font-size:11.5px} :where(html.pf-acad) .crgo{margin-left:auto;color:var(--mute);font-size:18px} :where(html.pf-acad) .crdots{display:flex;gap:5px;margin-top:12px} :where(html.pf-acad) .crdots span,:where(html.pf-acad) .crdots button{height:4px;flex:1;border-radius:3px;background:rgba(127,127,127,.25);border:0;padding:0;cursor:pointer;min-width:0} :where(html.pf-acad) .crdots button{height:8px;background-clip:content-box;padding:2px 0} :where(html.pf-acad) .crdots .seen{background:rgba(247,147,26,.45)} :where(html.pf-acad) .crdots .on{background:var(--or2)} :where(html.pf-acad) .crslide{font-size:15.5px;min-height:240px} :where(html.pf-acad) .crslide h3{margin-top:4px} :where(html.pf-acad) .crnav{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap} :where(html.pf-acad) .crsteps{list-style:none;counter-reset:s;padding:0;margin:10px 0} :where(html.pf-acad) .crsteps li{counter-increment:s;position:relative;padding:10px 10px 10px 46px;margin:6px 0;border:1px solid var(--line);border-radius:12px} :where(html.pf-acad) .crsteps li:before{content:counter(s);position:absolute;left:10px;top:9px;width:26px;height:26px;border-radius:50%;background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;font-size:13px} :where(html.pf-acad) .crcall{border-radius:12px;padding:10px 12px;margin:10px 0;border:1px solid var(--line)} :where(html.pf-acad) .crcall p{margin:4px 0 0} :where(html.pf-acad) .crtip{border-color:rgba(76,196,127,.5);background:rgba(76,196,127,.08)} :where(html.pf-acad) .crwarn{border-color:rgba(229,72,77,.5);background:rgba(229,72,77,.08)} :where(html.pf-acad) .crcmp{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin:10px 0;font-size:13.5px} :where(html.pf-acad) .crcmp>div{background:var(--bg2,#14101c);padding:8px 10px} :where(html.pf-acad) .crcmph{font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase} :where(html.pf-acad) .crcmp .ok{color:var(--ok)} :where(html.pf-acad) .crflow{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:12px 0} :where(html.pf-acad) .crflow>div{border:1px solid rgba(247,147,26,.5);border-radius:10px;padding:8px 10px;font-size:13px;flex:1 1 120px;text-align:center} :where(html.pf-acad) .crarr{color:var(--or2);font-weight:700} :where(html.pf-acad) .crscore,:where(html.pf-acad) .cract,:where(html.pf-acad) .crws,:where(html.pf-acad) .crquiz,:where(html.pf-acad) .cragent{border:1px solid var(--line);border-radius:14px;padding:12px;margin:12px 0} :where(html.pf-acad) .crgauge{display:flex;flex-direction:column;align-items:center;margin-bottom:6px} :where(html.pf-acad) .crq{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-top:1px solid var(--line);font-size:13.5px} :where(html.pf-acad) .cryn{display:flex;gap:4px;flex:none} :where(html.pf-acad) .cryn button{border:1px solid var(--line);background:none;color:inherit;border-radius:999px;padding:5px 11px;font-size:12px;cursor:pointer} :where(html.pf-acad) .cryn button.on[data-v="1"]{background:var(--ok);color:#0b0711;border-color:var(--ok)} :where(html.pf-acad) .cryn button.on[data-v="0"]{background:#E5484D;color:#fff;border-color:#E5484D} :where(html.pf-acad) .cract label{display:flex;gap:10px;align-items:flex-start;padding:8px 0;border-top:1px solid var(--line);cursor:pointer;font-size:14px} :where(html.pf-acad) .cract input{width:20px;height:20px;margin-top:1px;accent-color:#4CC47F;flex:none} :where(html.pf-acad) .crws label{display:flex;flex-direction:column;gap:4px;margin:8px 0;font-size:13.5px} :where(html.pf-acad) .crws input{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;padding:8px;font:inherit;font-size:14px} :where(html.pf-acad) .crws input::placeholder,:where(html.pf-acad) .crws textarea::placeholder{color:var(--mute);opacity:.75} :where(html.pf-acad) .crws textarea{width:100%;box-sizing:border-box;border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;padding:8px;font:inherit;font-size:14px} :where(html.pf-acad) .crqo{display:block;width:100%;text-align:left;border:1px solid var(--line);background:none;color:inherit;border-radius:10px;padding:9px 11px;margin:6px 0;cursor:pointer;font-size:14px} :where(html.pf-acad) .crqo.right{border-color:var(--ok);background:rgba(76,196,127,.12)} :where(html.pf-acad) .crqo.right:after{content:" ✓ Right"} :where(html.pf-acad) .crqo.wrong{border-color:#E5484D;background:rgba(229,72,77,.1)} :where(html.pf-acad) .crqo.wrong:after{content:" ✕ Not quite"} :where(html.pf-acad) .cragent code{display:block;margin-top:8px;padding:9px 11px;border-radius:10px;background:rgba(127,127,127,.14);font-size:13.5px;white-space:pre-wrap} :where(html.pf-acad) .crwho{font-weight:700;margin-top:4px} :where(html.pf-acad) .crstats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px} :where(html.pf-acad) .crstats div{border:1px solid var(--line);border-radius:12px;padding:10px;text-align:center} :where(html.pf-acad) .crstats b{display:block;font-size:22px} :where(html.pf-acad) .crstats span{font-size:11.5px;color:var(--mute)} :where(html.pf-acad) .crbadges{display:grid;gap:8px;margin-top:10px} :where(html.pf-acad) .crbadge{display:flex;gap:12px;align-items:center;border:1px solid rgba(247,147,26,.45);border-radius:14px;padding:10px;background:linear-gradient(135deg,rgba(109,40,217,.08),rgba(163,91,255,.08))} :where(html.pf-acad) .crbadge small{display:block;font-size:11.5px} :where(html.pf-acad) .crmedal{position:relative;flex:none} :where(html.pf-acad) .crmedal span{position:absolute;right:-4px;bottom:-4px;width:20px;height:20px;border-radius:50%;background:var(--ok);color:#0b0711;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center} :where(html.pf-acad) .crbadge{width:100%;text-align:left;color:inherit;cursor:pointer;font:inherit} :where(html.pf-acad) .crcert{border-color:rgba(247,147,26,.5)} :where(html.pf-acad) .crcerthead{display:flex;justify-content:space-between;align-items:baseline;margin:14px 0 10px;gap:8px} :where(html.pf-acad) .crcerthead strong{font-family:var(--mono);font-size:15px;white-space:nowrap} :where(html.pf-acad) .crcertbody{display:grid;grid-template-columns:96px 1fr;gap:14px;align-items:start} @media(max-width:480px){:where(html.pf-acad) .crcertbody{grid-template-columns:1fr}} :where(html.pf-acad) .crfacts{margin:0;display:grid;gap:6px} :where(html.pf-acad) .crfacts div{display:grid;grid-template-columns:90px 1fr;gap:8px;font-size:13px;border-top:1px solid var(--line);padding-top:6px} :where(html.pf-acad) .crfacts dt{color:var(--mute)} :where(html.pf-acad) .crfacts dd{margin:0} :where(html.pf-acad) .crqrrow{display:flex;gap:12px;align-items:center;margin-top:12px;padding:10px;border:1px dashed var(--line);border-radius:12px} :where(html.pf-acad) #crqr{background:#fff;padding:6px;border-radius:8px;flex:none;width:auto;height:auto;line-height:0;box-sizing:content-box} :where(html.pf-acad) #crqr img,:where(html.pf-acad) #crqr canvas{display:block;width:100px!important;height:100px!important} :where(html.pf-acad) .crbackbtn{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--or2);background:rgba(247,147,26,.14);color:var(--fg);border-radius:999px;padding:9px 16px 9px 10px;font-weight:700;font-size:14px;cursor:pointer} :where(html.pf-acad) .crbackbtn span{width:24px;height:24px;border-radius:50%;background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:14px} :where(html.pf-acad) .crbackbtn:hover{background:rgba(247,147,26,.24)} :where(html.pf-acad) .crland{display:block;width:100%;height:1400px;border:0;border-radius:16px;background:transparent} :where(html.pf-acad) .crask{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:12px} :where(html.pf-acad) .crask img{border-radius:50%;flex:none} :where(html.pf-acad) .crask .sm{flex:1;min-width:160px} :where(html.pf-acad) .crask .btn{} :where(html.pf-acad) .crcard{position:relative;padding-bottom:0!important;overflow:hidden} :where(html.pf-acad) .crfoot{display:block;margin:auto -14px 0;padding:9px 14px;border-top:1px solid var(--line,rgba(127,127,127,.2));font-size:12.5px;font-weight:700;color:var(--mute,#9a8fae);letter-spacing:.02em} :where(html.pf-acad) .crfoot.ok{background:rgba(76,196,127,.16);color:#4CC47F;border-top-color:rgba(76,196,127,.45)} :where(html.pf-acad) .crfoot.go{background:rgba(247,147,26,.12);color:var(--or2);border-top-color:rgba(247,147,26,.4)} :where(html.pf-acad) .crisdone{border:1.5px solid #4CC47F!important;box-shadow:0 0 0 3px rgba(76,196,127,.12)} :where(html.pf-acad) .crdonebar{display:flex;align-items:center;gap:12px;margin:12px 0;padding:12px 14px;border:1.5px solid #4CC47F;border-radius:14px;background:rgba(76,196,127,.12)} :where(html.pf-acad) .crdonebar>span{width:30px;height:30px;border-radius:50%;background:#4CC47F;color:#0b0711;font-weight:800;display:flex;align-items:center;justify-content:center;flex:none} :where(html.pf-acad) .crdonebar b{display:block;color:#4CC47F} :where(html.pf-acad) .crdonebar small{display:block;opacity:.8} :where(html.pf-acad) .crbtnrow{display:flex;gap:8px;flex-wrap:wrap} :where(html.pf-acad) .crgo{padding:9px 10px 9px 16px} :where(html.pf-acad) .gpart{margin:16px 2px 6px} :where(html.pf-acad) .crcard .crcover{position:relative;padding-right:64px} :where(html.pf-acad) .crtag{position:absolute;top:0;right:0;border-radius:999px;padding:3px 10px;font-size:12px;font-weight:800;letter-spacing:.02em} :where(html.pf-acad) .crtag.free{background:rgba(76,196,127,.16);color:#4CC47F;border:1px solid rgba(76,196,127,.5)} :where(html.pf-acad) .crtag.paid{background:rgba(247,147,26,.14);color:var(--or2);border:1px solid rgba(247,147,26,.5)} :where(html.pf-acad) .crdivide{display:flex;align-items:center;gap:12px;margin:22px 0 6px} :where(html.pf-acad) .crdivide:before,:where(html.pf-acad) .crdivide:after{content:"";flex:1;height:2px;background:linear-gradient(90deg,transparent,#7c3aed,transparent)} :where(html.pf-acad) .crdivide span{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--or2)} :where(html.pf-acad) .crmcbox{border-color:rgba(247,147,26,.5);background:linear-gradient(135deg,rgba(109,40,217,.07),rgba(163,91,255,.07))} :where(html.pf-acad) .crslide{font-size:16px;line-height:1.5} :where(html.pf-acad) .cric{width:22px;height:22px;flex:none;color:var(--or2)} :where(html.pf-acad) .crpres{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:center;margin:4px 0 14px} :where(html.pf-acad) .crpface{width:92px;height:92px;border-radius:50%;object-fit:cover;border:3px solid var(--or2);box-shadow:0 0 0 6px rgba(247,147,26,.12),0 0 28px rgba(163,91,255,.35);animation:crglow 3.2s ease-in-out infinite} @keyframes crglow{50%{box-shadow:0 0 0 9px rgba(247,147,26,.06),0 0 38px rgba(163,91,255,.5)}} :where(html.pf-acad) .crpvid{width:100%;max-width:360px;border-radius:14px;grid-column:1/-1} :where(html.pf-acad) .crpsay{position:relative;background:var(--card2);border:1px solid var(--line);border-radius:16px;padding:10px 14px} :where(html.pf-acad) .crpsay:before{content:"";position:absolute;left:-7px;top:24px;width:12px;height:12px;background:var(--card2);border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)} :where(html.pf-acad) .crpsay p{margin:4px 0} :where(html.pf-acad) .crpsay i{font-style:normal;font-size:10.5px;border:1px solid var(--line);border-radius:999px;padding:1px 7px;margin-left:6px;color:var(--mute);letter-spacing:0;text-transform:none} @media(max-width:520px){:where(html.pf-acad) .crpres{grid-template-columns:1fr;justify-items:center;text-align:center} :where(html.pf-acad) .crpsay:before{left:50%;top:-7px;transform:translateX(-50%) rotate(135deg)}} :where(html.pf-acad) .crfig{margin:10px 0;text-align:center} :where(html.pf-acad) .crfig svg{width:100%;height:auto;max-height:340px;display:block;margin:0 auto} :where(html.pf-acad) .crfig img{max-width:100%;border-radius:12px} :where(html.pf-acad) .crfig figcaption{font-size:12.5px;color:var(--mute);margin-top:6px} :where(html.pf-acad) .crside{display:grid;grid-template-columns:1.15fr 1fr;gap:16px;align-items:center;margin:10px 0} :where(html.pf-acad) .crside .crfig{margin:0} @media(max-width:640px){:where(html.pf-acad) .crside{grid-template-columns:1fr}} :where(html.pf-acad) .crpts{list-style:none;padding:0;margin:8px 0;display:grid;gap:8px} :where(html.pf-acad) .crpts li{display:flex;gap:10px;align-items:flex-start;padding:9px 11px;border:1px solid var(--line);border-radius:12px;background:var(--card2)} :where(html.pf-acad) .crpts li .cric{margin-top:1px} :where(html.pf-acad) .crhint{font-size:13px;color:var(--mute);margin:0 0 8px} :where(html.pf-acad) .crrevg{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px} :where(html.pf-acad) .crcard2{position:relative;min-height:128px;border:0;padding:0;background:none;color:inherit;font:inherit;cursor:pointer;perspective:800px;text-align:left} :where(html.pf-acad) .crcard2>span{position:absolute;inset:0;border-radius:14px;padding:12px;display:flex;flex-direction:column;gap:6px;backface-visibility:hidden;transition:transform .5s cubic-bezier(.2,.8,.2,1);border:1px solid var(--line)} :where(html.pf-acad) .crf{background:linear-gradient(150deg,var(--card2),var(--card));justify-content:center} :where(html.pf-acad) .crf b{font-size:14.5px} :where(html.pf-acad) .crf small{color:var(--mute);font-size:11px;margin-top:auto} :where(html.pf-acad) .crn{position:absolute;top:8px;right:10px;font-family:var(--mono);font-size:11px;color:var(--mute)} :where(html.pf-acad) .crb{transform:rotateY(180deg);background:linear-gradient(150deg,rgba(109,40,217,.16),rgba(163,91,255,.16));border-color:rgba(247,147,26,.5)!important;font-size:13px;overflow:auto} :where(html.pf-acad) .crb b{font-size:13px;color:var(--or2)} :where(html.pf-acad) .crb em{font-style:normal;font-size:12px;color:var(--mute)} :where(html.pf-acad) .crcard2.on .crf{transform:rotateY(-180deg)} :where(html.pf-acad) .crcard2.on .crb{transform:rotateY(0)} :where(html.pf-acad) .crcard2[data-seen] .crn{color:var(--ok)} :where(html.pf-acad) .crcard2[data-seen] .crn:after{content:" ✓"} :where(html.pf-acad) .crrevc{display:block;margin-top:8px} :where(html.pf-acad) .crrevc.ok{color:var(--ok);font-weight:700} :where(html.pf-acad) .crask{border:1px dashed var(--line);border-radius:12px;padding:8px 12px;margin-bottom:8px} :where(html.pf-acad) .crask p{margin:2px 0 0;font-family:var(--mono);font-size:13.5px} :where(html.pf-acad) .crtog{position:relative;display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:999px;padding:3px;margin:0 0 8px;background:var(--card2)} :where(html.pf-acad) .crtog button{position:relative;z-index:1;border:0;background:none;color:var(--mute);font:inherit;font-size:13px;font-weight:700;padding:8px 6px;border-radius:999px;cursor:pointer;transition:color .3s} :where(html.pf-acad) .crtog button.on{color:#16101c} :where(html.pf-acad) .crtogk{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:999px;background:#E5484D;transition:transform .35s cubic-bezier(.2,.8,.2,1),background .35s} :where(html.pf-acad) .crsl[data-on="b"] .crtogk{transform:translateX(100%);background:var(--ok)} :where(html.pf-acad) .crsl[data-on="a"] .crtog button.on{color:#fff} :where(html.pf-acad) .crslbox{display:grid;border-radius:14px;overflow:hidden;border:1px solid var(--line)} :where(html.pf-acad) .crslp{grid-area:1/1;padding:40px 14px 16px;font-size:15px;transition:opacity .45s ease,transform .45s ease} :where(html.pf-acad) .crslp p{margin:0} :where(html.pf-acad) .crslb{background:var(--card2);color:var(--mute)} :where(html.pf-acad) .crsla{background:linear-gradient(150deg,rgba(76,196,127,.16),var(--card2) 65%);color:var(--fg);opacity:0;transform:translateY(8px)} :where(html.pf-acad) .crsl[data-on="b"] .crslb{opacity:0;transform:translateY(-8px)} :where(html.pf-acad) .crsl[data-on="b"] .crsla{opacity:1;transform:none} :where(html.pf-acad) .crtag2{position:absolute;top:12px;left:14px;font-size:11px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:3px 9px} :where(html.pf-acad) .crslp{position:relative} :where(html.pf-acad) .crtag2.bad{background:rgba(229,72,77,.15);color:#E5484D} :where(html.pf-acad) .crtag2.good{background:rgba(76,196,127,.16);color:var(--ok)} :where(html.pf-acad) .crslh{display:block;margin-top:6px} :where(html.pf-acad) .crsl[data-seen] .crslh{visibility:hidden} :where(html.pf-acad) .crslide .crpts{margin-left:0;padding-left:0} :where(html.pf-acad) .crpsay{text-align:left} :where(html.pf-acad) .crcard2{display:grid;min-height:118px} :where(html.pf-acad) .crcard2>span{position:relative;inset:auto;grid-area:1/1} :where(html.pf-acad) .crsort{border:1px solid var(--line);border-radius:14px;padding:12px;margin:12px 0} :where(html.pf-acad) .crsorth{display:flex;justify-content:space-between;font-size:11.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px} :where(html.pf-acad) .crsorth .ok{color:var(--ok)} :where(html.pf-acad) .crsorth .no{color:#E5484D} :where(html.pf-acad) .crsorti{display:grid;grid-template-columns:1fr auto;gap:6px 10px;align-items:center;padding:9px 0;border-top:1px solid var(--line);font-size:14px} :where(html.pf-acad) .crsortb{display:flex;gap:5px} :where(html.pf-acad) .crsortb button{border:1px solid var(--line);background:none;color:inherit;border-radius:999px;padding:6px 11px;font-size:12px;cursor:pointer;white-space:nowrap} :where(html.pf-acad) .crsorti.right .crsortt:before{content:"✓ ";color:var(--ok);font-weight:800} :where(html.pf-acad) .crsorti.wrong .crsortt:before{content:"✕ ";color:#E5484D;font-weight:800} :where(html.pf-acad) .crsorti[data-done] .crsortb button{opacity:.45;cursor:default} :where(html.pf-acad) .crsorti[data-done] .crsortb button.pick{opacity:1} :where(html.pf-acad) .crsorti.right button.pick{background:var(--ok);border-color:var(--ok);color:#0b0711} :where(html.pf-acad) .crsorti.wrong button.pick{background:#E5484D;border-color:#E5484D;color:#fff} :where(html.pf-acad) .crwhy{grid-column:1/-1;display:none;color:var(--mute);font-size:12.5px} :where(html.pf-acad) .crsorti[data-done] .crwhy{display:block} :where(html.pf-acad) .crsorts{margin-top:8px;padding:8px 10px;border-radius:10px;background:var(--card2);font-size:13.5px} :where(html.pf-acad) .crsorts.ok{background:rgba(76,196,127,.14);color:var(--ok)} @media(max-width:520px){:where(html.pf-acad) .crsorti{grid-template-columns:1fr}} :where(html.pf-acad) .crbuild{border:1px solid rgba(247,147,26,.5);border-radius:14px;padding:12px;margin:12px 0;background:linear-gradient(150deg,rgba(124,58,237,.06),transparent 60%)} :where(html.pf-acad) .crbgrid{display:grid;grid-template-columns:1fr 1.1fr;gap:14px;margin-top:8px} @media(max-width:640px){:where(html.pf-acad) .crbgrid{grid-template-columns:1fr}} :where(html.pf-acad) .crbin label{display:flex;flex-direction:column;gap:4px;margin:0 0 8px;font-size:13px} :where(html.pf-acad) .crbin input{border:1px solid var(--line);border-radius:10px;background:transparent;color:inherit;padding:8px;font:inherit;font-size:14px} :where(html.pf-acad) .crbin input::placeholder{color:var(--mute);opacity:.75} :where(html.pf-acad) .crpost{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--card);margin:6px 0} :where(html.pf-acad) .crposth{display:flex;gap:9px;align-items:center;margin-bottom:8px} :where(html.pf-acad) .crposth small{display:block;color:var(--mute);font-size:11px} :where(html.pf-acad) .crpav{width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--violet),#6d28d9);color:#16101c;font-weight:800;display:flex;align-items:center;justify-content:center} :where(html.pf-acad) .crpost p{margin:0;font-size:14px;white-space:pre-line} :where(html.pf-acad) .crpost mark{background:rgba(247,147,26,.2);color:inherit;border-radius:4px;padding:0 2px} :where(html.pf-acad) .crshotw{position:relative;border-radius:12px;overflow:hidden;border:1px solid var(--line)} :where(html.pf-acad) .crshotw img{display:block;width:100%} :where(html.pf-acad) .crhot{position:absolute;transform:translate(-50%,-50%);width:28px;height:28px;border-radius:50%;border:2px solid #fff;background:var(--or2);color:#16101c;font-weight:800;font-size:13px;cursor:pointer;box-shadow:0 0 0 0 rgba(247,147,26,.7);animation:crping 2s infinite} :where(html.pf-acad) .crhot.on{background:var(--violet);color:#fff} @keyframes crping{70%{box-shadow:0 0 0 12px rgba(247,147,26,0)}} :where(html.pf-acad) .crhotl{margin:10px 0 0;padding-left:20px;font-size:13.5px} :where(html.pf-acad) .crhotl li{padding:3px 0} :where(html.pf-acad) .crhotl li.on{color:var(--or2);font-weight:700} :where(html.pf-acad) .crrecap{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:8px;margin:12px 0} :where(html.pf-acad) .crrc{border:1px solid var(--line);border-radius:14px;padding:12px;background:var(--card2)} :where(html.pf-acad) .crrc b{display:block;margin:6px 0 4px} :where(html.pf-acad) .crrc ul{margin:0;padding-left:18px;font-size:13.5px} :where(html.pf-acad) .crrc li{margin:3px 0} :where(html.pf-acad) .crrc-built{border-color:rgba(76,196,127,.5)} :where(html.pf-acad) .crrc-built .cric{color:var(--ok)} :where(html.pf-acad) .crrc-next{border-color:rgba(163,91,255,.5)} :where(html.pf-acad) .crrc-next .cric{color:var(--violet)} :where(html.pf-acad) .craud{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--card);color:inherit;border-radius:999px;padding:6px 14px 6px 6px;font-size:13px;font-weight:600;cursor:pointer;margin-top:6px} :where(html.pf-acad) .craudi{width:26px;height:26px;border-radius:50%;background:linear-gradient(90deg,#4c1d95,#7c3aed);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:11px} :where(html.pf-acad) .craud.on{border-color:var(--or2)} :where(html.pf-acad) .crfig svg .dr{stroke-dasharray:var(--len,600);stroke-dashoffset:var(--len,600)} :where(html.pf-acad) .crfig svg.go .dr{animation:crdraw 1.4s ease forwards;animation-delay:var(--d,0s)} :where(html.pf-acad) .crfig svg .fi{opacity:0} :where(html.pf-acad) .crfig svg.go .fi{animation:crfade .6s ease forwards;animation-delay:var(--d,0s)} :where(html.pf-acad) .crfig svg .pulse{animation:crpulse 2.4s ease-in-out infinite;transform-origin:center;transform-box:fill-box} :where(html.pf-acad) .crfig svg .flowdot{offset-rotate:0deg} @keyframes crdraw{to{stroke-dashoffset:0}} @keyframes crfade{to{opacity:1}} @keyframes crpulse{50%{transform:scale(1.06)}} @media (prefers-reduced-motion:reduce){:where(html.pf-acad) .crfig svg .dr,:where(html.pf-acad) .crfig svg .fi{animation:none!important;opacity:1;stroke-dashoffset:0} :where(html.pf-acad) .crpface,:where(html.pf-acad) .crhot,:where(html.pf-acad) .crfig svg .pulse{animation:none}} /* ==================== v13h APP SIGN-IN PAGE (was in console/signin.php) ==================== */ html:where(.pf-sgn){-webkit-font-smoothing:antialiased} html:where(.pf-sgn),:where(html.pf-sgn) *{box-sizing:border-box} :where(html.pf-sgn) body{margin:0;min-height:100dvh;display:grid;place-items:center;padding:24px 16px calc(24px + env(safe-area-inset-bottom));background:radial-gradient(110% 80% at 50% 0%,#2a1650,#0b0711 70%);color:#f3eaff;font:15px/1.55 Geist,system-ui,sans-serif} :where(html.pf-sgn) .c{width:100%;max-width:400px;background:#130d1d;border:1px solid #2a1f3d;border-radius:10px;padding:28px 24px;box-shadow:0 20px 60px rgba(0,0,0,.45)} :where(html.pf-sgn) .hd{display:flex;align-items:center;gap:12px;margin-bottom:18px} :where(html.pf-sgn) .hd img{width:44px;height:44px;border-radius:11px} :where(html.pf-sgn) .hd b{display:block;font:700 19px Poppins,Geist,system-ui,sans-serif} :where(html.pf-sgn) .hd small{color:#a99cc8;font-size:13px} :where(html.pf-sgn) .gb{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:48px;border-radius:10px;border:1px solid #dadce0;background:#fff;color:#1f1f1f;font:600 15px Geist,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;text-decoration:none;transition:border-color .15s} :where(html.pf-sgn) .gb:hover{border-color:#c4a8ff} :where(html.pf-sgn) .or{display:flex;align-items:center;gap:10px;color:#a99cc8;font-size:12.5px;margin:18px 0} :where(html.pf-sgn) .or::before,:where(html.pf-sgn) .or::after{content:"";flex:1;height:1px;background:#2a1f3d} :where(html.pf-sgn) label{display:block;font-size:13px;color:#cbbde6;margin:0 0 6px} :where(html.pf-sgn) input[type=email],:where(html.pf-sgn) input[inputmode=numeric]{width:100%;min-height:48px;border-radius:10px;border:1px solid #2a1f3d;background:#0f0a18;color:#f3eaff;padding:0 14px;font:16px Geist,system-ui,sans-serif;outline:none;transition:border-color .15s} :where(html.pf-sgn) input:focus{border-color:#8b5cf6} :where(html.pf-sgn) .btn{display:block;width:100%;min-height:48px;margin-top:12px;border-radius:10px;border:1px solid transparent;background:#8b5cf6;color:#fff;font:600 15px Geist,system-ui,sans-serif;cursor:pointer;transition:border-color .15s} :where(html.pf-sgn) .btn:hover,:where(html.pf-sgn) .btn:focus-visible{border-color:#c4a8ff} :where(html.pf-sgn) .btn:disabled{opacity:.6;cursor:default} :where(html.pf-sgn) .lk{background:none;border:1px solid transparent;color:#c4a8ff;font:500 13.5px Geist,system-ui,sans-serif;cursor:pointer;padding:6px 0;margin-top:8px;border-radius:10px} :where(html.pf-sgn) .lk:hover{text-decoration:underline} :where(html.pf-sgn) .tk{display:flex;gap:10px;align-items:flex-start;font-size:13.5px;color:#cbbde6;margin:12px 0 0} :where(html.pf-sgn) .tk input{width:18px;height:18px;margin-top:2px;accent-color:#8b5cf6} :where(html.pf-sgn) .tk a{color:#F7931A} :where(html.pf-sgn) .er{color:#ffb36b;font-size:13.5px;margin:12px 0 0} :where(html.pf-sgn) .ft{color:#a99cc8;font-size:12.5px;margin:18px 0 0;text-align:center} :where(html.pf-sgn) .ft a{color:#c4a8ff} /* ===== v13i START (core admin dark, shared counts) ===== */ /* the admins' and the course's footer (policies, company line): at the bottom of the left column when the menu is short, pushed down by the menu when it is long. Not pinned. The App's double divider above it: the line, a 10px gap, the footer's own line */ @media (min-width:861px) and (hover:hover), (min-width:1401px){html:is(.pf-adm,.pf-ply) #side:has(>.lfoot){display:flex!important;flex-direction:column!important}html:is(.pf-adm,.pf-ply) #side:has(>.lfoot)>*{flex-shrink:0}html:is(.pf-adm,.pf-ply) #side>.lfoot{margin-top:auto!important}} html:is(.pf-adm,.pf-ply) #side>.lfoot{padding-top:0!important;border-top:1px solid #2a1f3d!important} html:is(.pf-adm,.pf-ply) #side>.lfoot:before{content:"";display:block;margin:10px -14px 12px;border-top:1px solid rgba(139,92,246,.18)} html:is(.pf-adm,.pf-ply) #side>.nlpnl:has(+.lfoot){border-bottom:0!important} html:is(.pf-adm,.pf-ply) #side>.lfoot :is(p,span,small){color:#8f84ab!important;font-size:11px!important} html.pf-core[data-skin="light"] #side>.lfoot{color:#8f84ab}html.pf-core[data-skin="light"] #side>.lfoot a{color:#c9b8ec} /* admins: a page opens in place. No slide of the centre panel or the Overview when a page loads or the menu is clicked */ html.pf-adm :is(.nlpanel,.nlover,.nlscroll,.main,main.a-main,.mainin){transition:none!important;animation:none!important} /* the Academy's left column: an icon for every item, in its section's colour (v13y) */ html.nl #sidenav .sp .dot.nlic{background:none!important;width:17px!important;height:17px!important;border-radius:0!important;display:inline-grid;place-items:center;flex:none;box-shadow:none!important} html.nl #sidenav .sp .dot.nlic svg{width:17px;height:17px;display:block} html.nl .side .nlpnl[data-grp="start-here"] .sp .dot.nlic{color:#a35bff}html.nl .side .nlpnl[data-grp="arguta-os"] .sp .dot.nlic{color:#f7931a}html.nl .side .nlpnl[data-grp="courses"] .sp .dot.nlic{color:#3ddc97}html.nl .side .nlpnl[data-grp="community"] .sp .dot.nlic{color:#d8c2ff}html.nl .side .nlpnl[data-grp="mentoring"] .sp .dot.nlic{color:#f2d58a}html.nl .side .nlpnl[data-grp="help"] .sp .dot.nlic{color:#b9addb}html.nl .side .nlpnl[data-grp="arguta"] .sp .dot.nlic{color:#f7931a} /* v14a: the standalone page kit (html.pf-sa): ledger, certificates, status and the other single pages. The App's header, the Studio card, purple main buttons, the footer, all on the one stylesheet. The pages keep their own markup underneath */ html.pf-sa{background:#0b0711;color-scheme:dark;-webkit-font-smoothing:antialiased} html.pf-sa *,html.pf-sa *::before,html.pf-sa *::after{box-sizing:border-box} html.pf-sa body{margin:0;background:#0b0711!important;background-image:radial-gradient(70% 50% at 85% 0%,rgba(110,55,190,.28),transparent 70%)!important;background-attachment:fixed!important;color:#f3eaff;font:15px/1.55 Geist,system-ui,-apple-system,"Segoe UI",sans-serif} html.pf-sa body::before,html.pf-sa body::after{display:none!important} html.pf-sa .sa-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:12px;padding:10px max(16px,calc((100% - 1180px) / 2));padding-top:calc(10px + env(safe-area-inset-top));background:rgba(11,7,17,.88);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid #2a1f3d} html.pf-sa .sa-brand{display:flex;align-items:center;gap:10px;color:#f3eaff;text-decoration:none;min-width:0} html.pf-sa .sa-brand svg{width:34px;height:34px;flex:none} html.pf-sa .sa-brand img{height:17px;width:auto;display:block} html.pf-sa .sa-brand .sa-dv{width:1px;height:20px;background:#2a1f3d} html.pf-sa .sa-brand .sa-sec{font:600 14px Poppins,Geist,system-ui,sans-serif;white-space:nowrap} html.pf-sa .sa-acts{margin-left:auto;display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end} html.pf-sa .sa-acts a{display:inline-flex;align-items:center;gap:4px;padding:7px 12px;border-radius:10px;border:1px solid #2a1f3d;background:#1b1229;color:#f3eaff;text-decoration:none;font:400 13.5px Geist,system-ui,sans-serif} html.pf-sa .sa-acts a:hover{border-color:#a35bff} @media(max-width:640px){html.pf-sa .sa-acts a:not(.sa-keep){display:none}html.pf-sa .sa-brand img{height:15px}} html.pf-sa :is(.w,.wrap,.sa-w){max-width:1180px;margin:0 auto;padding:30px 16px 40px} html.pf-sa .brand:not(.sa-brand){display:none} html.pf-sa h1{font:600 30px/1.2 Poppins,Geist,system-ui,sans-serif;letter-spacing:-.01em;margin:6px 0 8px} html.pf-sa h2{font:600 19px/1.3 Poppins,Geist,system-ui,sans-serif;margin:30px 0 10px} html.pf-sa :is(.mute,.lead){color:#a99cc8} html.pf-sa a{color:#c4a8ff} html.pf-sa .kick,html.pf-sa .sa-kick{display:inline-block;font:500 11px/1.4 "Geist Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#F7931A} html.pf-sa :is(.card,.panel,.sa-card){background:#1a1228;border:1px solid #2a1f3d;border-radius:14px;padding:18px 20px;margin:14px 0} html.pf-sa .sa-in{background:#1f172f;border:1px solid #2a1f3d;border-radius:12px;padding:12px 14px} html.pf-sa .sa-hero{display:flex;gap:16px;align-items:center} html.pf-sa .sa-ic{flex:none;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#5b2bd6,#a35bff);color:#fff} html.pf-sa .sa-ic svg{width:22px;height:22px} html.pf-sa .sa-tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-top:16px} html.pf-sa .sa-tiles>div{background:#1f172f;border:1px solid #2a1f3d;border-radius:12px;padding:12px 14px} html.pf-sa .sa-tiles b{display:block;font:600 20px/1.2 Poppins,Geist,system-ui,sans-serif} html.pf-sa .sa-tiles span{font-size:12.5px;color:#a99cc8} html.pf-sa table{width:100%;border-collapse:collapse;font-size:13.5px} html.pf-sa :is(th,td){text-align:left;padding:9px 8px;border-top:1px solid #2a1f3d;vertical-align:top} html.pf-sa th{color:#a99cc8;font-weight:500;background:#1a1228;border-top:0} html.pf-sa code{font:12px/1.45 "Geist Mono",ui-monospace,Menlo,monospace;word-break:break-all;color:#e6d8ff} html.pf-sa .pill{display:inline-block;font-size:12px;padding:3px 10px;border-radius:999px;border:1px solid currentColor;white-space:nowrap} html.pf-sa :is(.ok,.sa-ok){color:#3ddc97}html.pf-sa :is(.wait,.sa-wait){color:#F7931A}html.pf-sa :is(.bad,.sa-bad){color:#ff8a80} html.pf-sa .row{border-top-color:#2a1f3d!important} html.pf-sa :is(.sa-btn,.btn){display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 16px;border-radius:10px;border:1px solid #7c3aed;background:#7c3aed;color:#fff;font:600 14.5px Geist,system-ui,sans-serif;text-decoration:none;cursor:pointer} html.pf-sa :is(.sa-btn,.btn):hover{background:#6d28d9;border-color:#c4a8ff} html.pf-sa :is(.sa-btn,.btn).gh{background:#1b1229;border-color:#2a1f3d;color:#f3eaff;font-weight:400} html.pf-sa :is(.sa-btn,.btn).gh:hover{background:#24183a;border-color:#a35bff} html.pf-sa .sa-foot{max-width:1180px;margin:10px auto 0;padding:16px 16px calc(28px + env(safe-area-inset-bottom));border-top:1px solid #2a1f3d;font:11.5px/1.55 Geist,system-ui,sans-serif;color:#8f84ab;text-align:center} html.pf-sa .sa-foot .lfl{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 16px;margin-bottom:6px} html.pf-sa .sa-foot a{color:#c9b8ec;text-decoration:none;font-weight:600} html.pf-sa .sa-foot p{margin:0 0 4px} /* the certificate pages (pf-proof): the Academy's My licence certificate, purple frame, Studio panels, purple buttons */ html.pf-sa.pf-proof{--bg:#0b0711;--card:#1a1228;--line:#2a1f3d;--tx:#f3eaff;--mu:#a99cc8} html.pf-proof .cert{background:linear-gradient(135deg,#a35bff,#6d28d9 55%,#a35bff)!important} html.pf-proof .cno strong{background:linear-gradient(90deg,#c4a8ff,#a35bff)!important;-webkit-background-clip:text!important;background-clip:text!important} html.pf-proof .wm{color:rgba(163,91,255,.07)!important} html.pf-proof .vt{top:57px!important;background:rgba(11,7,17,.92)!important;border-bottom-color:#2a1f3d!important} html.pf-proof .vt button{background:#1b1229!important;border:1px solid #2a1f3d!important;color:#f3eaff!important;font-weight:500!important} html.pf-proof .vt button.on{background:#24183a!important;border-color:#8b5cf6!important;color:#f3eaff!important} html.pf-proof :is(.cvbtns a.p){background:#7c3aed!important;border:1px solid #7c3aed!important;color:#fff!important} html.pf-proof :is(.cvbtns a:not(.p),.share a){background:#1b1229!important;border:1px solid #2a1f3d!important;color:#f3eaff!important} html.pf-proof :is(.cvbtns a,.share a):hover{border-color:#a35bff!important} html.pf-proof :is(.cvsec,.panel,.rel div,.flow div,.lg details){background:#1a1228!important;border-color:#2a1f3d!important;border-radius:14px!important} html.pf-proof .flow div{border-left:3px solid #a35bff!important}html.pf-proof .flow div:nth-child(even){border-left-color:#F7931A!important} html.pf-proof .cvbar{background:#1a1228!important;border-color:#2a1f3d!important} html.pf-proof .cta{background:#1a1228!important;border:1px solid #8b5cf6!important} html.pf-proof .panel.o{border-color:#2a1f3d!important} html.pf-proof .gal div{border-color:#2a1f3d!important} html.pf-proof .art{border-color:rgba(163,91,255,.55)!important} html.pf-proof .tog em{background:#7a3ff0}html.pf-proof .tog em.off{background:#2a1f3d} html.pf-proof .own{border-color:#8b5cf6!important} html.pf-proof .foot{border-top-color:#2a1f3d!important} @media(max-width:640px){html.pf-sa :is(th,td){padding:8px 5px}html.pf-sa h1{font-size:25px}} /* v14b: the landing pages (html.pf-lp, on the standalone kit): App first, then Studio and the Academy. Mobile first */ html.pf-lp .lp-w{max-width:1180px;margin:0 auto;padding:0 16px} html.pf-lp .lp-top .lp-go{background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;font-weight:600!important} html.pf-lp .lp-hero{padding:44px 0 28px} html.pf-lp .lp-hg{display:grid;gap:28px;align-items:center} @media (min-width:960px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-hg{grid-template-columns:1.1fr .9fr;gap:48px}html.pf-lp .lp-hero{padding:72px 0 44px}} html.pf-lp .lp-hero h1{font:600 clamp(34px,6vw,58px)/1.08 Poppins,Geist,system-ui,sans-serif;letter-spacing:-.02em;margin:10px 0 14px} html.pf-lp .lp-hero h1 em{font-style:normal;color:#c4a8ff} html.pf-lp .lp-lead{font-size:clamp(16px,1.6vw,18px);line-height:1.6;color:#c9bde6;max-width:680px;margin:0 0 18px} html.pf-lp .lp-btns{display:flex;flex-wrap:wrap;gap:10px} html.pf-lp .lp-big{min-height:52px;padding:0 22px;font-size:16px} html.pf-lp .lp-small{font-size:13px;color:#a99cc8;margin:12px 0 0} html.pf-lp .lp-demo{background:#1a1228;border:1px solid #2a1f3d;border-radius:18px;padding:16px;box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(163,91,255,.08);display:grid;gap:10px} html.pf-lp .lp-dh{display:flex;align-items:center;gap:10px;padding-bottom:10px;border-bottom:1px solid #2a1f3d} html.pf-lp .lp-dh img{width:40px;height:40px;border-radius:50%;object-fit:cover;border:1px solid #a35bff} html.pf-lp .lp-dh b{display:block;font:600 15px Poppins,Geist,system-ui,sans-serif}html.pf-lp .lp-dh small{color:#a99cc8;font-size:12.5px} html.pf-lp .lp-tag{margin-left:auto;font:500 10.5px "Geist Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#a99cc8;border:1px solid #2a1f3d;border-radius:999px;padding:3px 8px} html.pf-lp .lp-msg{border-radius:14px;padding:10px 13px;font-size:14.5px;line-height:1.5;max-width:92%} html.pf-lp .lp-msg.me{justify-self:end;background:#7c3aed;color:#fff} html.pf-lp .lp-msg.ag{justify-self:start;background:#1f172f;border:1px solid #2a1f3d} html.pf-lp .lp-msg.lp-soft{color:#c4b8e0} html.pf-lp .lp-who{display:flex;align-items:center;gap:6px;font-size:12px;color:#c4a8ff;margin-bottom:4px} html.pf-lp .lp-who img{width:20px;height:20px;border-radius:50%;object-fit:cover} html.pf-lp .lp-strip{border-top:1px solid #2a1f3d;border-bottom:1px solid #2a1f3d;background:rgba(26,18,40,.6)} html.pf-lp .lp-strip .lp-w{display:flex;flex-wrap:wrap;gap:8px 26px;justify-content:center;padding:14px 16px;font-size:13.5px;color:#c4b8e0} html.pf-lp .lp-strip span::before{content:"✓ ";color:#3ddc97} html.pf-lp .lp-sec{padding:40px 0 8px} @media (min-width:960px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-sec{padding:56px 0 12px}} html.pf-lp .lp-sec h2{font:600 clamp(24px,3.4vw,34px)/1.2 Poppins,Geist,system-ui,sans-serif;margin:8px 0 12px} html.pf-lp .lp-sec h3{font:600 17px/1.3 Poppins,Geist,system-ui,sans-serif;margin:8px 0 6px} html.pf-lp .lp-sec p{color:#c4b8e0;margin:0} html.pf-lp .lp-3{display:grid;gap:12px;margin-top:8px}@media(min-width:760px){html.pf-lp .lp-3{grid-template-columns:repeat(3,1fr)}} html.pf-lp .lp-3 .sa-card{margin:0} html.pf-lp .lp-n{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#24183a;border:1px solid #8b5cf6;font:600 14px Poppins,Geist,sans-serif;font-style:normal;color:#f3eaff} html.pf-lp .lp-crew{display:grid;gap:12px}@media(min-width:700px){html.pf-lp .lp-crew{grid-template-columns:1fr 1fr}}@media (min-width:1050px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-crew{grid-template-columns:repeat(3,1fr)}} html.pf-lp .lp-ag{display:flex;gap:14px;margin:0;align-items:flex-start} html.pf-lp .lp-ag img{width:96px;align-self:stretch;min-height:120px;height:auto;border-radius:14px;object-fit:cover;object-position:50% 18%;flex:none;border:1px solid #2a1f3d} @media (min-width:1050px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-ag img{width:108px}} html.pf-lp .lp-ag b{font:600 15px Poppins,Geist,sans-serif} html.pf-lp .lp-role{display:block;font:500 11px "Geist Mono",ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#F7931A;margin:2px 0 4px} html.pf-lp .lp-ag p{font-size:13px;line-height:1.5} html.pf-lp .lp-ag .lp-in{font-size:11px} html.pf-lp .lp-in{display:inline-block;margin-top:8px;font-size:12px;color:#c4a8ff;border:1px solid #2a1f3d;border-radius:999px;padding:2px 9px} html.pf-lp .lp-in.t{color:#3ddc97;border-color:rgba(61,220,151,.35)} html.pf-lp .lp-plans{display:grid;gap:12px;margin-top:10px}@media(min-width:700px){html.pf-lp .lp-plans{grid-template-columns:1fr 1fr}}@media (min-width:1100px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-plans{grid-template-columns:repeat(4,1fr)}} html.pf-lp .lp-pl{position:relative;display:flex;flex-direction:column;gap:6px;margin:0} html.pf-lp .lp-pl.hi{border-color:#8b5cf6;box-shadow:0 0 0 1px #8b5cf6 inset} html.pf-lp .lp-pl.rs{opacity:.8} html.pf-lp .lp-flag{position:absolute;top:-11px;left:16px;font:600 11px Geist,sans-serif;background:#7c3aed;color:#fff;border-radius:999px;padding:3px 10px} html.pf-lp .lp-flag.rs{background:#24183a;border:1px solid #2a1f3d;color:#c4b8e0} html.pf-lp .lp-pn{font:600 16px Poppins,Geist,sans-serif} html.pf-lp .lp-pp{font:600 32px/1.1 Poppins,Geist,sans-serif}html.pf-lp .lp-pp s{font-size:17px;color:#8f84ab;margin-right:6px;font-weight:400}html.pf-lp .lp-pp small{font-size:14px;color:#a99cc8;font-weight:400} html.pf-lp .lp-po{font-size:13px!important;color:#a99cc8!important} html.pf-lp .lp-pl ul{list-style:none;padding:0;margin:6px 0 12px;display:grid;gap:6px;font-size:14px;color:#c4b8e0;flex:1} html.pf-lp .lp-pl li::before{content:"✓ ";color:#3ddc97} html.pf-lp .lp-pl .sa-btn{width:100%} html.pf-lp .lp-alt{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;margin:0} html.pf-lp .lp-alt>div{max-width:720px} html.pf-lp .lp-faq details{background:#1a1228;border:1px solid #2a1f3d;border-radius:14px;padding:14px 16px;margin:10px 0} html.pf-lp .lp-faq summary{cursor:pointer;font:600 15.5px Geist,system-ui,sans-serif;list-style:none;display:flex;justify-content:space-between;gap:12px} html.pf-lp .lp-faq summary::after{content:"+";color:#c4a8ff;font-size:18px;line-height:1}html.pf-lp .lp-faq details[open] summary::after{content:"−"} html.pf-lp .lp-faq summary::-webkit-details-marker{display:none} html.pf-lp .lp-faq details p{margin-top:8px} html.pf-lp .lp-end{padding-bottom:48px} html.pf-lp .lp-cta{text-align:center;padding:36px 20px;border-color:#8b5cf6;background:radial-gradient(80% 120% at 50% 0%,rgba(124,58,237,.28),#1a1228 70%)} html.pf-lp .lp-cta .lp-lead{margin:0 auto 18px} @media(max-width:640px){html.pf-lp .lp-top .sa-acts a{padding:7px 10px}html.pf-lp .lp-btns .sa-btn{flex:1 1 100%}} /* v14c: the App landing page carries Arguta: her portrait in the logo's frame, the crew wall, the ledger, two ways */ html.pf-lp .lp-sec h2 em{font-style:normal;color:#c4a8ff} html.pf-lp .lp-stage{position:relative;display:grid;justify-items:center;padding-bottom:10px} html.pf-lp .lp-me{position:relative;width:min(360px,78vw);aspect-ratio:1;border-radius:28px;padding:10px} html.pf-lp .lp-me::before{content:"";position:absolute;inset:-12%;border-radius:50%;background:radial-gradient(circle,rgba(163,91,255,.45),rgba(163,91,255,0) 65%);z-index:-1} html.pf-lp .lp-me img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 22%;border-radius:22px;border:1px solid rgba(163,91,255,.5)} html.pf-lp .lp-me i{position:absolute;width:42px;height:42px;border:4px solid #f3eaff;filter:drop-shadow(0 0 8px rgba(243,234,255,.35))} html.pf-lp .lp-me .c1{top:0;left:0;border-right:0;border-bottom:0;border-radius:10px 0 0 0}html.pf-lp .lp-me .c2{top:0;right:0;border-left:0;border-bottom:0;border-radius:0 10px 0 0} html.pf-lp .lp-me .c3{bottom:0;left:0;border-right:0;border-top:0;border-radius:0 0 0 10px}html.pf-lp .lp-me .c4{bottom:0;right:0;border-left:0;border-top:0;border-radius:0 0 10px 0} html.pf-lp .lp-badge{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);white-space:nowrap;font:500 11px "Geist Mono",ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:#f3eaff;background:rgba(11,7,17,.78);border:1px solid rgba(163,91,255,.5);border-radius:999px;padding:5px 12px;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)} html.pf-lp .lp-stage .lp-demo{position:relative;width:min(420px,92vw);margin-top:18px;padding:14px;gap:8px} html.pf-lp .lp-stage .lp-tag{position:absolute;top:-10px;right:14px;background:#1a1228} /* v14c: Arguta headshot hero (as on the Academy start page) and Everything in one place */ html.pf-lp .lp-hx{padding:18px 0 24px} html.pf-lp .lp-hbox{position:relative;border-radius:18px;overflow:hidden;background:#000;border:1px solid #2a1f3d} html.pf-lp .lp-himg{display:block;width:100%;aspect-ratio:16/11;object-fit:cover;object-position:65% 20%} html.pf-lp .lp-hpic{position:relative} html.pf-lp .lp-br{position:absolute;inset:12px;pointer-events:none;z-index:2} html.pf-lp .lp-br svg{width:100%;height:100%;overflow:visible} html.pf-lp .lp-br path{fill:none;stroke:#F3ECFF;stroke-width:3;vector-effect:non-scaling-stroke;stroke-linecap:round;filter:drop-shadow(0 0 6px rgba(190,150,255,.9))} html.pf-lp .lp-hin{position:relative;z-index:3;padding:22px 18px 24px;background:#0b0711} html.pf-lp .lp-hin h1{margin-top:8px} html.pf-lp .lp-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px} html.pf-lp .lp-chips span,html.pf-lp .lp-parts span{font:500 13px Geist,system-ui,sans-serif;padding:7px 12px;border-radius:999px;border:1px solid rgba(163,91,255,.6);background:rgba(163,91,255,.16);color:#f3eaff} @media (min-width:900px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-hx{padding:28px 0 36px}html.pf-lp .lp-hbox{min-height:640px;display:flex;align-items:center} html.pf-lp .lp-hpic{position:absolute;inset:0;z-index:0}html.pf-lp .lp-himg{position:absolute;inset:0;height:100%;aspect-ratio:auto;object-position:62% 22%} html.pf-lp .lp-hpic::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(8,6,12,.96) 0%,rgba(8,6,12,.8) 38%,rgba(8,6,12,.15) 64%,rgba(8,6,12,.5) 100%),linear-gradient(0deg,rgba(8,6,12,.7),rgba(8,6,12,0) 45%)} html.pf-lp .lp-br{inset:16px} html.pf-lp .lp-hin{background:none;max-width:600px;padding:48px 44px}} html.pf-lp .lp-one{display:grid;gap:12px;margin-top:10px} @media(min-width:760px){html.pf-lp .lp-one{grid-template-columns:1fr 1fr}html.pf-lp .lp-one>:first-child{grid-column:1/-1}} @media (min-width:1100px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-one{grid-template-columns:repeat(4,1fr)}} html.pf-lp .lp-one .sa-card{margin:0} html.pf-lp .lp-one>:first-child{border-color:#8b5cf6;background:radial-gradient(90% 140% at 0% 0%,rgba(124,58,237,.22),#1a1228 70%)} html.pf-lp .lp-oi{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#24183a;border:1px solid #8b5cf6;font:600 15px Poppins,Geist,sans-serif;color:#f3eaff} html.pf-lp .lp-parts{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px} /* v14e: plan cards show jobs and agents big; darker plan small print; body text a size down */ html.pf-lp .lp-st{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:10px 0 4px} html.pf-lp .lp-st>div{background:#140e20;border:1px solid #2a1f3d;border-radius:12px;padding:10px 12px} html.pf-lp .lp-st b{display:block;font:600 26px/1.1 Poppins,Geist,sans-serif;color:#f3eaff} html.pf-lp .lp-pl.hi .lp-st b{color:#c4a8ff} html.pf-lp .lp-st span{display:block;font-size:12.5px;color:#c4b8e0;margin-top:2px} html.pf-lp .lp-pl ul{font-size:13.5px} html.pf-lp .lp-fine{font-size:13px;line-height:1.6;color:#d6cdee!important;background:#140e20;border:1px solid #2a1f3d;border-radius:12px;padding:12px 16px;margin:18px 0 0!important} html.pf-lp .lp-lead{font-size:clamp(15px,1.4vw,17px)} html.pf-lp .lp-sec .sa-card p{font-size:14px;line-height:1.55} html.pf-lp .lp-faq details p{font-size:14px} html.pf-lp .lp-faq summary{font-size:15px} html.pf-lp .lp-one h3{font-size:19px;margin:0 0 8px;color:#f3eaff} html.pf-lp .lp-one>:first-child h3{font-size:22px} /* v14g: default space under every section heading block (kick, title, intro) before the cards; intro on one line on desktop; small print muted */ html.pf-lp .lp-sec .lp-lead{max-width:900px;margin:0!important} html.pf-lp .lp-sec .lp-w>:is(h2,.lp-lead)+:not(p){margin-top:28px!important} @media (min-width:960px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-sec .lp-w>:is(h2,.lp-lead)+:not(p){margin-top:32px!important}} html.pf-lp .lp-sec h2{margin-bottom:10px} html.pf-lp .lp-fine{color:#8f84ab!important;background:rgba(20,14,32,.6);border-color:#21182f;font-size:12.5px;margin-top:22px!important} html.pf-lp .lp-fine a{color:inherit} /* v14h: final call box centred with room to breathe (the v14g intro rule had taken its centring and margin) */ html.pf-lp .lp-cta{padding:44px 24px!important} html.pf-lp .lp-cta h2{margin:14px 0 10px} html.pf-lp .lp-cta .lp-lead{margin:0 auto 26px!important;text-align:center} /* v14i: ghost buttons on landing cards get a clear purple border so they read as buttons */ html.pf-lp :is(.lp-way,.lp-pl,.lp-proof) a.sa-btn.gh{border:1.5px solid #8b5cf6!important;color:#f3eaff!important;background:rgba(124,58,237,.12)!important} html.pf-lp :is(.lp-way,.lp-pl,.lp-proof) a.sa-btn.gh:hover{background:rgba(124,58,237,.28)!important;border-color:#a35bff!important} /* v14j: one hero height on every landing page (no jumping between App, Academy and Studio) */ @media (min-width:900px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-hbox{height:640px;min-height:0}} /* v14k: a fixed frame for the hero text, so the hero never jumps between pages: set line heights, reserved lines for the title, intro and pills, text pinned to the top of the box (not centred) */ html.pf-lp .lp-hin .kick{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:16px;height:16px} html.pf-lp .lp-hin h1{line-height:1.1!important;min-height:3.3em} html.pf-lp .lp-hin .lp-lead{line-height:1.6!important;min-height:12.8em} html.pf-lp .lp-hin .lp-chips{min-height:74px;align-content:flex-start} @media(max-width:699px){html.pf-lp .lp-hin .lp-chips{min-height:115px}} html.pf-lp .lp-hin .lp-small{line-height:20px;min-height:40px} @media(max-width:379px){html.pf-lp .lp-hin .lp-small{min-height:60px}html.pf-lp .lp-hin h1{min-height:4.4em}html.pf-lp .lp-hin .lp-lead{min-height:14.4em}} @media(min-width:700px){html.pf-lp .lp-hin .lp-lead{min-height:8em}html.pf-lp .lp-hin .lp-small{min-height:20px}} @media (min-width:900px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-hbox{align-items:center}html.pf-lp .lp-hin{padding:44px}} /* v14o: Studio plan cards: the member price line; three cards in the "ways to work" section */ html.pf-lp .lp-mem{font-size:12.5px!important;line-height:1.5;color:#c4b8e0!important;background:rgba(124,58,237,.12);border:1px solid rgba(139,92,246,.35);border-radius:10px;padding:8px 10px;margin:6px 0 2px!important} html.pf-lp .lp-mem b{color:#f3eaff;font-weight:600} @media (min-width:960px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-two.lp-three{grid-template-columns:repeat(3,1fr)}} html.pf-lp .lp-pl span.sa-btn[aria-disabled]{opacity:.75;cursor:default} html.pf-lp .lp-pl ul{align-content:start} /* v14r: one style for every orange feature box on Plans pages (Lifetime Kit, Releasing soon cards, VIP box): the same warm gradient; solid orange edge when you can buy it, dashed when it is releasing soon. Compare table: group rows are plain labels, the plan highlight column runs unbroken through them. */ :where(.doc) :is(.nllife,.pcx.rs,.soonbox.vipbox){background:linear-gradient(135deg,color-mix(in srgb,var(--p-lab) 10%,var(--p-card)),var(--p-card) 60%)} :where(.doc) .soonbox .pcx.rs{background:var(--p-card)} :where(.doc) .cmp.mx tr.g td{background:transparent;padding-top:18px;border-top:1px solid var(--p-line);white-space:nowrap} :where(.doc) .cmp.mx tr.g td.hl1{background:color-mix(in srgb,var(--p-vio) 10%,transparent)} /* v14w: Studio's set-up takeover (New project, Build my website), like Wix: a focused panel in the middle of the screen */ .stwiz{position:fixed;inset:0;z-index:2147482000;display:grid;place-items:center;padding:16px;background:rgba(11,7,17,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)} .stwiz[hidden]{display:none} .stwz-p{position:relative;width:min(640px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:28px 26px 22px;border:1px solid #8b5cf6;border-radius:18px;background:linear-gradient(160deg,#1f1530,#140e20 60%);box-shadow:0 30px 80px rgba(0,0,0,.55);color:#f3eaff;font:15px/1.5 Geist,system-ui,sans-serif} .stwz-p h2{font:600 24px/1.2 Poppins,Geist,sans-serif;margin:8px 0 6px} .stwz-l{color:#c4b8e0;margin:0 0 16px} .stwz-p input{width:100%;box-sizing:border-box;padding:12px 14px;border:1px solid #2a1f3d;border-radius:12px;background:#0b0711;color:#f3eaff;font:16px Geist,system-ui,sans-serif;outline:none} .stwz-p input:is(:focus,:focus-visible){border-color:#8b5cf6;outline:none!important;box-shadow:none!important} .stwz-c{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;max-height:260px;overflow:auto} .stwz-c button{padding:8px 12px;border:1px solid rgba(163,91,255,.5);border-radius:999px;background:rgba(163,91,255,.12);color:#f3eaff;font:500 13px Geist,system-ui,sans-serif;cursor:pointer} .stwz-c button.on,.stwz-o button.on{background:#7c3aed;border-color:#7c3aed;color:#fff} .stwz-o{display:grid;gap:10px} .stwz-o button{display:grid;gap:2px;text-align:left;padding:14px 16px;border:1px solid #2a1f3d;border-radius:14px;background:#1a1228;color:#f3eaff;font:15px Geist,system-ui,sans-serif;cursor:pointer} .stwz-o button:hover{border-color:#8b5cf6} .stwz-o button small{color:#a99cc8;font-size:13px} .stwz-d{display:flex;align-items:center;gap:6px;margin-bottom:6px} .stwz-d i{width:28px;height:4px;border-radius:4px;background:#2a1f3d}.stwz-d i.on{background:#8b5cf6} .stwz-d span{margin-left:8px;font:500 11px "Geist Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#F7931A} .stwz-f{display:flex;justify-content:space-between;align-items:center;margin-top:22px} .stwz-n{padding:12px 22px;border:0;border-radius:999px;background:#7c3aed;color:#fff;font:600 15px Geist,system-ui,sans-serif;cursor:pointer} .stwz-n[disabled]{opacity:.7} .stwz-b{padding:11px 18px;border:1.5px solid #8b5cf6;border-radius:999px;background:transparent;color:#f3eaff;font:600 14px Geist,system-ui,sans-serif;cursor:pointer} .stwz-x{position:absolute;top:12px;right:14px;width:34px;height:34px;border:0;border-radius:50%;background:#24183a;color:#f3eaff;font-size:20px;line-height:1;cursor:pointer} /* v14y: one Account (Studio, App, Academy) */ .doc .acbar{display:flex;height:10px;border-radius:999px;overflow:hidden;background:#24183a;margin:8px 0 4px} .doc .acbar i{display:block;height:100%}.doc .acbar .a{background:#7c3aed}.doc .acbar .s{background:#F7931A} .doc .ackey{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:#cbbfe6;margin:2px 0 6px}.doc .ackey i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px} .doc .acfind{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:16px} .doc .acfind input{min-width:260px;padding:10px 14px;border-radius:12px;border:1px solid #2a1f3d;background:#140e20;color:#f3eaff;font:15px Geist,system-ui,sans-serif} .doc .acfind input:focus{outline:none;border-color:#7c3aed} .doc a.ghostb{display:inline-flex;align-items:center;text-decoration:none}.doc .acgo{text-align:center;margin-top:14px} @media (max-width:699px){.doc table.cmp.acpl thead{display:none}.doc table.cmp.acpl,.doc table.cmp.acpl tbody,.doc table.cmp.acpl tr,.doc table.cmp.acpl td{display:block;width:auto}.doc table.cmp.acpl tr{padding:12px 14px;border-bottom:1px solid #2a1f3d}.doc table.cmp.acpl td{border:0;padding:2px 0;background:none}.doc table.cmp.acpl td:first-child{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#F7931A}.doc table.cmp.acpl td:last-child{color:#cbbfe6;font-size:14px}} .doc .acpay{max-width:560px;margin:18px auto 0;padding:18px 20px;border:1px solid #7c3aed;border-radius:16px;background:#140e20;display:grid;gap:10px} .doc .acpay[hidden]{display:none}.doc .acpay b{font-size:17px}.doc .acpay p{margin:0}.doc .acpay .acb{display:flex;flex-wrap:wrap;gap:8px} .doc .acag2{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.45;color:#cbbfe6}.doc .acag2 input{margin-top:3px;accent-color:#7c3aed} .doc table.cmp td.acact{white-space:nowrap;text-align:right}.doc table.cmp td.acact .ghostb{min-height:36px;padding:0 14px;font-size:14px} .doc .acmsg{color:#F7931A} .doc.lite .acpay{background:#fff;border-color:#c9b6f2}.doc.lite .acag2{color:#4b3d66} @media (max-width:699px){.doc table.cmp.acpl td.acact{text-align:left;white-space:normal;padding-top:8px}} .doc.lite .acbar{background:#ece6f7}.doc.lite .ackey{color:#4b3d66}.doc.lite .acfind input{background:#fff;border-color:#d9cfee;color:#1b1029} html.pf-lp .lp-wall{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px} @media(min-width:640px){html.pf-lp .lp-wall{grid-template-columns:repeat(6,1fr)}}@media (min-width:1000px) and (hover:hover), (min-width:1401px){html.pf-lp .lp-wall{grid-template-columns:repeat(8,1fr)}} html.pf-lp .lp-wall figure{margin:0;text-align:center} html.pf-lp .lp-wall img{display:block;width:100%;aspect-ratio:1;object-fit:cover;border-radius:14px;border:1px solid #2a1f3d;transition:transform .2s,border-color .2s} html.pf-lp .lp-wall figure:hover img{transform:translateY(-3px);border-color:#a35bff} html.pf-lp .lp-wall figcaption{font-size:12px;color:#c4b8e0;margin-top:5px} html.pf-lp .lp-wall .lp-lead-ag{grid-column:span 2;grid-row:span 2} html.pf-lp .lp-wall .lp-lead-ag img{border:2px solid #a35bff;box-shadow:0 0 30px rgba(163,91,255,.35)} html.pf-lp .lp-wall .lp-lead-ag figcaption{font-size:13px}html.pf-lp .lp-wall .lp-lead-ag b{display:block;font:600 15px Poppins,Geist,sans-serif;color:#f3eaff} html.pf-lp .lp-proof{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;margin:0;border-left:3px solid #F7931A} html.pf-lp .lp-proof>div{max-width:760px}html.pf-lp .lp-proof h2{margin-top:6px} html.pf-lp .lp-two{display:grid;gap:14px;margin-top:12px}@media(min-width:800px){html.pf-lp .lp-two{grid-template-columns:1fr 1fr}} html.pf-lp .lp-way{position:relative;display:flex;flex-direction:column;gap:6px;margin:0;padding:24px} html.pf-lp .lp-way.hi{border-color:#8b5cf6;box-shadow:0 0 0 1px #8b5cf6 inset} html.pf-lp .lp-way h3{font:600 22px Poppins,Geist,sans-serif;margin:0} html.pf-lp .lp-wsub{color:#c4a8ff!important;margin:0 0 6px!important} html.pf-lp .lp-way ul{list-style:none;padding:0;margin:4px 0 16px;display:grid;gap:8px;flex:1;color:#d8cdef} html.pf-lp .lp-way li::before{content:"✓ ";color:#3ddc97} html.pf-lp .lp-way .sa-btn{align-self:flex-start} html.pf-lp .lp-ctaface{width:84px;height:84px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:2px solid #a35bff;box-shadow:0 0 30px rgba(163,91,255,.45);display:block;margin:0 auto 10px} /* v14c: the public Policies page */ html.pf-pol .pol .pgh{margin-bottom:6px}html.pf-pol .pol .pgh .k{font:500 11px "Geist Mono",ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#F7931A} html.pf-pol .pol .pgh .lede{color:#a99cc8;margin:0 0 12px} html.pf-pol .poltabs{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0 16px;position:sticky;top:57px;z-index:5;background:#1a1228;padding:8px 0} html.pf-pol .poltabs button{background:#1b1229;border:1px solid #2a1f3d;color:#f3eaff;border-radius:10px;padding:8px 14px;font:400 14px Geist,system-ui,sans-serif;cursor:pointer} html.pf-pol .poltabs button:hover{border-color:#a35bff}html.pf-pol .poltabs button.on{background:#24183a;border-color:#8b5cf6} html.pf-pol .polsec{max-width:820px;line-height:1.65;color:#d8cdef}html.pf-pol .polsec h2.polh{font:600 22px Poppins,Geist,sans-serif;margin:4px 0 8px;color:#f3eaff} html.pf-pol .polsec h3{font:600 16px Poppins,Geist,sans-serif;margin:18px 0 6px;color:#f3eaff}html.pf-pol .polsec :is(p,li){color:#c4b8e0} html.pf-pol .polsec button{background:#1b1229;border:1px solid #2a1f3d;color:#f3eaff;border-radius:10px;padding:8px 14px;font:inherit;cursor:pointer} /* every accordion: one open at a time (v14c, a standing rule); the script is on each page */ /* the sign-in pages: password and text boxes as the email box */ :where(html.pf-sgn) input:is([type=password],[type=text],:not([type])){width:100%;min-height:48px;border-radius:10px;border:1px solid #2a1f3d;background:#0f0a18;color:#f3eaff;padding:0 14px;font:16px Geist,system-ui,sans-serif;outline:none;transition:border-color .15s} :where(html.pf-sgn) label+input,:where(html.pf-sgn) input+label{margin-top:0} :where(html.pf-sgn) form label:not(:first-of-type){margin-top:12px} :where(html.pf-sgn) .nt{color:#a99cc8;font-size:13.5px;margin:0 0 14px} html.pf-sgn .tk{font-size:12px!important;color:#a99cc8!important;margin:14px 0 4px!important;align-items:center!important;gap:8px!important;line-height:1.4} html.pf-sgn .tk input{width:16px!important;height:16px!important;margin:0!important;flex:none} html.pf-sgn .tk a{color:inherit!important;text-decoration:underline;text-underline-offset:2px} html.pf-sgn .tk a:hover{color:#f3eaff!important} html.pf-sgn input:is(:focus,:focus-visible){outline:none!important;box-shadow:none!important;border-color:#8b5cf6!important} :where(html.pf-sgn) .hs{display:flex;gap:10px;align-items:flex-start;margin-top:14px;padding:10px 12px;border:1px solid #2a1f3d;border-radius:10px;background:#1f172f;color:#c4b8e0;font-size:12.5px;line-height:1.45}:where(html.pf-sgn) .hs[hidden]{display:none}:where(html.pf-sgn) .hs svg{flex:none;color:#c4a8ff;margin-top:1px} :is(html.pf-sgn,html.pf-sa,html.pf-core) input:-webkit-autofill{-webkit-text-fill-color:#f3eaff!important;caret-color:#f3eaff;-webkit-box-shadow:0 0 0 100px #0f0a18 inset!important;box-shadow:0 0 0 100px #0f0a18 inset!important;transition:background-color 9999s} /* Clear chat undo (5 s), as the App */ :where(html.pf-acad,html.pf-adm,html.pf-ply) .ag-tb.undo{border-color:#F7931A!important;color:#ffd9a8!important} /* side counts: the App's small orange figure on every platform (was a grey ring in the Academy, a red dot in Academy Admin) */ :where(html.pf-acad,html.pf-adm) .sp .cnt{margin-left:auto;background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;color:#F7931A!important;font:500 11px/13px Geist,system-ui,sans-serif!important;height:auto!important;min-width:0!important} /* v13i CORE ADMIN dark map: written by tools/core-darkmap.py from the admin's own CSS. Light panels, light lines and dark text become the dark standard. */ /* admin */ html.pf-core:not([data-skin=light]) #adm .ct-btn,html.pf-core:not([data-skin=light]) #adm .bs-ai{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .pk-std{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .pk-std s{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .pk-note{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .hl-grid{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .hl-grid div{border-right-color:#2a1f3d!important;border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .st-card{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .st-bar{background:#1a1228!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .td{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .hit{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .pk-a{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .pk-a-p{border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .a-items textarea{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .a-items select{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .q-tot div{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .q-tot div:nth-child(2){background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .bo-g{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .bo-r{border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .mn{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .mn-i:hover{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .bk-how span{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .bk-how input:checked+span{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-cal .ev.ev-p{background:#221832!important;color:#ffbd70!important} html.pf-core:not([data-skin=light]) #adm .a-pw{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .a-pw b{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .wa-av{background:rgba(71,209,113,0.14)!important;color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .lc{border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .mv{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .mv.up{color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .mv.dn{color:#e78f87!important} html.pf-core:not([data-skin=light]) #adm .fx{border-color:#2a1f3d!important;background:#221832!important} html.pf-core:not([data-skin=light]) #adm .fx-code .a-btn{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .who{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .camp-steps div{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .camp .camp-d{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .fl-col{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .fl-h span{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .fl-card{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .au-s{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .an-track{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .rv-new{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .rv-reply{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .hx-n{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .hx-nh.g{color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .hx-ok{color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .b2-b{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .hx-nh2 b{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .hx-sc small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .hx-sc.cur{background:#2b2015!important;color:#fff!important} html.pf-core:not([data-skin=light]) #adm .hx-sc.cur i{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .hx-sc.cur small{color:#F7B267!important} html.pf-core:not([data-skin=light]) #adm .si-box{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .si-logo{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .si-h{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .si-l{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .si-l input{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .si-btn{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .si-msg{color:#ffbd70!important} html.pf-core:not([data-skin=light]) #adm .si-back{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .si-tip{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gprev{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .gprev small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gprev b{color:#847af4!important} html.pf-core:not([data-skin=light]) #adm .gprev span{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .yn{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .yn button{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .yn button.on{background:#24183a!important;color:#fff!important} html.pf-core:not([data-skin=light]) #adm .gd.done summary b{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gd.cur{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .gd.red summary b{color:#e78f87!important} html.pf-core:not([data-skin=light]) #adm .sd-fmt button{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-fmt button.on{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sd-nav{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-dots i{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-dots i.on{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-sub{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sd-th{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-tb button{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-ask{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sd-det{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-det summary{color:#ac8ee0!important} html.pf-core:not([data-skin=light]) #adm .sd-post textarea{color:#f3eaff!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-post .a-btn,html.pf-core:not([data-skin=light]) #adm .sd-act .a-btn{color:#f3eaff!important;background:#1a1228!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sd-act .a-btn.pri{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .sd-m.ai{background:#221832!important} html.pf-core:not([data-skin=light]) #adm #sdSay{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sd-talk{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-chip{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-tg span{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .sd-tg span:after{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sd-li{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .hs-r{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .hs-r input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .hs-r em{color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .ch-tabs button.on{color:var(--ink)!important} html.pf-core:not([data-skin=light]) #adm .ch-tabs button span{background:#221832!important;color:#ac8ee0!important} html.pf-core:not([data-skin=light]) #adm .ch-ev i{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .cc-chips button{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .cc-chips button.on{background:#24183a!important;color:#fff!important;border-color:#16181d!important} html.pf-core:not([data-skin=light]) #adm .cc-row{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .cc-back{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .cc-hero .a-btn{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .cc-steps button{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .cc-steps .on{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .cc-steps .on i{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .cc-nav button.on{background:#1a1228!important;border-color:var(--line)!important} html.pf-core:not([data-skin=light]) #adm .cc-team,html.pf-core:not([data-skin=light]) #adm .cc-res{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm #ccSay{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cc-rmini img,html.pf-core:not([data-skin=light]) #adm .cc-rmini span{background:rgba(209,151,71,0.12)!important} html.pf-core:not([data-skin=light]) #adm .cc-act .a-btn{color:#f3eaff!important;background:#1a1228!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cc-act .a-btn.pri{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .np-gi{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .np-gi input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .jr-ar{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .jr-c.cur{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .jr-c.cur i{background:#16181d!important} html.pf-core:not([data-skin=light]) #adm .jr-panel{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .td-dot{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .td-next{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .cc-mini i{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .aud-modes button{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .aud-ipad{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .aud-dots button{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .aud-dots button.ok{background:rgba(71,209,119,0.14)!important} html.pf-core:not([data-skin=light]) #adm .aq-in{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .aq-yn button,html.pf-core:not([data-skin=light]) #adm .aq-chips button{border-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .aq-yn button.on{background:#24183a!important;color:#fff!important;border-color:#16181d!important} html.pf-core:not([data-skin=light]) #adm .aq-chips button.on{color:#fff!important} html.pf-core:not([data-skin=light]) #adm .rec{border-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .rec.up{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .rec.swap{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .rec.ok{background:rgba(71,209,117,0.12)!important} html.pf-core:not([data-skin=light]) #adm .qs-dis em{color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .qs-offer{background:#221832!important;color:#ffbd70!important} html.pf-core:not([data-skin=light]) #adm .qs-hf input,html.pf-core:not([data-skin=light]) #adm .qs-hf select,html.pf-core:not([data-skin=light]) #adm .qs-hf textarea,html.pf-core:not([data-skin=light]) #adm .qs-in{border-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .qs-lc{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .qs-lc.off{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .qs-ln{border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .qs-ty{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .qs-was{color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .qs-wv input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .qs-inc summary{color:#ac8ee0!important} html.pf-core:not([data-skin=light]) #adm .qs-inc textarea{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .qs-row input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .qs-st.st-draft{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .qs-sum{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .qs-p{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .qs-p.on{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .qs-p em.m{color:#ac8ee0!important} html.pf-core:not([data-skin=light]) #adm .qs-p ul{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .qs-ch{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .qs-p.on .qs-ch,html.pf-core:not([data-skin=light]) #adm .qs-m.on .qs-ch{color:#fff!important} html.pf-core:not([data-skin=light]) #adm .qs-m{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .qs-m.on{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .qs-m em{color:#ac8ee0!important} html.pf-core:not([data-skin=light]) #adm .qs-sb{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .qs-sb.win{background:rgba(71,209,117,0.12)!important} html.pf-core:not([data-skin=light]) #adm .qs-sb.win.on{background:#22a05a!important;color:#fff!important} html.pf-core:not([data-skin=light]) #adm .qs-sb.win.on small{color:#e8fff0!important} html.pf-core:not([data-skin=light]) #adm .sx-team{border-color:#2a1f3d!important;background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sx-teamh{background:#1a1228!important;border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-teamh small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sx-compose{border-top-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sx-compose textarea{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-team>.sx-ideas2{background:#1a1228!important;border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-ideas2>span{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sx-tnote{background:rgba(255,181,25,0.12)!important} html.pf-core:not([data-skin=light]) #adm .sx-tnote small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .rv-i{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .rv-i.out{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .rv-out{color:#ffbd70!important} html.pf-core:not([data-skin=light]) #adm .rv-in{color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .cat-it input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cat-m textarea,html.pf-core:not([data-skin=light]) #adm .cat-m select,html.pf-core:not([data-skin=light]) #adm .cat-nm,html.pf-core:not([data-skin=light]) #adm .cat-ic{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cat-ex input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cat-pr{border-left-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .cat-pr.st-live{background:rgba(71,209,117,0.12)!important} html.pf-core:not([data-skin=light]) #adm .qs-revs button{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .qs-revs button.on{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .am-box{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .am-box.new{background:rgba(71,209,117,0.12)!important} html.pf-core:not([data-skin=light]) #adm .am-r.add{background:rgba(71,209,117,0.12)!important} html.pf-core:not([data-skin=light]) #adm .am-r.rem{background:rgba(234,56,46,0.14)!important} html.pf-core:not([data-skin=light]) #adm .am-r.chg{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .gc-chk{border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .gc-add textarea{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .gc-note{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .gc-note small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-mini i{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .gc-mini i.on{background:#22a05a!important} html.pf-core:not([data-skin=light]) #adm .gc-main .jr-bar{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .gc-rbar{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .gc-rl{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-grp{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-need li{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .gc-need li.due{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .gc-cp{border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .gc-cp small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-pb{border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .gc-pb input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .gc-pb span:last-child{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-chk small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-on{border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav{background:#1a1228!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav>button,html.pf-core:not([data-skin=light]) #adm .gc-grid .gc-off>button{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav button svg{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav button:hover{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav button.on{background:#24183a!important;color:#ac87e7!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav button.on svg{color:#7a3fe0!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .gc-tog{border-top-color:#2a1f3d!important;color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .gc-grid nav.cc-nav button:hover{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .gc-grid nav.cc-nav button.on{background:#24183a!important;color:#ac87e7!important} html.pf-core:not([data-skin=light]) #adm .gc-grid nav.cc-nav .gc-tog{border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .lock{border-color:#2a1f3d!important;color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sd-act .a-btn.pri,html.pf-core:not([data-skin=light]) #adm .cc-act .a-btn.pri{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .sx-team>.sx-ideas2{border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-team>.sx-ideas2{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sx-team>.cx-note{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sx-team{border-color:#2a1f3d!important;background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sx-teamh{background:#1a1228!important;border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-teamh small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sx-compose{border-top-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .sx-compose textarea{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-ideas2>span{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sx-micsel{border-color:#2a1f3d!important;background:#1a1228!important;color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sx-bld{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-up.sx-big b{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .sx-up.sx-big small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .cx-btn.sx-now{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .sx-log{border-color:#2a1f3d!important;background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sx-b span{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sx-b.ai{background:#1a1228!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .sx-chip{border-color:#2a1f3d!important;background:#1a1228!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .sx-chip:hover{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sx-mic{border-color:#2a1f3d!important;background:#1a1228!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .sx-mic-t small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sx-mic.on{border-color:#f0c4be!important;background:#221832!important} html.pf-core:not([data-skin=light]) #adm .sx-mic.on .sx-mic-i{background:linear-gradient(135deg,#d72f36,#f84248)!important} html.pf-core:not([data-skin=light]) #adm .sx-mic.on .sx-mic-t b{color:#e5898d!important} html.pf-core:not([data-skin=light]) #adm .cx-pill.b{background:rgba(68,143,211,0.14)!important;color:#88bde6!important} html.pf-core:not([data-skin=light]) #adm .cx-pill{background:#1b1229!important;color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .cx-pill.g{background:rgba(71,209,113,0.14)!important;color:#8ee0ad!important} html.pf-core:not([data-skin=light]) #adm .cx-pill.a{background:rgba(255,171,25,0.14)!important;color:#ffbd70!important} html.pf-core:not([data-skin=light]) #adm .cx-pill.r{background:rgba(241,60,39,0.14)!important;color:#e78f87!important} html.pf-core:not([data-skin=light]) #adm .cx-pill.v{background:rgba(104,57,223,0.14)!important;color:#a78ee0!important} html.pf-core:not([data-skin=light]) #adm .cx-btn{border-color:#2a1f3d!important;background:#1a1228!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .cx-btn:hover{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .cx-btn.pri{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .cx-code .cx-btn{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .a-sres{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-sres button{background:#1a1228!important;border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .a-sres button:hover{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .a-topbtn{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .a-tile.hot{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-tile.warn{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-btn{border-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-btn:hover{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .a-tblwrap{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-tbl th{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .a-tbl td{border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .a-tbl tr.click:hover td{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .a-f input,html.pf-core:not([data-skin=light]) #adm .a-f select,html.pf-core:not([data-skin=light]) #adm .a-f textarea{border-color:#2a1f3d!important;background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-li{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-modal .box{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-items td input{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .a-cal .d{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .a-gate{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .ar-btn{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .bill-tog .bt.on{color:#fff!important} html.pf-core:not([data-skin=light]) #adm .bill-tog .bt.on em{color:#fff!important} html.pf-core:not([data-skin=light]) #adm .bill-tog .bt.on em{background:rgba(255,255,255,.22)!important;color:#fff!important} html.pf-core:not([data-skin=light]) #adm .cu-row{background:#1a1228!important;border-left-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cu-who small,html.pf-core:not([data-skin=light]) #adm .cu-st small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .cu-nx{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .cu-mini i{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .cu-mini i.on{background:#22a05a!important} html.pf-core:not([data-skin=light]) #adm .cu-ring i{background:#1a1228!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .cu-in{border-color:#2a1f3d!important;background:#1a1228!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .cu-chips button{border-color:#2a1f3d!important;background:#1a1228!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .cu-chips button.on{background:#24183a!important;color:#fff!important;border-color:#16181d!important} html.pf-core:not([data-skin=light]) #adm .cu-fl{border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cu-ch{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .cu-flt small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .cu-arow{background:#1a1228!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cu-arow small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .cu-why{border-top-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .cu-tr{background:#221832!important} html.pf-core:not([data-skin=light]) #adm .cu-dl b{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .cu-dl b.on{color:#F7B267!important} html.pf-core:not([data-skin=light]) #adm .cu-tl{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bh-tg{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .bh-tg::after{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .bh-tg.on{background:#22a05a!important} html.pf-core:not([data-skin=light]) #adm .bh-mark{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .bs-nav li{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-nav li.on{color:#fff!important;background:rgba(195,72,19,.18)!important} html.pf-core:not([data-skin=light]) #adm .bs-hint{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-ai-note{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-bigmic-s{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-card input::placeholder,html.pf-core:not([data-skin=light]) #adm .bs-card textarea::placeholder{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-card .chips label:hover{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .bs-card .chips input:checked+label{color:#fff!important} html.pf-core:not([data-skin=light]) #adm .rv-row span{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .rv-row.miss em{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-up-l small{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-files li em{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-files li button{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .bs-saved{color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .chips input:checked+label{background:rgba(195,72,19,0.232)!important} html.pf-core:not([data-skin=light]) #adm .ct .chips label:hover{border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .ct .chips input:checked+label{color:#fff!important} html.pf-core:not([data-skin=light]) #adm .ct-btn{background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .cu-chips button.on,html.pf-core:not([data-skin=light]) #adm #cuRs button.on{background:#24183a!important;color:#fff!important;border-color:#16181d!important} html.pf-core:not([data-skin=light]) #adm td,html.pf-core:not([data-skin=light]) #adm th{border-bottom-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .pe-lk{background:#1a1228!important;border-color:#2a1f3d!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .pe-lk i{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .pe-lk i:after{background:#1a1228!important} html.pf-core:not([data-skin=light]) #adm .nb-sw span{background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm .nb-sw span:before{background:#1a1228!important} /* ===== v13j CORE ADMIN (arguta.ai/admin): the Academy Admin's frame, the one stylesheet's rules, dark centre by default. Only on the admin (html.pf-core, set by admin/index.php). The frame (header, left column, centre panel, Overview and Arguta) is styled by the shared html.nl rules, exactly as the Academy Admin; the rules here only undo the old admin's own sizes underneath them. The centre's dark colours sit under :not([data-skin=light]) so Light shows the centre light. */ html.pf-core,html.pf-core body{background:#0b0711!important} html.pf-core .blocks,html.pf-core .wipe,html.pf-core [class*="page-wipe"]{display:none!important} html.pf-core #adm{background:#0b0711!important;font-family:Geist,system-ui,-apple-system,"Segoe UI",sans-serif} html.pf-core:not([data-skin=light]) #adm{--ink:#f3eaff;--muted:#a99cc8;--line:#2a1f3d;--bg:#0b0711;--card:#1a1228;--nav:#140d1f;--green:#3ddc97;--greenbg:rgba(61,220,151,.14);--amber:#F7931A;--amberbg:rgba(247,147,26,.14);--red:#ff8a80;--redbg:rgba(229,72,77,.16);--vio:#b794ff;--viobg:rgba(139,92,246,.18);--grey:#c4b8e0;--greybg:rgba(255,255,255,.06);color:#f3eaff} /* the screen: one window high, as the Academy Admin. The header stays, the left column, the centre panel, the Overview and Arguta each scroll on their own (the old admin let the whole page scroll, so nothing had its own scroll bar) */ html.pf-core #adm{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:0!important;z-index:30;min-height:0;display:flex!important;flex-direction:column;overflow:hidden} html.pf-core #adm>header.top{flex:none} html.pf-core #adm>.a-body.shell{flex:1 1 auto!important;min-height:0!important;height:auto!important;overflow:hidden} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-core #adm>.a-body.shell>.main{overflow-y:auto;-webkit-overflow-scrolling:touch} html.pf-core #adm header.top .a-search{display:none!important}} @media (min-width:861px) and (hover:hover), (min-width:1401px){ html.pf-core #adm #side.a-nav{position:static!important;top:auto!important;height:auto!important;max-height:none!important;width:auto!important;transform:none!important;box-shadow:none!important;align-self:stretch!important;overflow-y:auto!important;padding:0!important;background:#140d1f!important;border-right:1px solid #2a1f3d!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}} /* phone: the master's drawer (the burger opens it) and Arguta's own button */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-core #adm #side.a-nav{position:fixed!important;top:0!important;bottom:0!important;left:0!important;height:auto!important;z-index:60!important;width:min(84vw,300px)!important;padding:0!important;background:#140d1f!important} html.pf-core #agPanel:not(.nldock){position:fixed!important} html.pf-core #adm #side.a-nav:not(.open){box-shadow:none!important}} /* left column items: the old admin forced its own sizes with !important; these put the Academy Admin's back */ html.pf-core #adm #side button.sp{display:flex!important;align-items:center!important;width:100%!important;gap:9px!important;border-radius:10px!important;text-align:left;cursor:pointer;white-space:nowrap} html.pf-core #adm #side button.sp svg{width:17px!important;height:17px!important} html.pf-core #adm #side button.sp .cnt{margin-left:auto!important;background:transparent!important;color:#F7931A!important;border:0!important;font:500 11px/13px Geist,system-ui,sans-serif!important;padding:0!important;border-radius:0!important;height:auto!important} html.pf-core #adm #side button.sp.spsub{padding-left:34px!important} html.pf-core #adm #side button.sp.spsub svg{width:15px!important;height:15px!important} html.pf-core #adm #side button.sp.nltool svg{display:none!important} html.pf-core #adm #side .a-pw{margin:12px!important;color:#a99cc8!important} html.pf-core #adm .nlscroll>main.a-main{max-width:2240px!important;width:100%;margin:0 auto!important;padding:36px 32px 60px!important;box-sizing:border-box;flex:none!important;min-width:0;background:transparent!important} html.pf-core #adm .nlover .nlob .nlempty{margin:16px;color:#a99cc8} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.pf-core #agPill{display:none!important}} /* the old admin's own text size (v12u) zoomed the centre to 1.1 and the menu and Arguta to 0.909. The Academy's A A A now sizes the whole screen, so those are set back to 1 and every size matches the Academy Admin exactly */ html.pf-core #adm :is(.a-main,.a-nav,.ag-panel,.ag-panel #agBig){zoom:1!important} html.pf-core .ag-text{display:none!important} /* Arguta's panel: the settings sheet and cog, as the Academy's widget draws them */ html.pf-core #agPanel .ag-sheet{position:absolute;inset:0;z-index:3;display:flex;align-items:flex-end;background:rgba(11,7,17,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)} html.pf-core #agPanel .ag-sheet[hidden]{display:none} html.pf-core #agPanel .ag-card{width:100%;margin:12px;padding:18px;border-radius:18px;background:rgba(30,20,46,.96);border:1px solid rgba(243,234,255,.18);font-size:14px;font-weight:300;line-height:1.45;max-height:calc(100% - 24px);overflow:auto;color:#f3eaff} html.pf-core #agPanel .ag-card h3{margin:0 0 8px;font-size:17px;font-weight:600} html.pf-core #agPanel .ag-card .ag-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-top:1px solid rgba(243,234,255,.1)} html.pf-core #agPanel .ag-card .ag-row small{display:block;color:#a99bbd;font-size:12.5px} html.pf-core #agPanel .ag-tg{flex:0 0 auto;position:relative;width:46px;height:26px;border-radius:99px;border:1px solid rgba(243,234,255,.25);background:rgba(11,7,17,.5);cursor:pointer;padding:0} html.pf-core #agPanel .ag-tg::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#a99bbd;transition:transform .2s,background .2s} html.pf-core #agPanel .ag-tg[aria-checked="true"]{background:#7a3ff0;border-color:#a35bff} html.pf-core #agPanel .ag-tg[aria-checked="true"]::after{transform:translateX(20px);background:#fff} html.pf-core #agPanel .ag-acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px} html.pf-core #agPanel .ag-acts button{min-height:42px;padding:0 16px;border-radius:999px;border:1px solid rgba(243,234,255,.2);background:rgba(11,7,17,.3);color:#f3eaff;font:inherit;font-size:14px;cursor:pointer} html.pf-core #agPanel .ag-acts button.pri{border:0;background:linear-gradient(135deg,#5b2bd6,#a35bff);color:#fff;font-weight:600} html.pf-core #agPanel .ag-gear{padding:0 10px} @media(max-width:600px){html.pf-core #agPanel .ag-wide{display:none}} html.pf-core #adm header.top .tsz button[data-ts=s]{font-size:11px!important} html.pf-core #adm header.top .tsz button[data-ts=m]{font-size:14px!important} html.pf-core #adm header.top .tsz button[data-ts=l]{font-size:17px!important} /* the Overview cards: the Academy's Overview card look (owner numbers, help desk, server status) */ html.pf-core .nlover .nlob>*+*{margin-top:12px!important} html.pf-core .nlover .nlob>.grid.nlk{margin:0} html.pf-core .nlover .nlob :is(.card.kpi,.osc)[data-v]{cursor:pointer} html.pf-core .nlover .nlob .card.kpi[data-v]:hover,html.pf-core .nlover .nlob .osc[data-v]:hover{border-color:#8b5cf6!important} html.pf-core .nlover .nlob .osc{display:block;padding:12px 14px;margin:0;background:#1a1228;border:1px solid #2a1f3d;border-radius:14px;color:#f3eaff;text-decoration:none} html.pf-core .nlover .nlob .dkc{border-left:3px solid #F7931A} html.pf-core .nlover .nlob .osgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))} html.pf-core .nlover .nlob .ost{display:flex;flex-direction:column;gap:2px;min-width:0} html.pf-core .nlover .nlob .ost span{overflow-wrap:anywhere} html.pf-core .nlover .nlob .osr{display:flex;justify-content:space-between;gap:8px;font-size:12px;padding-top:6px;border-top:1px solid #2a1f3d;margin-top:6px;color:#f3eaff;cursor:pointer} html.pf-core .nlover .nlob .osr span{min-width:0;overflow-wrap:anywhere} html.pf-core .nlover .nlob .osr b{color:#F7931A} html.pf-core .nlover .nlob .osl{font-size:11px;line-height:1.45;margin:6px 0 0} html.pf-core .nlover .nlob .sth{display:flex;gap:10px;align-items:center} html.pf-core .nlover .nlob .sth b{display:block;font:600 14px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff;margin:2px 0} html.pf-core .nlover .nlob .sth .osl{margin:0} html.pf-core .nlover .nlob .stl{display:inline-flex;flex-direction:column;gap:3px;padding:4px;border-radius:8px;background:#000;border:1px solid #2a1f3d;flex:none} html.pf-core .nlover .nlob .stl i{width:10px;height:10px;border-radius:50%;background:#2a2430} html.pf-core .nlover .nlob .stl i.on.r{background:#ff5a5a;box-shadow:0 0 8px #ff5a5a} html.pf-core .nlover .nlob .stl i.on.a{background:#F7931A;box-shadow:0 0 8px #F7931A} html.pf-core .nlover .nlob .stl i.on.g{background:#2fbf71;box-shadow:0 0 8px #2fbf71} html.pf-core .nlover .nlob .stdots{display:flex;flex-wrap:wrap;gap:4px 10px;margin-top:10px;font-size:11px;color:#a99cc8} html.pf-core .nlover .nlob .stdots span{display:inline-flex;align-items:center;gap:5px} html.pf-core .nlover .nlob .stdots i{width:7px;height:7px;border-radius:50%;background:#6b6280} html.pf-core .nlover .nlob .stdots i.g{background:#2fbf71}html.pf-core .nlover .nlob .stdots i.a{background:#F7931A}html.pf-core .nlover .nlob .stdots i.r{background:#ff5a5a} html.pf-core .nlover .nlob .nlasof{margin:0 2px;text-align:right} /* type: the App's */ html.pf-core:not([data-skin=light]) #adm :is(h1,h2,h3,h4){color:#f3eaff!important;font-family:Poppins,Geist,system-ui,sans-serif!important} html.pf-core:not([data-skin=light]) #adm :is(p,li,td,th,label,small,span){font-family:Geist,system-ui,sans-serif} /* cards and panels: the card standard */ html.pf-core:not([data-skin=light]) #adm :is(.a-card,.a-tile,.a-li,.a-tblwrap,.hx-card,.st-card,.cc-hero,.hl-grid,.cu-row,.cu-arow,.cu-in,.pk-a,.cc-row.gc-row,.who,.sd-det,.sd-sub,.sx-team,.sx-compose,.sx-ideas2,.fl-card,.fl-col,.camp-d,.camp-steps>div,.au-s,.fx,.hs-r,.ag-row,.hit,.lc){background:#1a1228!important;border-color:#2a1f3d!important;box-shadow:none!important;color:#f3eaff} html.pf-core:not([data-skin=light]) #adm :is(.a-card,.a-tile,.hx-card,.st-card,.pk-a,.fl-card,.camp-d,.au-s,.cu-row){border-radius:14px!important} html.pf-core:not([data-skin=light]) #adm .a-tile.hot{background:#24183a!important;border-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm .a-tile.warn{background:#1a1228!important;border-color:#F7931A!important} html.pf-core:not([data-skin=light]) #adm .st-bar{background:#140d1f!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm :is(.st-bar>span,.sx-teamh){color:#f3eaff!important;background:transparent!important} html.pf-core:not([data-skin=light]) #adm .sx-teamh{background:#140d1f!important} /* bars and tracks */ html.pf-core:not([data-skin=light]) #adm :is(.cu-mini>i,.gc-mini>i,.an-track,.gc-rbar,.bh-tg,.sd-tg>span,.cu-ring>i){background:#2a1f3d!important} /* bars and charts: the Academy Admin's purple, not orange. Red, amber and green stay where they show a state */ html.pf-core:not([data-skin=light]) #adm :is(.an-track div,.hx-sbar i,.gc-rbar i.r,.a-bar,.cu-bar2 em,.bs-bar i,.iv-meter i,.pe-lk.on i,.cu-mini i.cur,.cc-mini i.c):not([style*="background"]){background:linear-gradient(90deg,#c4a6ff,#7c3aed)!important} /* chips and small toggles */ html.pf-core:not([data-skin=light]) #adm :is(.sx-chip,.cu-chips>button,.sd-fmt>button,.fl-h>span,.sx-b.ai,.sx-mic.sx-bigmic,.pill){background:#1b1229!important;border:1px solid #2a1f3d!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm :is(.sx-chip,.cu-chips>button,.sd-fmt>button):is(.on,[aria-pressed="true"]){background:#24183a!important;border-color:#8b5cf6!important} /* buttons: the App's */ html.pf-core:not([data-skin=light]) #adm .a-btn{background:#1b1229!important;border:1px solid #2a1f3d!important;color:#f3eaff!important;border-radius:10px!important;font-family:Geist,system-ui,sans-serif!important;font-weight:400!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm .a-btn:hover{border-color:#a35bff!important;background:#24183a!important} html.pf-core:not([data-skin=light]) #adm :is(.a-btn.pri,.a-btn.dark){background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;font-weight:600!important} html.pf-core:not([data-skin=light]) #adm :is(.a-btn.pri,.a-btn.dark):hover{background:#6d28d9!important;border-color:#c4a8ff!important} html.pf-core:not([data-skin=light]) #adm .a-btn.red{color:#ff8a80!important} html.pf-core:not([data-skin=light]) #adm .fx-code .a-btn{background:#1b1229!important} /* tables */ html.pf-core:not([data-skin=light]) #adm .a-tbl th{background:#140d1f!important;color:#a99cc8!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .a-tbl td{border-color:#2a1f3d!important;color:#f3eaff} html.pf-core:not([data-skin=light]) #adm .a-tbl tr.click:hover td{background:#24183a!important} /* fields: the Business Brain field */ html.pf-core:not([data-skin=light]) #adm :is(input[type=text],input[type=email],input[type=tel],input[type=number],input[type=date],input[type=search],input[type=url],input[type=password],input:not([type]),select,textarea){background:#0f0a18!important;border:1px solid #2a1f3d!important;color:#f3eaff!important;border-radius:10px!important;font-family:Geist,system-ui,sans-serif!important} html.pf-core:not([data-skin=light]) #adm :is(input,select,textarea):focus{border-color:#8b5cf6!important;outline:none!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm :is(input,textarea)::placeholder{color:#a99cc8} /* dark text written for the old light look */ html.pf-core:not([data-skin=light]) #adm :is(.hx-nh2>b,.hs-r>em,.jr-ar,.cu-nx,.gc-rl>span,.jr-c>b,.jr-c>small,.bh-mark,.sx-mic-t>b,.sd-det>summary,#ag-head>button){color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm :is(.cu-nx,.gc-rl>span,.jr-c>small,.jr-ar){color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm .sd-det>summary{color:#b794ff!important} /* pop-ups, calendar, toast */ html.pf-core:not([data-skin=light]) #adm .a-modal{background:rgba(5,3,10,.7)!important} html.pf-core:not([data-skin=light]) #adm :is(.a-modal .box,.a-gate){background:#1a1228!important;border:1px solid #2a1f3d!important;color:#f3eaff!important;border-radius:14px!important} html.pf-core:not([data-skin=light]) #adm .a-cal .d{background:#1a1228!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .a-cal .ev.ev-p{background:#221832!important;color:#ffc983!important} html.pf-core:not([data-skin=light]) #adm .a-toast{background:#7c3aed!important;color:#fff!important} /* white panels written inline by the admin's scripts */ html.pf-core:not([data-skin=light]) #adm :is([style*="background:#fff"],[style*="background: #fff"],[style*="background:#FFF"],[style*="background:#ffffff"],[style*="background:#faf9fc"],[style*="background:#f7f6fa"],[style*="background:#f7f6f9"],[style*="background:#f3f2f5"],[style*="background:#f1f0f4"],[style*="background:#fafafa"],[style*="background:#f5f5f5"]){background:#1a1228!important;color:#f3eaff} html.pf-core:not([data-skin=light]) #adm :is([style*="color:#16181d"],[style*="color:#1d1b22"],[style*="color:#141414"],[style*="color:#2f2c35"],[style*="color:#333"],[style*="color:#111"],[style*="color:#000"]){color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm :is([style*="color:#66636d"],[style*="color:#8c8994"],[style*="color:#55525c"],[style*="color:#777"],[style*="color:#666"]){color:#a99cc8!important} html.pf-core:not([data-skin=light]) #adm :is([style*="border:1px solid #e4e2e8"],[style*="border:1px solid #ecebf0"],[style*="border-bottom:1px solid #f0eff3"],[style*="border:1px solid #eee"]){border-color:#2a1f3d!important} html.pf-core ::selection{background:rgba(139,92,246,.45)} html.pf-core #adm .nlbar .nldhint{font:400 12px Geist,system-ui,sans-serif;color:#a99cc8;margin-right:4px} html.pf-core #adm .nlbar .nldhint.bad{color:#ff8a80} html.pf-core #adm .nlbar .nlbb{display:flex;gap:8px;align-items:center;margin-left:auto} html.pf-core #adm .sd-up{border-color:#3a2d55!important} /* Light: the centre panel's own light look; the Overview cards light, as the Academy Admin's */ html.pf-core[data-skin=light] .nlover .nlob .osc{background:#fff!important;border-color:#e4e2e8!important;color:#1d1b22!important} html.pf-core[data-skin=light] .nlover .nlob :is(.osr,.sth b,.ost b,.osn){color:#1d1b22!important} html.pf-core[data-skin=light] .nlover .nlob .ost{background:#f6f3fa!important} html.pf-core[data-skin=light] .nlover .nlob .osr{border-color:#ecebf0!important} /* orange buttons written into the admin's scripts: the App's purple main button */ html.pf-core:not([data-skin=light]) #adm :is(button,a)[style*="#C34813"]{background:#7c3aed!important;color:#fff!important;border-color:#7c3aed!important} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-core #adm .nlscroll>main.a-main{padding-left:12px!important;padding-right:12px!important}} /* exact Academy Admin details measured side by side (v13j) */ html.pf-core #adm .nlbar{padding-right:11px!important} html.pf-core:not([data-skin=light]) #adm .nlover .card.kpi{background:#1a1228!important} html.pf-core #agPanel .ag-head{height:38px;min-height:38px} html.pf-core #agPanel .ag-tb{height:38px!important;min-height:38px;box-sizing:border-box;display:inline-flex!important;align-items:center;justify-content:center;gap:6px;padding:0 14px!important;border-radius:10px!important;border:1px solid rgba(243,234,255,.18)!important;background:rgba(11,7,17,.25)!important;color:#f3eaff!important;font:500 13px/18.9px Geist,system-ui,sans-serif!important} html.pf-core #agPanel .ag-tb.ag-gear{width:38px;padding:0!important} html.pf-core #agPanel #agChips .ag-chip{display:block!important} html.pf-core #agPanel #agStop[hidden]{display:none!important} html.pf-core #agPanel #agForm .ag-send:not(.ag-endbtn){display:block!important} /* no orange buttons or icons in the centre: stage labels, the current step and the page icon take the App's purple (orange stays for small labels and counts) */ html.pf-core:not([data-skin=light]) #adm .cu-pill[style*="#F7931A"]{background:#24183a!important;color:#f3eaff!important;box-shadow:inset 0 0 0 1px #8b5cf6} html.pf-core:not([data-skin=light]) #adm .jr-c.cur{background:#24183a!important;border-color:#8b5cf6!important;color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm .jr-c.cur i{background:#7c3aed!important;color:#fff!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-av,.hx-sav){background:linear-gradient(135deg,#5b2bd6,#a35bff)!important;color:#fff!important} /* boxes: the Studio card (Richard, 10 Nov: no grey-green tiles, no near-black boxes). The dark hero wrapper goes, so each box sits on the panel as its own card: #1a1228, a #2a1f3d line, 14px corners; tracks take the line colour */ html.pf-core:not([data-skin=light]) #adm .nlmain .hx{background:transparent!important;padding:0!important;border:0!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm :is(.hx-tile,.hx-card,.hx-sc,.jr-c,.cc-steps button,.b2-n,.brief2,.cu-dgrid,.st-card,#ag-slot>div,.nlmain .hx>div:not([class])){background:#1a1228!important;border:1px solid #2a1f3d!important;border-radius:14px!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm :is(.cu-dgrid,#ag-slot>div,.nlmain .hx>div:not([class])){padding:18px 20px!important} html.pf-core:not([data-skin=light]) #adm .nlmain .hx>:is(.cu-dgrid,div:not([class])){margin-top:14px!important} html.pf-core:not([data-skin=light]) #adm :is(.hx-sbar,.jr-bar,.cu-bar2>i,.cu-bar2 i){background:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm :is(.jr-c.cur,.cc-steps button.on){background:#24183a!important;border-color:#8b5cf6!important} /* a box inside a card: one step lighter, as the Academy home's brand boxes (card #1a1228, inner #1f172f, both with the #2a1f3d line) */ html.pf-core:not([data-skin=light]) #adm :is(.a-card,.cu-dgrid,.st-card) :is(.hl-grid,.a-tile,.a-li){background:#1f172f!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm .nlmain .hx>div:not([class])>div{background:#1f172f!important;border-color:#2a1f3d!important} html.pf-core:not([data-skin=light]) #adm :is([style*="background:#16181d"],[style*="background: #16181d"],[style*="background:#0b0711"],[style*="background: #0b0711"]):not(input,textarea,select,button){background:#1a1228!important;border:1px solid #2a1f3d!important} html.pf-core:not([data-skin=light]) #adm pre{background:#1f172f!important;border:1px solid #2a1f3d!important;color:#f3eaff!important} /* menu sections that fold (v13l): heading with a chevron; a closed section shows its heading and, when anything is waiting, the total in the App's small orange figure */ html.pf-core #adm #side .nlpnl[data-grp]:not([data-grp="tools"])>.nlph{cursor:pointer;display:flex!important;align-items:center;justify-content:space-between;gap:8px;user-select:none} html.pf-core #adm #side .nlpnl .nlfold{display:inline-flex;align-items:center;gap:8px;color:#a99cc8} html.pf-core #adm #side .nlpnl .nlfold svg{transition:transform .15s} html.pf-core #adm #side .nlpnl .nlft{font:500 11px/13px Geist,system-ui,sans-serif;font-style:normal;color:#F7931A;display:none} html.pf-core #adm #side .nlpnl.nlcol .nlft{display:inline} html.pf-core #adm #side .nlpnl.nlcol .nlfold svg{transform:rotate(-90deg)} html.pf-core #adm #side .nlpnl.nlcol>:not(.nlph){display:none!important} html.pf-core #adm #side .nlpnl.nlcol>.nlph{margin-bottom:0!important} html.pf-core #adm #side .nlpnl[data-grp]:not([data-grp="tools"])>.nlph:hover .nlfold{color:#f3eaff} /* Home: the Academy figures as number cards (v13l) */ html.pf-core #adm .nlmain .hx>.nlacad{padding:18px 20px!important} html.pf-core #adm .nlacad .nlacad-h{font:500 10.5px/1.4 Geist Mono,ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#a99cc8;margin:0 0 12px} html.pf-core #adm .nlacad .grid.k6{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:0} html.pf-core:not([data-skin=light]) #adm .nlacad .card.kpi{background:#1f172f!important;border:1px solid #2a1f3d!important;border-radius:14px!important;padding:12px 14px!important;margin:0!important} html.pf-core #adm .nlacad .card.kpi b{display:block;font:700 22px/1.2 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} html.pf-core #adm .nlacad .card.kpi span{display:block;font-size:12px;color:#a99cc8;margin-top:4px} html.pf-core #adm .nlacad .card.kpi.z b{opacity:.55} /* left column footer (v13l): the column is a flex column so the footer sits at the bottom even when the menu is short */ @media (min-width:861px) and (hover:hover), (min-width:1401px){html.pf-core #adm #side.a-nav{display:flex!important;flex-direction:column}} html.pf-core #adm #side .a-pw{display:none!important} /* ===== v13i END ===== */ /* ===== v15e START: Plans in 3 steps (Richard, 11 Nov 2026). The open step in full, the others as slim summary bars ===== */ :where(.doc) .flow{max-width:1180px;margin:8px auto 26px;display:grid;gap:12px} :where(.doc) .flow .flh{text-align:center;margin:6px 0 6px} :where(.doc) .flow .flh h2{margin:6px 0 0;font:600 var(--fs-h2,28px)/1.25 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .flow .flh h2 em{font-style:normal;color:var(--p-acc)} :where(.doc) .fst{background:var(--p-card);border:1px solid var(--p-line);border-radius:14px;box-shadow:var(--p-sh);overflow:hidden} :where(.doc) .fst.on{border-color:var(--p-vio);box-shadow:0 0 0 1px var(--p-vio)} :where(.doc) .fsh{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:12px;width:100%;padding:12px 16px;cursor:pointer;min-height:56px} :where(.doc) .fsh:focus-visible{outline:2px solid var(--p-acc);outline-offset:-2px} :where(.doc) .fsh i{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;font:700 14px/1 Poppins,Geist,system-ui,sans-serif;font-style:normal;background:var(--p-band);color:var(--p-b);border:1px solid var(--p-line)} :where(.doc) .fst.on .fsh i{background:var(--p-vio);color:#fff;border-color:var(--p-vio)} :where(.doc) .fst.done .fsh i{background:var(--p-ok);color:#06140d;border-color:var(--p-ok);font-size:0} :where(.doc) .fst.done .fsh i::before{content:"✓";font-size:15px} :where(.doc) .fst-t{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1} :where(.doc) .fst-t b{font:600 var(--fs-h4,17px)/1.3 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fsum{font:var(--fs-note,14px)/1.4 Geist,system-ui,sans-serif;color:var(--p-b);overflow:hidden;text-overflow:ellipsis} :where(.doc) .fsum b{color:var(--p-h);font-weight:600} :where(.doc) .fsum.warn{color:var(--p-lab);font-weight:600} :where(.doc) .fed{flex:none;font:600 var(--fs-note,14px)/1 Geist,system-ui,sans-serif;color:var(--p-acc)} :where(.doc) .fst.on .fed,:where(.doc) .fst:not(.done) .fed{display:none} :where(.doc) .fst.on .fsum{display:none} :where(.doc) .fsb{display:none;padding:6px 16px 18px} :where(.doc) .fst.on .fsb{display:block} :where(.doc) .fst.on .fsb .plw{margin-top:4px} :where(.doc) .pcx.pk-on{border-color:var(--p-ok);box-shadow:0 0 0 2px var(--p-ok)} :where(.doc) .fl{margin:0 0 6px;font:var(--fs-intro,16px)/1.5 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fl b{color:var(--p-h)} :where(.doc) .fl.fsm{font-size:var(--fs-note,14px);margin-bottom:14px} :where(.doc) .fcards{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px} @container doc (max-width:900px){:where(.doc) .fcards{grid-template-columns:repeat(3,minmax(0,1fr))}} @container doc (max-width:560px){:where(.doc) .fcards{grid-template-columns:1fr 1fr}} :where(.doc) .fcd{all:unset;box-sizing:border-box;display:flex;flex-direction:column;gap:4px;padding:14px;border:1px solid var(--p-line);border-radius:12px;background:var(--p-band);cursor:pointer;text-align:left;min-width:0} :where(.doc) .fcd:hover{border-color:var(--p-acc)} :where(.doc) .fcd:focus-visible{outline:2px solid var(--p-acc);outline-offset:2px} :where(.doc) .fcd b{font:600 var(--fs-note,15px)/1.3 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fcd .tp{font:700 22px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fcd .tj{font:var(--fs-cap,12px)/1.4 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fcd.pk-on{border-color:var(--p-ok);box-shadow:0 0 0 2px var(--p-ok)} :where(.doc) .fcd:disabled{opacity:.4;cursor:not-allowed} :where(.doc) .fcd.fno{border-style:dashed} :where(.doc) .fmore{margin:12px 0 0} :where(.doc) .fmore a{color:var(--p-acc)} :where(.doc) .fnx{display:flex;justify-content:flex-end;margin-top:14px} :where(.doc) .fnx .main{width:auto;min-width:220px} @container doc (max-width:560px){:where(.doc) .fnx .main{width:100%}} :where(.doc) .fbl{display:grid;gap:0;border:1px solid var(--p-line);border-radius:12px;overflow:hidden;margin:4px 0 10px} :where(.doc) .fbl>div{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid var(--p-line);font:var(--fs-note,15px)/1.4 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fbl>div b{color:var(--p-h);white-space:nowrap} :where(.doc) .fbl>.ftot{border-bottom:0;background:var(--p-band)} :where(.doc) .fbl>.ftot span,:where(.doc) .fbl>.ftot b{font:700 var(--fs-h4,17px)/1.3 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fok{display:grid;grid-template-columns:20px 1fr;gap:10px;margin:12px 0 4px;font:var(--fs-note,14px)/1.45 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fok a{color:var(--p-acc)} :where(.doc) .fok[hidden]{display:none} :where(.doc) .ferr{margin:6px 0 0;color:#fca5a5;font:var(--fs-note,14px)/1.4 Geist,system-ui,sans-serif;min-height:0} /* ===== v15e END ===== */ /* ===== v15f START: done steps as skinny cards, the order summary like a shop basket ===== */ :where(.doc) .fmini{display:none} :where(.doc) .fst.done:not(.on) .fsum{display:none} :where(.doc) .fst.done:not(.on) .fmini:not(:empty){display:grid;grid-template-columns:128px minmax(0,1.1fr) minmax(0,1fr) minmax(0,1.2fr) auto;align-items:center;gap:12px;margin-top:6px;padding:9px 12px;border:1px solid var(--p-line);border-radius:10px;background:var(--p-band);font:var(--fs-note,14px)/1.35 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fmt{font:600 var(--fs-cap,12px)/1.2 Geist,system-ui,sans-serif;color:var(--p-ok);white-space:nowrap} :where(.doc) .fmn{color:var(--p-h);font-weight:600} :where(.doc) .fmp{color:var(--p-h);white-space:nowrap;text-align:right} :where(.doc) .fst.done:not(.on) .fsh{align-items:flex-start} :where(.doc) .fst.done:not(.on) .fed{margin-top:4px} @container doc (max-width:700px){:where(.doc) .fst.done:not(.on) .fmini:not(:empty){grid-template-columns:1fr auto;gap:4px 10px}:where(.doc) .fmt{grid-column:1/-1}:where(.doc) .fma,:where(.doc) .fmb{grid-column:1;font-size:var(--fs-cap,12px)}:where(.doc) .fmn{grid-column:1}:where(.doc) .fmp{grid-column:2;grid-row:2}} :where(.doc) .fbl>.fbh{background:var(--p-band);font:600 var(--fs-cap,12px)/1.2 Geist,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--p-lab)} :where(.doc) .fbl>div>span{display:flex;flex-direction:column;gap:2px;min-width:0} :where(.doc) .fbl .fbn{color:var(--p-h);font-weight:600;white-space:normal} :where(.doc) .fbl small{font-size:var(--fs-cap,12px);color:var(--p-b)} /* ===== v15f END ===== */ /* ===== v15g START: Academy step 1, the Lifetime Kit and VIP as two slim cards under the four plans ===== */ :where(.doc) .pcalt{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:14px} @container doc (max-width:900px){:where(.doc) .pcalt{grid-template-columns:1fr}} :where(.doc) .pcx.pwide{flex-direction:row;align-items:center;justify-content:space-between;gap:16px;padding:22px 16px 16px} :where(.doc) .pcx.pwide .pw1{display:flex;flex-direction:column;gap:6px;min-width:0} :where(.doc) .pcx.pwide .pw1 .pt{border-bottom:0;padding-bottom:0} :where(.doc) .pcx.pwide .pw2{display:flex;flex-direction:column;align-items:flex-end;gap:8px;flex:none;text-align:right} :where(.doc) .pcx.pwide .pp{font-size:24px;margin:0} :where(.doc) .pcx.pwide button{width:auto;min-width:200px;margin-top:0} @container doc (max-width:560px){:where(.doc) .pcx.pwide{flex-direction:column;align-items:stretch}:where(.doc) .pcx.pwide .pw2{align-items:stretch;text-align:left}:where(.doc) .pcx.pwide button{width:100%}} /* ===== v15g END ===== */ /* ===== v15h START: Academy slim cards with full detail; the Lifetime Kit in gold; releasing soon plain (Richard, 11 Nov 2026) ===== */ :where(.doc) .pcx.pwide{flex-direction:column;align-items:stretch;justify-content:flex-start;gap:10px;padding:22px 18px 16px} :where(.doc) .pcx.pwide .pwh{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--p-line)} :where(.doc) .pcx.pwide .pw2 .po{margin:0;min-height:0} :where(.doc) .pcx.pwide .tk{margin:4px 0 6px} :where(.doc) .pcx.pwide .pwb{display:flex;justify-content:flex-end;margin-top:auto} :where(.doc) .pcx.pwide .pwb button{width:auto;min-width:220px} @container doc (max-width:560px){:where(.doc) .pcx.pwide .pwh{flex-direction:column}:where(.doc) .pcx.pwide .pw2{align-items:flex-start;text-align:left}:where(.doc) .pcx.pwide .pwb button{width:100%}} :where(.doc) .pcx.gold{border:1.5px dashed var(--p-lab);box-shadow:0 0 0 1px color-mix(in srgb,var(--p-lab) 25%,transparent);background:linear-gradient(135deg,color-mix(in srgb,var(--p-lab) 18%,var(--p-card)),var(--p-card) 65%)} :where(.doc) .pcx.gold .tag{background:var(--p-lab);color:#1b0f02} :where(.doc) .pcx.gold .pp{color:var(--p-h)} :where(.doc) .pcx.rs,:where(.doc) .pcx.pwide.rs{background:var(--p-card);border:1.5px dashed var(--p-line);box-shadow:none} :where(.doc) .pcx .tag.rs{color:var(--p-b);border-color:var(--p-line)} /* ===== v15h END ===== */ :where(.doc) .pcx.pwide .pw1{flex:1 1 auto;min-width:0} :where(.doc) .pcx.pwide .pw2{flex:0 1 auto;max-width:55%} :where(.doc) .pcx.pwide .pw2 .lpl{align-self:flex-end} :where(.doc) .pcx.pwide .pwn{margin:0;font:var(--fs-cap,12px)/1.45 Geist,system-ui,sans-serif;color:var(--p-b)} /* ===== v15h Studio: where the crew runs (App or own Claude), a Studio plan that needs a bigger crew ===== */ :where(.doc) .fsrc{display:flex;flex-wrap:wrap;gap:4px;width:max-content;max-width:100%;margin:6px auto 16px;padding:4px;border:1px solid var(--p-line);border-radius:999px;background:var(--p-card)} :where(.doc) .fsrc button{all:unset;cursor:pointer;font:600 var(--fs-note,14px)/1 Geist,system-ui,sans-serif;color:var(--p-b);padding:10px 16px;border-radius:999px} :where(.doc) .fsrc button:focus-visible{outline:2px solid var(--p-acc)} :where(.doc) .flow[data-src="app"] .fsrc [data-src="app"],:where(.doc) .flow[data-src="academy"] .fsrc [data-src="academy"]{background:var(--p-vio);color:#fff} :where(.doc) .flow[data-src="app"] .src-academy,:where(.doc) .flow[data-src="academy"] .src-app{display:none} :where(.doc) .fwarn{margin:0 0 12px;padding:12px 14px;border:1px solid var(--p-lab);border-radius:10px;background:color-mix(in srgb,var(--p-lab) 10%,var(--p-card));font:var(--fs-note,14px)/1.45 Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .fwarn[hidden]{display:none} :where(.doc) .fown{color:var(--p-ok)} :where(.doc) .fown b{color:var(--p-h)} :where(.doc) .fcards.fc3{grid-template-columns:repeat(3,minmax(0,1fr));margin-bottom:10px} @container doc (max-width:560px){:where(.doc) .fcards.fc3{grid-template-columns:1fr}} :where(.doc) .fcd .tp small{font:500 var(--fs-cap,12px)/1 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fcd .fneed{color:var(--p-lab);font-weight:600} :where(.doc) .fnote2{margin:0 0 6px;padding:10px 12px;border-left:3px solid var(--p-vio);background:var(--p-band);border-radius:6px} /* ===== v15h END ===== */ /* ===== v15i START (Richard, 11 Nov 2026): more definition on cards, pills and steps on all three; releasing soon keeps its orange dashed line, no wash ===== */ :where(.doc) .pcx,:where(.doc) .fst,:where(.doc) .fcd,:where(.doc) .fbl,:where(.doc) .fmini{border-color:color-mix(in srgb,var(--p-acc) 32%,var(--p-line))} :where(.doc) .pcx{border-width:1.5px} :where(.doc) .bill,:where(.doc) .fsrc{border:1.5px solid color-mix(in srgb,var(--p-acc) 40%,var(--p-line))} :where(.doc) .bill button:not(.on),:where(.doc) .fsrc button{color:var(--p-h)} :where(.doc) .pcx.rs,:where(.doc) .pcx.pwide.rs{background:var(--p-card);border:1.5px dashed color-mix(in srgb,var(--p-lab) 75%,transparent);box-shadow:none} :where(.doc) .pcx .tag.rs{color:var(--p-lab);border-color:color-mix(in srgb,var(--p-lab) 70%,transparent)} :where(.doc) .pcx.gold{border:1.5px dashed var(--p-lab)} :where(.doc) .pcx.hi{border-color:var(--p-vio)} :where(.doc) .pcx.pk-on,:where(.doc) .fcd.pk-on{border-color:var(--p-ok)} /* ===== v15i END ===== */ :where(.doc) .fwhy{margin:0 0 12px;padding:12px 14px;border:1.5px solid color-mix(in srgb,var(--p-acc) 40%,var(--p-line));border-radius:10px;background:var(--p-band);font:var(--fs-note,14px)/1.5 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fwhy b{color:var(--p-h)} /* v15j (Richard, 11 Nov 2026): the Academy checkout sheet is a solid panel in front of everything, Arguta's column included */ html.pf-acad .sheet{z-index:2147483000!important;background:rgba(5,3,10,.72)!important;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)} html.pf-acad .sheet>.sin{position:relative;z-index:1;background:#140e20!important;opacity:1!important;border-left:1.5px solid color-mix(in srgb,#b794ff 40%,#2e2245)!important;box-shadow:-24px 0 60px rgba(0,0,0,.6)} html.pf-acad[data-skin="light"] .sheet>.sin{background:#fff!important} /* v15n: the Your plan box's main button is purple everywhere (Studio's own button style was winning) */ :where(.doc) .fplan .acb button.main,:where(.doc) .fplan .acb button.cmain{background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;font-weight:600!important} :where(.doc) .fwhy p{margin:0} :where(.doc) .fwhy p+p{margin-top:12px} :where(.doc) .fwhy .fun{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px} :where(.doc) .fwhy .fun li{padding:5px 10px;border:1px solid color-mix(in srgb,var(--p-acc) 40%,var(--p-line));border-radius:999px;background:var(--p-card);color:var(--p-h);font:500 var(--fs-cap,12.5px)/1.2 Geist,system-ui,sans-serif} :where(.doc) .fwhy .fun li::before{content:"✓ ";color:var(--p-ok);font-weight:700} /* v15q: room between the four plan cards and the two slim cards under them */ :where(.doc) .pcalt{margin-top:28px} /* v15s (Richard, 11 Nov 2026): the agree-to-terms box in step 3, bigger and easy to see */ :where(.doc) .fok{grid-template-columns:26px 1fr;align-items:center;margin:14px 0 6px;padding:12px 14px;border:1.5px solid color-mix(in srgb,var(--p-acc) 45%,var(--p-line));border-radius:10px;background:var(--p-band);font:500 var(--fs-intro,15px)/1.45 Geist,system-ui,sans-serif;color:var(--p-h);cursor:pointer} :where(.doc) .fok input{width:22px;height:22px;margin:0;accent-color:#7c3aed;cursor:pointer} :where(.doc) .fok:has(input:checked){border-color:var(--p-ok)} /* v15t: the terms box at a normal text size, the tick box a touch bigger */ :where(.doc) .fok{grid-template-columns:22px 1fr;margin:12px 0 6px;padding:9px 12px;border-width:1px;font:var(--fs-note,14px)/1.45 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .fok input{width:18px;height:18px} :where(.doc) .ferr:not(:empty){margin-top:8px;padding:8px 12px;border:1px solid #fca5a5;border-radius:8px;background:rgba(248,113,113,.08)} /* v15v (Richard, 11 Nov 2026): the checkout panel, the same on the App, Studio and the Academy. Solid, on top of everything, slides in from the right */ .argsheet{position:fixed;inset:0;z-index:2147483000;display:flex;justify-content:flex-end;background:rgba(5,3,10,.72);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)} .argsheet .argsin{position:relative;width:min(100%,440px);height:100%;overflow-y:auto;background:#140e20;border-left:1.5px solid color-mix(in srgb,#b794ff 40%,#2e2245);box-shadow:-24px 0 60px rgba(0,0,0,.6);padding:20px;padding-top:calc(20px + env(safe-area-inset-top,0px));color:#f3eaff;font:14px/1.5 Geist,system-ui,sans-serif;display:flex;flex-direction:column;gap:12px;animation:argin .22s ease-out} @keyframes argin{from{transform:translateX(40px);opacity:.4}to{transform:none;opacity:1}} @media (prefers-reduced-motion:reduce){.argsheet .argsin{animation:none}} .argsheet .argx{position:absolute;top:14px;right:14px;width:32px;height:32px;border-radius:8px;border:1px solid #2e2245;background:#1b1329;color:#f3eaff;cursor:pointer} .argsheet .argk{font:500 11px/1 "Geist Mono",ui-monospace,monospace;letter-spacing:.14em;text-transform:uppercase;color:#F7931A} .argsheet h2{margin:0;font:700 22px/1.25 Poppins,Geist,system-ui,sans-serif;color:#f3eaff;padding-right:40px} .argsheet .fbl{display:grid;border:1px solid color-mix(in srgb,#b794ff 32%,#2e2245);border-radius:12px;overflow:hidden} .argsheet .fbl>div{display:flex;justify-content:space-between;gap:12px;padding:10px 12px;border-bottom:1px solid #2e2245;color:#b9addb} .argsheet .fbl>div>span{display:flex;flex-direction:column;gap:2px;min-width:0} .argsheet .fbl .fbn,.argsheet .fbl>div>b{color:#f3eaff;font-weight:600} .argsheet .fbl small{font-size:12px;color:#b9addb} .argsheet .fbl>.fbh{background:#1b1329;font:600 11px/1.2 Geist,system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#F7931A} .argsheet .fbl>.ftot{border-bottom:0;background:#1b1329}.argsheet .fbl>.ftot span,.argsheet .fbl>.ftot b{font:700 16px/1.3 Poppins,Geist,system-ui,sans-serif;color:#f3eaff} .argsheet .note,.argsheet .fnote2,.argsheet .fown{margin:0;font-size:13px;color:#b9addb} .argsheet .argtick{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;padding:10px 12px;border:1px solid color-mix(in srgb,#b794ff 40%,#2e2245);border-radius:10px;background:#1b1329;cursor:pointer;color:#d9cff0;font-size:13.5px} .argsheet .argtick input{width:18px;height:18px;margin:2px 0 0;accent-color:#7c3aed} .argsheet .argtick a{color:#c4a8ff} .argsheet .argerr:empty{display:none}.argsheet .argerr{margin:0;padding:8px 12px;border:1px solid #fca5a5;border-radius:8px;background:rgba(248,113,113,.08);color:#fca5a5} .argsheet .arggo{min-height:44px;border-radius:10px;border:1px solid #7c3aed;background:#7c3aed;color:#fff;font:600 15px Geist,system-ui,sans-serif;cursor:pointer} .argsheet .arggo:disabled{opacity:.55;cursor:not-allowed} .argsheet .argsm{margin:0;font-size:12px;color:#8d80ad} html.argsheet-open,html.argsheet-open body{overflow:hidden} /* v15v (Richard, 11 Nov 2026): a chosen card or tile is purple, as before, not green */ :where(.doc) .pcx.pk-on,:where(.doc) .fcd.pk-on{border-color:var(--p-vio)!important;box-shadow:0 0 0 1px var(--p-vio)!important} /* v15w (Richard, 11 Nov 2026): releasing-soon cards (Elite, VIP) have no wash; the gold is the Lifetime Kit's alone */ :where(.doc) .pcx.rs,:where(.doc) .pcx.pwide.rs,:where(.doc) .soonbox .pcx.rs{background:var(--p-card)!important} /* v15x: headroom at the top of the checkout panel; the 12-month saving */ .argsheet .argsin{padding-top:calc(30px + env(safe-area-inset-top,0px));gap:14px} .argsheet .argk{margin-top:4px} .argsheet .argup{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1.5px dashed #F7931A;border-radius:10px;background:linear-gradient(135deg,rgba(247,147,26,.14),#140e20 70%)} .argsheet .argup b{display:block;color:#f3eaff;font-size:14.5px} .argsheet .argup small{display:block;margin-top:2px;color:#b9addb;font-size:12.5px;line-height:1.4} .argsheet .argyr{flex:none;min-height:38px;padding:8px 12px;border-radius:10px;border:1px solid #7c3aed;background:#1b1329;color:#f3eaff;font:600 13px Geist,system-ui,sans-serif;cursor:pointer} .argsheet .argyr:hover{background:#7c3aed} /* v15y: the panel's small notes look the same on all three (the Academy's own note box was showing) */ .argsheet .note,.argsheet p.note{border:0!important;padding:0!important;background:none!important;box-shadow:none!important;margin:0!important;font-size:13px!important;color:#b9addb!important} /* v15z: the currency switch, beside the AAA text size, the same pill on all three */ .curs{display:inline-flex;align-items:center;gap:2px;padding:2px;margin-right:6px;border:1px solid #2e2245;border-radius:999px;background:#140e20;flex:none} .curs button{all:unset;cursor:pointer;padding:5px 9px;border-radius:999px;font:600 11.5px/1 Geist,system-ui,sans-serif;color:#b9addb;white-space:nowrap} .curs button.on{background:#7c3aed;color:#fff} .curs button:focus-visible{outline:2px solid #c4a8ff} html[data-skin="light"] .curs,.lite .curs{background:#fff;border-color:#e9e4ef} @media (max-width:560px){.curs button{padding:5px 7px;font-size:11px}} /* v15z: the tick in a finished step sits in the middle of its green circle */ :where(.doc) .fst.done .fsh i{display:grid;place-items:center;line-height:1} :where(.doc) .fst.done .fsh i::before{display:block;line-height:1;font-size:15px;transform:translateY(.5px)} /* v16a: Bitcoin in the checkout panel */ .argsheet .argbtc{display:grid;gap:8px;padding:12px 14px;border:1px solid rgba(247,147,26,.55);border-radius:10px;background:#1b1329} .argsheet .argbtc b{color:#F7931A;font-size:14px} .argsheet .argbtc p{margin:0;font-size:12.5px;line-height:1.45;color:#b9addb} /* v16h: the course checkout: who the course is for, in our purple, not the old turquoise */ .argsheet .argcl{display:grid;gap:6px;padding:12px 14px;border:1px solid color-mix(in srgb,#b794ff 40%,#2e2245);border-radius:10px;background:#1b1329} .argsheet .argcl b{color:#f3eaff;font-size:14px} .argsheet .argcl p{margin:0;font-size:12.5px;line-height:1.45;color:#b9addb} .argsheet .argcl a{color:#c4a8ff} .argsheet .argbtcgo{min-height:40px;border-radius:10px;border:1px solid #F7931A;background:transparent;color:#F7931A;font:600 14px Geist,system-ui,sans-serif;cursor:pointer} .argsheet .argbtcgo:hover:not(:disabled){background:#F7931A;color:#16101c} .argsheet .argbtcgo:disabled{opacity:.55;cursor:not-allowed} .argsheet .argbtcn{margin:0;font-size:12.5px;color:#b9addb} /* v16c: the step tick is drawn, not a font character, so it sits dead centre in its green circle in every font */ :where(.doc) .fst.done .fsh i{position:relative} :where(.doc) .fst.done .fsh i::before{content:""!important;position:absolute;left:50%;top:50%;width:6px;height:11px;border:solid #06140d;border-width:0 2.5px 2.5px 0;transform:translate(-50%,-62%) rotate(45deg)!important;font-size:0!important} /* v16e: back to monthly from the checkout panel */ .argsheet .argmo{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;border:1px solid #2e2245;border-radius:10px;font-size:13px;color:#b9addb} .argsheet .argmob{all:unset;cursor:pointer;color:#c4a8ff;font-weight:600;text-decoration:underline;text-underline-offset:3px} .argsheet .argmob:focus-visible{outline:2px solid #c4a8ff} /* v16f (Richard, 11 Nov 2026): room above the Your plan box wherever it follows other content (App feed, Studio feed, Academy feed) */ :where(.doc) * + .fplan,.din * + .fplan,.snin * + .fplan{margin-top:36px!important} .fplan{margin-bottom:28px} /* v16j (Richard, 11 Nov 2026): course cards on the achievement board: squarer, roomier, one line about the course, the same facts on every card */ :where(html.pf-acad) .grid>.crcard{min-height:260px;padding:18px 18px 0!important;gap:10px!important} :where(html.pf-acad) .grid>.crcard .crfoot{margin:auto -18px 0;padding:11px 18px} :where(html.pf-acad) .crcard .crsum{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px;line-height:1.5;color:var(--mute,#b9addb)} :where(html.pf-acad) .crcard .crmeta{margin-top:auto;font-size:12.5px} :where(html.pf-acad) .crcard .crbarx{display:block;height:4px;border-radius:4px;background:rgba(183,148,255,.18);overflow:hidden;margin-bottom:12px} :where(html.pf-acad) .crcard .crbarx i{display:block;height:100%;background:#7c3aed} :where(html.pf-acad) .crcard .crmeta+.crfoot{margin-top:12px} html.nl #center.nlsk .grid:has(> .crcard),:where(html.pf-acad) .grid:has(> .crcard){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))!important;gap:14px!important} :where(html.pf-acad) .grid>.crcard .crcover{align-items:flex-start} /* v16u (Richard, 11 Nov 2026): the Academy page menu shows only on Intro pages and Plans, the same as the App and Studio */ html.nl:not(.nlintro) .nlsub{display:none!important} /* v16v (Richard, 11 Nov 2026): the Account in three parts (account-view.js), the same on the App, the Academy and Studio. Built from the Plans page pieces (.pcx cards, .tops tiles, .bill switch, the .argsheet panel) and the existing tokens. */ :where(.doc) .acur{margin:16px auto 0} :where(.doc) .acurl{margin-top:12px} :where(.doc) .acs .acmsg{margin:0 0 16px;font-weight:600} .doc .acs h3.ach3{margin:40px 0 0;font:600 var(--fs-h3)/1.3 Poppins,Geist,system-ui,sans-serif;color:var(--p-h);text-align:center} .doc .acs h3.ach3+.note{margin-top:4px} :where(.doc) .acone{display:grid;margin-top:var(--sp-head)} :where(.doc) .acone+.pcx,:where(.doc) .acone+.acoth{margin-top:16px} :where(.doc) .pcx.acpc{padding:24px 20px 18px;gap:10px} :where(.doc) .pcx .ack2{font:600 var(--fs-label)/1.2 Geist,system-ui,sans-serif;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-b)} :where(.doc) .pcx.acpc .pn{font-size:var(--fs-h3)} :where(.doc) .pcx.acpc .po,:where(.doc) .pcx.acpot .po{min-height:0;font-size:var(--fs-note)} :where(.doc) .acbtns{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px} :where(.doc) .pcx .acbtns button,:where(.doc) .acbtns button{width:auto;min-height:44px;padding:0 18px;border-radius:10px;cursor:pointer} :where(.doc) .acbtns button:disabled{opacity:.55;cursor:not-allowed} :where(.doc) .acoth{display:grid;gap:8px;margin-top:16px} :where(.doc) .acothk{font:600 var(--fs-label)/1.2 Geist,system-ui,sans-serif;letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--p-b)} :where(.doc) .acsm{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:12px 14px;background:var(--p-card);border:1px solid var(--p-line);border-radius:12px} :where(.doc) .acsmn{display:flex;flex-direction:column;gap:2px;min-width:0} :where(.doc) .acsmn small{font:var(--fs-cap)/1.4 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acsmn b{font:600 var(--fs-body)/1.35 Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .acsm .acbtns{margin-top:0} :where(.doc) .acsm .acbtns :is(button,a.ghostb){min-height:36px;padding:0 14px;font-size:var(--fs-small)} :where(.doc) .pcx.acpot{margin-top:16px} :where(.doc) .acpot .acbar{margin:4px 0} :where(.doc) .acbill{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:var(--sp-head)} @container doc (max-width:620px){:where(.doc) .acbill{grid-template-columns:1fr}} :where(.doc) .acbill .pcx p{margin:0;font:var(--fs-note)/var(--lh-body) Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acbig{font:700 30px/1.1 Poppins,Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .aclines{list-style:none;margin:0;padding:0;display:grid;gap:8px} :where(.doc) .aclines li{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font:var(--fs-note)/1.45 Geist,system-ui,sans-serif;color:var(--p-b);padding-bottom:8px;border-bottom:1px solid var(--p-line)} :where(.doc) .aclines li:last-child{border-bottom:0;padding-bottom:0} :where(.doc) .aclines b{color:var(--p-h);font-weight:600} :where(.doc) .aclines.acref{margin-top:16px} :where(.doc) .acrow{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px;padding:14px 16px;background:var(--p-card);border:1px solid var(--p-line);border-radius:12px} :where(.doc) .acrow>span{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1 1 260px} :where(.doc) .acrow b{font:600 var(--fs-body)/1.35 Geist,system-ui,sans-serif;color:var(--p-h)} :where(.doc) .acrow small{font:var(--fs-note)/1.45 Geist,system-ui,sans-serif;color:var(--p-b)} :where(.doc) .acrow .ghostb{cursor:pointer} :where(.doc) .accrs{margin-top:14px} :where(.doc) .accrs .pn{font-size:var(--fs-body)} :where(.doc) .accrs .po{min-height:0;font-size:var(--fs-note)} :where(.doc) table.cmp.acinv{margin-top:14px} :where(.doc) table.cmp.acinv td.acact{text-align:right} :where(.doc) table.cmp.acinv td.acact .ghostb{min-height:34px;padding:0 12px;font-size:var(--fs-small)} @container doc (max-width:640px){:where(.doc) table.cmp.acinv{display:table}} @container doc (max-width:560px){:where(.doc) table.cmp.acinv th:nth-child(2),:where(.doc) table.cmp.acinv td:nth-child(2){display:none}} :where(.doc) .acdet>div:not(.acbtns){display:flex;justify-content:space-between;gap:12px;padding-bottom:8px;border-bottom:1px solid var(--p-line);font:var(--fs-note)/1.45 Geist,system-ui,sans-serif} :where(.doc) .acdet>div>span{color:var(--p-b)} :where(.doc) .acdet>div>b{color:var(--p-h);font-weight:600;text-align:right;overflow-wrap:anywhere;min-width:0} :where(.doc) .acalso a.ghostb{justify-content:center} .argsheet .acreason{display:grid;gap:6px;font-size:13px;color:#d9cff0} .argsheet .acreason textarea{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid #2e2245;border-radius:10px;background:#1b1329;color:#f3eaff;font:14px/1.45 Geist,system-ui,sans-serif;resize:vertical} .argsheet .acreason textarea:focus{outline:none;border-color:#7c3aed} .argsheet .ackeep{min-height:40px;border-radius:10px;border:1px solid #2e2245;background:transparent;color:#f3eaff;font:600 14px Geist,system-ui,sans-serif;cursor:pointer} .argsheet .ackeep:hover{border-color:#7c3aed} .argsheet.acsheet .fbl>div>b{white-space:nowrap} /* v16z (Richard, 11 Nov 2026): Account spacing and Your details. More room between blocks, 44px buttons, Email settings and Close my account the same on all three */ :where(.doc) .acone+.acoth{margin-top:40px} :where(.doc) .acoth{gap:12px} :where(.doc) .acothk{margin-bottom:2px} :where(.doc) .acs .acoth+.note{margin-top:24px} :where(.doc) .acsm{padding:14px 16px} :where(.doc) .acsm .acbtns :is(button,a.ghostb){min-height:44px;padding:0 16px} :where(.doc) .acs .acone+.pcx.acpot{margin-top:24px} .doc .acs h3.ach3{margin-top:48px} :where(.doc) .acbill+.acbill{margin-top:16px} :where(.doc) .acmc .pcx{gap:12px} :where(.doc) .aclist{display:grid;gap:8px} :where(.doc) .aclist .acsm{background:transparent} :where(.doc) .acsm .actg{min-width:72px} :where(.doc) .acclose{align-self:start;border-color:color-mix(in srgb,#ff7878 40%,var(--p-line))} :where(.doc) .acbtns .acdanger{color:#ffb4b4;border-color:color-mix(in srgb,#ff7878 55%,transparent)} .argsheet .acdel input{width:100%;box-sizing:border-box;min-height:44px;padding:10px 12px;border:1px solid rgba(255,120,120,.5);border-radius:10px;background:#1b1329;color:#f3eaff;font:16px/1.3 Geist,system-ui,sans-serif} .argsheet .acdel input:focus{outline:none;border-color:#7c3aed} .argsheet .acdel{margin-top:14px} :where(.doc) .acbill.acmc{grid-template-columns:1fr} :where(.doc) .aclist .acsm{flex-wrap:nowrap} :where(.doc) .aclist .acsmn{flex:1 1 auto} :where(.doc) .aclist .acsm .acbtns{flex:none} /* v16z: on a phone the Account has the App's 16px side gutter on all three */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){:where(.doc) .din.wide:has(#acp1){padding-left:16px;padding-right:16px} html.nl #center > .acmount{margin-left:-14px!important;margin-right:-14px!important;width:auto!important}} /* v17a dark mode check (11 Nov 2026): one top bar on all three. The tabs sit in the flow, centred in the space left, so the currency switch and the right-hand buttons never run over them. */ @media (min-width:1000px) and (max-width:1799px) and (hover:hover), (min-width:1401px) and (max-width:1799px){ /* v17f (Richard): on wide screens the tabs stay centred on the page, as before */ html:is(.pf-app,.pf-studio) header.top > .devs,html.pf-acad.nl header.top > nav.tabs{position:static!important;transform:none!important;margin:0 auto!important;flex:none} } /* v17a: the second bar never lets the page menu run under the buttons on the right; Light page stays on one line */ html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar){grid-template-columns:minmax(0,max-content) minmax(0,1fr) auto!important} html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar) > :first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap} html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar) > .sub{min-width:0} :is(.dtool,.snbar) .dbtn button,.nlbar .nlbb button{white-space:nowrap} /* owner Preview as (comes out at the switch-on): no label and a narrower box, so the page menu keeps its room */ :is(.dtool,.snbar,.nlbar) .pvas > span{display:none} :is(.dtool,.snbar,.nlbar) .pvas select{max-width:150px} html.pf-studio .snbar > .sub{justify-content:safe center} /* v17a: Your agents download tiles on the card shade, not a grey-green or brown tint; the green or amber edge and words still show the state */ html.nl.pf-acad .dlbox:not([data-skin="light"] *):not(.lite *):not(.lt *){background:#221832} /* v17a: when a pinned side panel leaves the centre narrow, the small breadcrumb steps aside so the buttons never sit on it */ html:is(.pf-app,.pf-studio) :is(#page,.stool){container-type:inline-size} @container (max-width:560px){:is(.dtool.hs,.snbar) > .by{display:none!important}} /* v17b dark mode completion (11 Nov 2026): no orange boxes or orange buttons in content (Richard's rule: orange only as small highlighters). Cards that ask for an action keep their glow, in the brand violet. Dark look only; Light mode is rebuilt later. */ :is(.fdo,.card.drow,.mustdo,.acnx.cx-todo,.acag,.card.plan,.card.soonc,.card.dkc):not(.lite *):not(.lt *):not([data-skin="light"] *){border-color:#8b5cf6!important;box-shadow:0 0 0 1px rgba(139,92,246,.35),0 0 26px rgba(124,58,237,.28)!important} .mustdo:not(.lite *):not(.lt *):not([data-skin="light"] *){animation:mustpv 1.6s ease-in-out infinite!important} @keyframes mustpv{0%,100%{box-shadow:0 0 0 1px rgba(139,92,246,.35),0 0 26px rgba(124,58,237,.28)}50%{box-shadow:0 0 0 4px rgba(139,92,246,.18),0 0 34px rgba(124,58,237,.45)}} .cgo:not(.lite *):not(.lt *):not([data-skin="light"] *){border-color:#8b5cf6!important;color:#d8c2ff!important} .cgo:not(.lite *):not(.lt *):not([data-skin="light"] *):hover{background:#24183a!important} :is(.nlpin.on,.ppin.on):not(.lite *):not(.lt *):not([data-skin="light"] *){border-color:#8b5cf6!important;background:#24183a!important;color:#f3eaff!important} .apnav button.on:not(.lite *):not(.lt *):not([data-skin="light"] *){border-color:#8b5cf6!important;background:#24183a!important} .gl13 .w13go20:not(.lite *):not(.lt *):not([data-skin="light"] *){border-color:#8b5cf6;background:#24183a} .gl13 .w13go20:not(.lite *):not(.lt *):not([data-skin="light"] *):hover{background:#2e1f4a} /* v17c: the pinned side panel's header (Overview on the Academy and the agent screen, Going live in Studio) is the same height as the centre panel's top bar, so the two lines under them sit level */ html.nl .nloh,.sover .sohd{min-height:59.3px!important;box-sizing:border-box!important} /* v17c dark mode, core admin and agent screens (Richard, 11 Nov 2026): the consoles follow the left column and the brand. Orange stays only as small highlighters (labels, counts, dots) and amber state edges; buttons, active states, back buttons, step markers, microphones and "next" cards move to violet. Light mode is rebuilt later. */ html.pf-core:not([data-skin=light]) #adm :is(.cc-back){background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm .cc-back:hover{background:#6d28d9!important;border-color:#6d28d9!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-adm,.a-btn.pri,.cx-btn.pri,.hx-std .hx-sav,.iv-alert button.go,.sx-chip-house,.sx-chip.sx-chip-house,.vd-m.me,.b2-b){background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm .cc-adm{background:#5b21b6!important;border-color:#5b21b6!important} html.pf-core:not([data-skin=light]) #adm :is(.sx-mic-i,.sd-talk span,.vd-mic,.rec.up .rec-i,.iv-mic,.bs-bigmic-i){background:linear-gradient(135deg,#A35BFF,#6d28d9)!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-steps .on,.jr-c.cur,.aud-dots button.on,.qs-revs button.on,.aq-chips button.on,.sd-chip:first-of-type,.sd-th.on .sd-n,.np-rc,.sd-av,.sd-tg input:checked+span,.cu-mini i.cur,.hx-sc.cur i){background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-steps .on i,.jr-c.cur i){color:#fff!important} html.pf-core:not([data-skin=light]) #adm :is(.sd-fmt button.on,.sd-th.on,.qs-p.on,.qs-m.on,.aud-modes button.on,.hx-sc.cur,.sd-talk.on,.sx-micsel.hl){border-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm .ch-tabs button.on{border-bottom-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-row,.cu-row,.ch-pj,.qs-p,.qs-m,.hx-card,.cv-admin):hover{border-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm .cu-tiles .hx-tile:hover{outline-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm .sx-compose textarea:focus{border-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm :is(.jr-panel,.cu-float,.cu-next){border-left-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm .cc-c2{border-top-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm .hx-a{border-left-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm :is(.hx-sbar i,.gc-rbar i.r,.bill-tog .bt.on,.pe-lk.on i,.nb-sw input:checked+span){background:#7c3aed!important} html.pf-core:not([data-skin=light]) #adm .bill-tog{border-color:#2a1f3d!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm .qs-offer{border-color:#8b5cf6!important} html.pf-core:not([data-skin=light]) #adm .xp-warn,html.pf-core:not([data-skin=light]) #adm .iv-alert{background:#221832!important;border-color:#2a1f3d!important;border-left:3px solid #F7931A!important} /* the console menus (client console sections, agent console Work and Office) look like the left column */ html.pf-core:not([data-skin=light]) #adm .cc-nav,html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav{background:none!important;border:0!important;padding:0!important;gap:6px!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-nav,.gc-grid nav.cc-nav,.gc-grid .gc-off)>button:not(.gc-tog){display:flex!important;align-items:center!important;gap:10px!important;width:100%!important;min-height:33px!important;padding:0 12px!important;border:1px solid #2a1f3d!important;border-radius:10px!important;background:#1b1229!important;color:#f3eaff!important;font:400 14px/1.3 Geist,system-ui,sans-serif!important;box-shadow:none!important;text-align:left!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-nav,.gc-grid nav.cc-nav,.gc-grid .gc-off)>button:not(.gc-tog):hover{border-color:#8b5cf6!important;background:#1b1229!important} html.pf-core:not([data-skin=light]) #adm :is(.cc-nav,.gc-grid nav.cc-nav,.gc-grid .gc-off)>button.on{background:#24183a!important;border-color:#8b5cf6!important;color:#f3eaff!important;font-weight:400!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav button svg{color:#b9addb!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .cc-nav button.on svg{color:#c4a8ff!important} html.pf-core:not([data-skin=light]) #adm .gc-grid nav.cc-nav .gc-tog{display:flex!important;align-items:center!important;gap:10px!important;width:100%!important;min-height:33px!important;padding:10px 4px 4px!important;margin-top:6px!important;border:0!important;border-top:1px solid #2a1f3d!important;border-radius:0!important;background:none!important;color:#f3eaff!important;font:600 14px Geist,system-ui,sans-serif!important} html.pf-core:not([data-skin=light]) #adm .gc-grid .gc-off{display:grid;gap:6px} /* Needs attention lists: the card shade, no orange or grape fill; an amber or violet edge shows the state */ html.pf-core:not([data-skin=light]) #adm#adm .gc-need li{background:#221832!important;border:1px solid #2a1f3d!important;border-left:3px solid #8b5cf6!important;border-radius:10px!important;box-shadow:none!important} html.pf-core:not([data-skin=light]) #adm#adm .gc-need li.due{border-left-color:#F7931A!important} html.pf-core:not([data-skin=light]) #adm .gc-need li a{color:#f3eaff!important} html.pf-core:not([data-skin=light]) #adm :is(.np-up2,.sd-up){border-color:#8b5cf6!important;color:#d8c2ff!important;background:none!important} html.pf-core:not([data-skin=light]) #adm :is(.np-up2,.sd-up):hover{background:#24183a!important} html.pf-core:not([data-skin=light]) #adm .sd-ask{color:#d8c2ff!important} html.pf-core:not([data-skin=light]) #adm :is(.cu-nx b,.hs-g,.am-box b.due,.np-up2 b,.ct-kick){color:#F7931A!important} html.pf-core:not([data-skin=light]) #adm .a-cal .d.today{border-color:#8b5cf6!important;box-shadow:inset 0 0 0 1px #8b5cf6!important} /* v17c: the core admin search sits in the flow below 1800px wide, so it never runs over the buttons on the right */ @media (max-width:1800px) and (min-width:1000px) and (hover:hover), (max-width:1800px) and (min-width:1401px){html.pf-core header.top > nav.hnav{position:static!important;transform:none!important;margin:0 auto!important;flex:0 1 220px;min-width:140px}} /* v17d phones and tablets (Richard, 11 Nov 2026, iPhone Safari): no page zoom on touch screens. Safari lays out a zoomed page wider than the screen, which cut off the right-hand side and pushed the bottom bar behind Safari's toolbar. Touch screens use the true size, the small-screen layout and the visible screen height (dvh). The A A A text size stays on computers. */ @media (hover:none) and (pointer:coarse){ html{zoom:1!important;--tz:1!important} html body .tsz,html body .mnav .tsz{display:none!important} html:where(:is(.pf-app,.pf-studio)),html:where(:is(.pf-app,.pf-studio)) body{height:100dvh!important} } /* v17d phone (App and Studio): the menu takes over the whole screen below the top bar, solid, over the bottom bar; the empty second bar is gone */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav{right:auto!important;bottom:0!important;width:min(82vw,330px)!important;background:rgba(16,10,26,.97)!important;z-index:70!important;padding-bottom:env(safe-area-inset-bottom);border-right:1px solid rgba(196,168,255,.18);border-bottom:0!important;clip-path:none!important;transform:translateX(-102%);opacity:1!important;transition:transform .32s cubic-bezier(.2,.8,.2,1)!important;box-shadow:none} html:is(.pf-app,.pf-studio) .mnav.open{transform:none} html:is(.pf-app,.pf-studio) .mnav .mn-in{min-height:100%;box-sizing:border-box;display:flex!important;flex-direction:column;gap:4px} html:is(.pf-app,.pf-studio) .mnav .mn-it{opacity:1!important;transform:none!important} html:is(.pf-app,.pf-studio) body:has(.mnav.open) .dock{visibility:hidden} html.pf-app #page>.dtool:not(:has(>.sub:not(:empty))){display:none!important} } /* v17d phone: wide tables scroll sideways inside their own box instead of being cut off */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){table.cmp{display:block!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;max-width:100%}} /* v17d Academy phone: the top bar keeps the brand whole (currency stays on Plans and Account); the menu takes over the full screen, solid */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html.nl header.top .curs{display:none!important} html.nl header.top>a.brand{max-width:none!important;overflow:visible!important;flex:1 1 auto;min-width:0} } /* v17d: the Academy menu's own currency row, shown on phones only (computers keep it in the top bar) */ .curside-row{display:none} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){.curside-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 12px;padding:0 4px} .curside-l{font:500 11px Geist Mono,ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#a99cc8}} /* v17d: the shared phone dock (Academy, Academy Admin, core admin), the same look as the App and Studio dock */ .gdock{display:none} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html.hasdock .gdock{display:grid;grid-template-columns:repeat(5,1fr);align-items:end;position:fixed;left:0;right:0;bottom:0;z-index:66;height:calc(66px + env(safe-area-inset-bottom));padding:0 6px env(safe-area-inset-bottom);box-sizing:border-box;background:rgba(15,10,24,.96);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-top:1px solid rgba(196,168,255,.16)} html.hasdock .gdock button{all:unset;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;height:66px;min-height:44px;color:#c4a8ff;font:500 11px Geist,system-ui,sans-serif;position:relative;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:10px;text-align:center} html.hasdock .gdock button svg{width:22px;height:22px} html.hasdock .gdock button.on::before{content:"";position:absolute;top:7px;left:50%;width:18px;height:2px;margin-left:-9px;border-radius:2px;background:#c4a8ff} html.hasdock .gdock .dorb{justify-content:flex-end;padding-bottom:3px} html.hasdock .gdock .dorb i{position:absolute;top:-22px;left:50%;width:60px;height:60px;margin-left:-30px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#b98cff,#7c3aed 55%,#3b1a78);box-shadow:0 0 0 4px #0f0a18,0 0 0 5px rgba(196,168,255,.35),0 8px 26px rgba(139,92,246,.55)} html.hasdock .gdock .dorb i svg{width:30px;height:30px} html.hasdock #agPill,html.hasdock .ag-pill{display:none!important} html.hasdock body{padding-bottom:calc(76px + env(safe-area-inset-bottom))!important} html.hasdock #side.open~* .gdock,html.hasdock body:has(#side.open) .gdock{visibility:hidden} html.nl header.top a.av{display:none!important} } /* v17d: the settings block at the bottom of every phone menu (text size, currency); hidden on computers */ .mset{display:none} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ .mset{display:grid;gap:10px;margin:0 0 12px;padding:4px 4px 14px;border-bottom:1px solid #2a1f3d} .mset-row{display:flex;flex-wrap:wrap;gap:8px} html body .mset .mset-b{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;width:auto;min-height:44px;padding:0 14px;border:1px solid #2a1f3d;border-radius:10px;background:#1b1229;color:#f3eaff;opacity:1;font:400 14px Geist,system-ui,sans-serif;cursor:pointer;text-decoration:none} html body .mset .mset-b.here{border-color:#8b5cf6;background:#24183a} html body .mset .mset-b.mset-adm{background:#F7931A;border-color:#F7931A;color:#16101c;font-weight:600} /* App and Studio: the links, view, Admin and Sign out rows come first in the menu, the page items after */ html:is(.pf-app,.pf-studio) .mnav .mn-in>:is(.mn-main,.snmn){order:3} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mset{order:-1;border-bottom:0;padding-bottom:0;margin:6px 0 4px} .mnav .mn-hide{display:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>:not(.mn-main):not(.mset):not(.snmn){order:-1} html:is(.pf-app,.pf-studio) .mnav .mn-row .curs:not(.curside){display:none!important} .mset-r{display:flex;align-items:center;justify-content:space-between;gap:10px} .mset-l{font:500 11px Geist Mono,ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:#a99cc8} .mset-ts{display:inline-flex;gap:6px} .mset-ts button{all:unset;box-sizing:border-box;display:inline-grid;place-items:center;min-width:44px;min-height:44px;border:1px solid #2a1f3d;border-radius:10px;background:#1b1229;color:#f3eaff;font:600 13px Geist,system-ui,sans-serif;cursor:pointer} .mset-ts button:nth-child(2){font-size:15px}.mset-ts button:nth-child(3){font-size:18px} .mset-ts button.on{border-color:#8b5cf6;background:#24183a} html.nl #sidenav .sp[data-g=start] .dot.nlic{color:#c4a8ff}html.nl #sidenav .sp[data-g=arguta] .dot.nlic{color:#f7931a}html.nl #sidenav .sp[data-g=courses] .dot.nlic{color:#3ddc97}html.nl #sidenav .sp[data-g=community] .dot.nlic{color:#d8c2ff}html.nl #sidenav .sp[data-g=mentoring] .dot.nlic{color:#f2d58a}html.nl #sidenav .sp[data-g=help] .dot.nlic{color:#b9addb} } /* v17d touch screens: A A A sizes the page content only (the bars and menus stay put); no page zoom, which Safari mishandles */ @media (hover:none) and (pointer:coarse){ } /* v17d (Richard, 11 Nov 2026): phones stay dark. No Light page button and no owner Preview as on phones; both stay on computers */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ .mnav .mn-row:has(>[data-mlt]):not(:has(>:not([data-mlt]):not(.curs):not(.tsz))),.mnav .mn-lab:has(+.mn-row>[data-mlt]){display:none!important} .mnav [data-mlt],[data-snlt],.dtool .dbtn,.snbar .dbtn,#stools [data-lt]{display:none!important} #stools button:not(.feedbtn),#stools [data-lt]{display:none!important} } /* v17d (Richard): behind an open phone menu the page is dimmed and blurred, not hidden; tapping it closes the menu */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ body:has(.mnav.open)::after,body:has(#side.open)::after{content:"";position:fixed;inset:0;background:rgba(8,5,14,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none} html:is(.pf-app,.pf-studio) body:has(.mnav.open)::after{z-index:68} html.nl:not(.pf-core) body:has(#side.open)::after{z-index:79} html.pf-core body:has(#side.open)::after{display:none} html.pf-core #adm #side.open::before{content:"";position:fixed;top:0;bottom:0;right:0;left:min(84vw,300px);background:rgba(8,5,14,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);pointer-events:none} html.nl:not(.pf-core) #side.open{z-index:80!important} } /* v17d: core admin phone menu items were drawn in the light-mode text colour (dark grey on dark) */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-core:not([data-skin=light]) #adm #side :is(.sp,.sp .nm,.spsub){color:#f3eaff!important}} /* v17h (Richard, 11 Nov 2026): phone menus at the Academy drawer's scale: narrower, compact rows, no labels, small A A A with the orange edge on the chosen size as on the computer. Applies to the App, Studio, Academy and both admins. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav{width:min(70vw,280px)!important} html:is(.pf-app,.pf-studio) .mnav .mn-in{padding:8px 10px 14px!important;gap:2px!important} html:is(.pf-app,.pf-studio) .mnav .mn-main{padding:7px 10px!important;font:400 13.5px Geist,system-ui,sans-serif!important;letter-spacing:0!important;text-transform:none!important;border-radius:9px!important;min-height:0!important} html:is(.pf-app,.pf-studio) .mnav .mn-main.on{background:#24183a!important;border-color:#8b5cf6!important} html:is(.pf-app,.pf-studio) .mnav .mn-note{font-size:11.5px!important;line-height:1.4!important;margin:4px 2px!important} html:is(.pf-app,.pf-studio) .mnav .mn-lab{margin:6px 2px 2px!important} .mset{gap:6px!important;padding:2px 2px 10px!important;margin:0 0 8px!important} .mset .mset-l{display:none!important} .mset-r{justify-content:flex-start!important} .mset-row{gap:6px!important} html body .mset .mset-b{min-height:30px!important;padding:0 12px!important;font-size:12.5px!important;border-radius:999px!important} .mset-ts{gap:4px!important} .mset-ts button{min-width:28px!important;min-height:28px!important;border-radius:7px!important;font-size:11px!important;background:#1c1430!important;border-color:#33264f!important} .mset-ts button:nth-child(2){font-size:13px!important}.mset-ts button:nth-child(3){font-size:15px!important} .mset-ts button.on{border-color:#F7931A!important;background:#1c1430!important} body:has(.mnav.open)::after,body:has(#side.open)::after{background:rgba(8,5,14,.45)!important;-webkit-backdrop-filter:blur(8px)!important;backdrop-filter:blur(8px)!important} } /* v17h (Richard, 11 Nov 2026): App front page crew cards about half the height: picture on the left, words beside it (all widths) */ html.pf-app .exc{display:grid!important;grid-template-columns:40px 1fr;column-gap:12px;align-items:center;padding:10px 12px!important;border-radius:12px!important} html.pf-app .exc img{grid-row:1 / span 2;width:40px!important;height:40px!important} html.pf-app .exc b{margin:0 0 1px!important;font-size:14px!important;line-height:1.25} html.pf-app .exc span{font-size:12px!important;line-height:1.35} /* v17h (Richard): on phones everything is one size smaller. The page content follows the A A A choice: the smallest size matches the Academy menu's scale. The top bar and its buttons are smaller too. Phones and tablets under 861px only. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html :is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage):not(:is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage) *){zoom:.9} html[data-ts=s] :is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage):not(:is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage) *){zoom:.82} html[data-ts=l] :is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage):not(:is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage) *){zoom:1} html header.top{min-height:48px!important;height:48px!important;padding-top:0!important;padding-bottom:0!important} html header.top .brand img,html header.top .brandlockup img{max-height:15px!important} html header.top :is(.brand,.brandlockup) svg{width:26px!important;height:26px!important} html header.top :is(.brand b,.brandlockup b,.sec,.nlsec,.sa-sec,.bname){font-size:14px!important} html header.top :is(.mtopb,.admbtn,.mburger,.burger,#burger,#agtBurger){min-height:30px!important;height:30px!important;padding:0 12px!important;font-size:12px!important} html header.top :is(.mtopb,.admbtn){border-radius:999px!important} html header.top :is(.mburger,.burger,#burger,#agtBurger){width:32px!important;padding:0!important} html:is(.pf-acad,.pf-adm) #sidenav .sp,html.pf-core #adm #side .sp{min-height:0!important;padding-top:5px!important;padding-bottom:5px!important;font-size:13px!important} html:is(.pf-acad,.pf-adm) #sidenav .grp{font-size:12px!important;margin-top:8px!important} html.hasdock .gdock,html:where(:is(.pf-app,.pf-studio)) .dock{height:calc(58px + env(safe-area-inset-bottom))!important} html.hasdock .gdock button,html:is(.pf-app,.pf-studio) .dock button{height:58px!important;font-size:10.5px!important} html.hasdock .gdock button svg,html:is(.pf-app,.pf-studio) .dock button svg{width:20px!important;height:20px!important} html.hasdock .gdock .dorb i,html:is(.pf-app,.pf-studio) .dock .dorb i{width:52px!important;height:52px!important;margin-left:-26px!important;top:-18px!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-studio .stool:not(:has(.sub>*:not([hidden]))):not(:has(.dbtn>*:not([hidden]):not([data-snlt]):not(.pvas))){display:none!important}} /* v17i (Richard, 11 Nov 2026): one phone menu. App and Studio follow the Academy drawer exactly: 320px wide, rows at 13px, the same lilac text, rounded-rectangle buttons (never pills), small and level. No Admin button in the phone top bar. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav{width:min(82vw,320px)!important} html:is(.pf-app,.pf-studio) .mnav .mn-in{padding:12px 12px 28px!important;gap:2px!important} html:is(.pf-app,.pf-studio) .mnav :is(.mn-main,.snmn button,.snmn a){min-height:29px!important;padding:5px 8px!important;font:400 13px Geist,system-ui,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:#b9addb!important;border-radius:10px!important;border:1px solid transparent!important;background:none!important} html:is(.pf-app,.pf-studio) .mnav :is(.mn-main,.snmn button,.snmn a).on{color:#f3eaff!important;background:#24183a!important;border-color:#8b5cf6!important} html:is(.pf-app,.pf-studio) .mnav .mn-main span{font-size:12px!important;opacity:.6} html:is(.pf-app,.pf-studio) .mnav :is(.mn-lab,.snmn h4,.snmn .lab){font:600 12px Geist,system-ui,sans-serif!important;letter-spacing:0!important;text-transform:none!important;color:#f3eaff!important;margin:10px 8px 4px!important} html:is(.pf-app,.pf-studio) .mnav .mn-note{font-size:11.5px!important;color:#a99cc8!important} html body .mset .mset-b{min-height:28px!important;height:28px!important;padding:0 10px!important;font-size:12px!important;border-radius:8px!important;border:1px solid #2a1f3d!important;background:#1b1229!important} html body .mset .mset-b.here{border-color:#8b5cf6!important;background:#24183a!important} html body .mset .mset-b.mset-adm{background:#F7931A!important;border-color:#F7931A!important;color:#16101c!important} html header.top :is(.admbtn,a.admbtn){display:none!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav :is(.mn-b,.mn-row a,.mn-row button){min-height:28px!important;height:28px!important;padding:0 10px!important;font:400 12px Geist,system-ui,sans-serif!important;border-radius:8px!important;border:1px solid #2a1f3d!important;background:#1b1229!important;color:#f3eaff!important} html:is(.pf-app,.pf-studio) .mnav .mn-row{gap:6px!important} html:is(.pf-app,.pf-studio) .mnav :is(.mn-b,.mn-row a).mn-adm,html:is(.pf-app,.pf-studio) .mnav .mn-row a[href*="admin"]{background:#F7931A!important;border-color:#F7931A!important;color:#16101c!important} html header.top :is(.mtopb,.sv,#save,button.main){border-radius:8px!important;height:30px!important;min-height:30px!important;padding:0 12px!important;font-size:12px!important} } /* v17i (Richard): the phone menu lets more of the page show through; the page behind is blurred more lightly */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav,html.nl #side.open,html.pf-core #adm #side.a-nav.open{background:rgba(16,10,26,.78)!important;-webkit-backdrop-filter:blur(16px) saturate(1.2)!important;backdrop-filter:blur(16px) saturate(1.2)!important} html.nl #side.open :is(.nlpnl,#sidenav,.nlfirst){background:transparent!important} body:has(.mnav.open)::after,body:has(#side.open)::after{background:rgba(8,5,14,.3)!important;-webkit-backdrop-filter:blur(3px)!important;backdrop-filter:blur(3px)!important} html.pf-core #adm #side.open::before{background:rgba(8,5,14,.3)!important;-webkit-backdrop-filter:blur(3px)!important;backdrop-filter:blur(3px)!important} } /* v17j (Richard, 11 Nov 2026): ONE phone menu look, set once here for the App, Studio, Academy, Academy Admin and core admin: the Academy's purple velvet glow at the top and fine dots, the lilac edge, see-through, scrolling from the top bar down. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav,html.nl #side.open,html.pf-core #adm #side.a-nav.open{ background:radial-gradient(60% 260px at 100% 0%,rgba(110,55,190,.32),transparent 70%) no-repeat,radial-gradient(rgba(255,255,255,.05) 1px,transparent 1.4px) 0 0/22px 22px,rgba(16,10,26,.78)!important; background-attachment:local,local,scroll!important;border-right:1px solid rgba(163,91,255,.22)!important;box-shadow:none!important; padding:12px 12px 28px!important;box-sizing:border-box!important;overflow-y:auto!important;width:min(82vw,320px)!important} html.nl #side.open::before,html.pf-acad .side::before{display:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in{padding:0!important} html:is(.pf-app,.pf-studio) .mnav :is(.mn-b,.mn-row a,.mn-row button),html body .mset .mset-b{min-height:28px!important;height:28px!important;padding:0 10px!important;font:400 12px Geist,system-ui,sans-serif!important;border-radius:8px!important;border:1px solid #2a1f3d!important;background:#1b1229!important;color:#f3eaff!important;display:inline-flex!important;align-items:center!important} html:is(.pf-app,.pf-studio) .mnav :is(.mn-b,.mn-row a)[href*="admin"],html body .mset .mset-b.mset-adm{background:#F7931A!important;border-color:#F7931A!important;color:#16101c!important} html body .mset .mset-b.here,html:is(.pf-app,.pf-studio) .mnav .mn-row a[target="_self"]{border-color:#8b5cf6!important;background:#24183a!important} html:is(.pf-app,.pf-studio) .mnav :is(.mn-lab){display:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-sep{margin:8px 0!important;border-top:1px solid #2a1f3d!important;height:0!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav .mn-sep{display:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mset{margin:0 0 8px!important;padding:0!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mn-row{margin:0 0 8px!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mn-note{order:-1;border-bottom:1px solid #2a1f3d!important;padding:0 2px 12px!important;margin:0 0 10px!important} html.pf-studio .mnav .snmn{order:-1} } /* v17k: the App and Studio phone menu sections (top bar tabs, then the left column, then Studio's extras) */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head{order:3!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft{order:4!important;display:grid;gap:10px;margin-top:10px;padding-top:10px;border-top:1px solid #2a1f3d} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-extra{order:5!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-extra.mn-x1{margin-top:10px!important;border-top:1px solid #2a1f3d!important;border-radius:0 0 10px 10px!important;padding-top:10px!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.mn-h1{margin-top:4px!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mn-extra:first-of-type,html.pf-studio .mnav .snmn{border-top:0} html.pf-studio .mnav .snmn{display:contents!important} .mleft-g{display:grid;gap:2px} .mleft-h{font:600 12px Geist,system-ui,sans-serif;color:#f3eaff;margin:2px 8px 4px} .mleft-i{all:unset;box-sizing:border-box;display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:29px;padding:5px 8px;border-radius:10px;border:1px solid transparent;font:400 13px Geist,system-ui,sans-serif;color:#b9addb;cursor:pointer} .mleft-i.on{color:#f3eaff;background:#24183a;border-color:#8b5cf6} .mleft-i em{font-style:normal;font-size:11px;color:#F7931A} .mleft-i.soon{opacity:.6} } /* v17k (Richard): every phone menu starts right under the 48px top bar and runs to the bottom, so its scroll bar runs the full height */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav,html.nl #side.open,html.pf-core #adm #side.a-nav.open{top:calc(48px + env(safe-area-inset-top))!important;bottom:0!important;height:auto!important;max-height:none!important} html.pf-core #adm #side.open::before{top:calc(48px + env(safe-area-inset-top))!important;left:min(82vw,320px)!important} html.pf-core #adm #side.a-nav{z-index:61!important} } /* v17l (Richard): a little more space between the top bar and the first thing on each page, on phones */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html :is(#wsl>.din:first-child,#center>:first-child,.a-main>:first-child,#agMain>:first-child,.spanel>:first-child,#page>.doc>:first-child){margin-top:18px!important} .mleft .lfoot,.mnav .mleft-foot{margin-top:14px;padding:12px 6px 0;border-top:1px solid #2a1f3d;font-size:11px;color:#8f84ab} .mleft-foot .lfl{display:flex;gap:12px;margin-bottom:8px}.mleft-foot a{color:#c4b8e0;font-size:12px} .mleft-foot p{margin:0 0 6px;font-size:11px;line-height:1.45} } /* v17l (Richard): on phones the Academy's right-hand column (Overview, server status, owner numbers) is not part of the page; it is hidden there. Computers keep it. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-acad .cols>#right,html.pf-acad .cols>.col#right{display:none!important}} /* v17m (Richard): the small print sits last in every phone menu, one thin line above it, small and quiet, about 20px from the bottom */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft-foot{order:9!important} html:is(.pf-app,.pf-studio) .mnav,html.nl #side.open,html.pf-core #adm #side.a-nav.open{padding-bottom:16px!important} html:is(.pf-app,.pf-studio) .mnav .mn-in{min-height:100%!important} .mnav .mleft-foot,html.nl #side.open>.lfoot,html.pf-core #adm #side.open .lfoot{margin-top:auto!important;padding:10px 4px 0!important;border-top:1px solid #2a1f3d!important;border-bottom:0!important;box-shadow:none!important;background:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft{border-bottom:0!important} .mnav .mleft-foot :is(p,span,small),html.nl #side.open>.lfoot :is(p,span,small),html.pf-core #adm #side.open .lfoot :is(p,span,small){font-size:10px!important;line-height:1.45!important;color:#7d7396!important;margin:0 0 4px!important} .mnav .mleft-foot .lfl,html.nl #side.open>.lfoot .lfl,html.pf-core #adm #side.open .lfoot .lfl{display:flex!important;gap:12px!important;margin:0 0 6px!important} .mnav .mleft-foot a,html.nl #side.open>.lfoot a,html.pf-core #adm #side.open .lfoot a{font-size:11px!important;color:#a99cc8!important;text-decoration:none!important} } /* v17n (Richard): on phones the Academy page uses the same background and side gutter as the App: the plain dark page with one soft violet glow at the top right, no dots, and a 16px gutter (it had 14px outside plus 32px inside). */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html.pf-acad.nl::before{display:none!important} html.pf-acad.nl body::before{background:#140d1f!important} html.pf-acad.nl body::after{background:radial-gradient(900px 500px at 80% 0,rgba(139,92,246,.14),transparent 70%)!important} html.pf-acad.nl main.main{padding-left:0!important;padding-right:0!important} .doc.nlapp .din.wide,.doc.nlapp .din{padding:18px 16px 40px!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ .mnav .mleft-foot,html.nl #side.open>.lfoot,html.pf-core #adm #side.open .lfoot{border-top:3px double #2a1f3d!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ .mleft-tog{all:unset;box-sizing:border-box;display:flex;justify-content:space-between;width:100%;cursor:pointer;font:600 12px Geist,system-ui,sans-serif!important;color:#f3eaff!important;padding:2px 8px 4px!important} .mleft-tog em{font-style:normal;color:#a99cc8;font-weight:400} .mleft-crew:not(.open) .mleft-i{display:none} .mleft-none{font-size:12px;color:#7d7396;padding:2px 8px 6px} .mtools{display:grid;gap:2px;margin:0 0 6px} } /* v17o (Richard, 11 Nov 2026): iPhone Safari enlarges small text by its own rules unless told not to, so the same size came out different on each platform. Every Arguta page now keeps exactly the sizes set here, on every phone. */ html{-webkit-text-size-adjust:100%!important;text-size-adjust:100%!important} /* v17p (Richard): the small print in every phone menu has the computer's two lines, spaced the same: 25px clear of the last menu item, a dark line, 10px, a soft violet line, 12px, then the links. One rule for all five menus. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ .mnav .mleft-foot,html.nl #side.open>.lfoot,html.pf-core #adm #side.open .lfoot{margin-top:25px!important;padding:10px 4px 0!important;border-top:1px solid #2a1f3d!important} .mnav .mleft-foot::before,html.nl #side.open>.lfoot::before,html.pf-core #adm #side.open .lfoot::before{content:""!important;display:block!important;position:static!important;border-top:1px solid rgba(139,92,246,.18)!important;margin:0 -4px 12px!important;height:0!important;background:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in{min-height:0!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){.mnav .mleft-foot a,html.nl #side.open>.lfoot a,html.pf-core #adm #side.open .lfoot a{font-weight:400!important;color:#a99cc8!important;letter-spacing:0!important}} /* v17q (Richard): phone menus copy the computer's left column exactly (measured from the Academy at standard size): Feed is the solid violet button with centred text; Tools rows are boxed (card shade, fine border, 10px corners); every other row is plain; group titles bold; a fine line between groups. Same on all five platforms. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html.nl #side.open .feedbtn,html.pf-core #adm #side.open .feedbtn{display:block!important;width:100%!important;min-height:34px!important;height:auto!important;padding:7px 12px!important;border-radius:10px!important;background:#7c3aed!important;background-image:none!important;border:1px solid #7c3aed!important;color:#fff!important;font:600 13.5px Geist,system-ui,sans-serif!important;text-align:center!important;box-shadow:none!important} html.nl #side.open #sidenav .grp,html.pf-core #adm #side.open .grp,.mleft-h,html:is(.pf-app,.pf-studio) .mnav .mleft-tog{font:700 13px Geist,system-ui,sans-serif!important;color:#f3eaff!important;margin:14px 0 6px!important;padding:12px 0 0!important;border-top:1px solid #2a1f3d!important;letter-spacing:0!important;text-transform:none!important} html.nl #side.open #sidenav>.grp:first-of-type,html.nl #side.open #sidenav .mtools>.grp{margin-top:12px!important} html.nl #side.open #sidenav .sp,html.pf-core #adm #side.open .sp,.mleft-i,html:is(.pf-app,.pf-studio) .mnav .mn-main{min-height:31px!important;padding:0 8px!important;font:400 13px Geist,system-ui,sans-serif!important;color:#f3eaff!important;border-radius:10px!important;border:1px solid transparent!important;background:none!important;display:flex!important;align-items:center!important;gap:9px!important} html.nl #side.open #sidenav .sp.nltool,html.nl #side.open #sidenav .mtools .sp,.mleft-g.boxed .mleft-i,html.pf-core #adm #side.open .sp.nltool{background:#1b1229!important;border:1px solid #2a1f3d!important;padding:0 12px!important;margin:0 0 4px!important} html.nl #side.open #sidenav .mtools .sp .dot,html.nl #side.open #sidenav .sp.nltool .dot{display:none!important} html.nl #side.open #sidenav .sp.on,html.pf-core #adm #side.open .sp.on,.mleft-i.on,html:is(.pf-app,.pf-studio) .mnav .mn-main.on{background:#24183a!important;border-color:#8b5cf6!important} .mleft-i.soon{color:#a99cc8!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html body .mleft-g .mleft-i.mleft-main{background:#7c3aed!important;border-color:#7c3aed!important;color:#fff!important;font-weight:600!important;justify-content:center!important;min-height:34px!important;margin:0 0 6px!important}} /* v17r (Richard): every phone menu reads: links and settings, then the violet button (Feed / + New job), then the top bar tabs, then the left-column groups, then the small print */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav .mn-in>.mtopbtn{order:2!important;margin:6px 0 8px!important;width:100%!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head{border:0!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft>.mleft-g:first-child>.mleft-h{margin-top:0!important} html.nl #side.open #sidenav .mhead{display:grid;gap:2px;margin:10px 0 0;padding:0 0 10px;border-bottom:1px solid #2a1f3d} html.nl #side.open #sidenav .mtools>.grp{border-top:0!important;padding-top:0!important} html.nl #side.open #stools{margin-bottom:8px} } /* v17r: the moved violet button keeps the desktop violet look, with a line under the tabs block */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html body .mnav .mn-in>.mleft-i.mtopbtn,html body .mnav .mn-in>.mtopbtn{display:flex!important;align-items:center!important;background:#7c3aed!important;border:1px solid #7c3aed!important;color:#fff!important;font-weight:600!important;font-size:13.5px!important;justify-content:center!important;min-height:34px!important;border-radius:10px!important;padding:0 12px!important} html body .mnav .mn-in>.mtopbtn *{color:#fff!important} html body .mnav .mn-in>.mtopbtn .ar,html body .mnav .mn-in>.mtopbtn .chev{display:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head{padding-bottom:10px!important;margin-bottom:10px!important;border-bottom:1px solid #2a1f3d!important} } /* v17s (Richard): App and Studio phone menus carry the owner Preview as box above the violet button, styled as the Academy one */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html body .mnav .mn-in>.mtopbtn.mpv{display:flex!important;background:none!important;border:0!important;padding:0!important;min-height:0!important;margin:6px 0 0!important;padding-top:10px!important;border-top:1px solid #2a1f3d!important;border-radius:0!important} html body .mnav .mn-in>.mpv select{flex:1;min-width:0;width:100%;font:400 14px Geist,system-ui,sans-serif;color:#f3eaff;background:#1b1229;border:1px solid #2a1f3d;border-radius:10px;padding:7px 8px;margin:0} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html body .mnav .mn-in>.mtopbtn.mpv{border-top:0!important;padding-top:0!important;margin:4px 0 0!important}} /* v17s (Richard, 11 Nov 2026): one phone menu for the App, Studio and Academy. Sections, each split by one line: links / phone note / Preview as + violet button / tabs / groups / A A A, Admin, Sign out / small print */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav,html:is(.pf-app,.pf-studio) .mnav.open{width:min(90vw,348px)!important} html.pf-acad .side,html.nl.pf-acad #side.open,html.pf-acad #side{width:min(90vw,348px)!important} /* the old link, settings and note rows give way to the new sections */ html:is(.pf-app,.pf-studio) .mnav .mn-in>:is(.mset,.mn-row,.mn-lab,.mn-sep,.mn-note){display:none!important} html.pf-acad #side .mset{display:none!important} .mx-links,.mx-set{display:none} .mx-links{display:flex;flex-wrap:nowrap;gap:6px;margin:14px 0 0;padding:0 0 12px;border-bottom:1px solid #2a1f3d} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mx-links{order:-5!important} html body .mx-b{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;flex:1 1 auto;white-space:nowrap;min-height:30px;padding:0 10px;border:1px solid #3d2f57;border-radius:10px;background:#1b1229;color:#f3eaff;font:500 12.5px Geist,system-ui,sans-serif;cursor:pointer} html body .mx-b.here{border-color:#8b5cf6;background:#24183a} html body .mx-b.mx-adm{background:#F7931A;border-color:#F7931A;color:#16101c;font-weight:600} .mx-note{margin:0!important;padding:12px 2px!important;border-bottom:1px solid #2a1f3d;font:400 12.5px/1.45 Geist,system-ui,sans-serif;color:#a99cc8} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mx-note{order:-4!important} /* Preview as and the violet button: their own section */ html body .mnav .mn-in>.mtopbtn.mpv{margin:12px 0 0!important} html body .mnav .mn-in>.mleft-i.mtopbtn:not(.mpv){margin:8px 0 12px!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head{border-top:1px solid #2a1f3d!important;border-bottom:1px solid #2a1f3d!important;padding:8px 0!important;margin:0 0 12px!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head~.mn-head{border-top:0!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft{border-top:0!important;padding-top:0!important;margin-top:0!important} html.nl #side.open .stools{margin-top:12px!important} html.nl #side.open #sidenav .feedbtn{margin:8px 0 12px!important} html.nl #side.open #sidenav .mhead{border-top:1px solid #2a1f3d!important;border-bottom:1px solid #2a1f3d!important;margin:0 0 12px!important;padding:8px 0!important} /* A A A, Admin and Sign out: their own section above the small print */ .mx-set{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:20px 0 0;padding:12px 0 0;border-top:1px solid #2a1f3d} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mx-set{order:8!important} .mx-set .mx-b{flex:0 0 auto} .mx-ts{display:inline-flex;gap:4px;margin-right:4px} .mx-ts button{all:unset;box-sizing:border-box;display:inline-grid;place-items:center;width:30px;height:30px;border:1px solid #3d2f57;border-radius:8px;background:#1b1229;color:#f3eaff;font:500 11px Geist,system-ui,sans-serif;cursor:pointer} .mx-ts button:nth-child(2){font-size:13px}.mx-ts button:nth-child(3){font-size:15px} .mx-ts button.on{border-color:#F7931A} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft-foot,html.pf-acad #side .lfoot{margin-top:25px!important} } /* v17s (Richard): on phones the A A A choice also sizes the menus, not only the page */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html[data-ts=s] :is(.mnav .mn-in,#side)>*{zoom:.9} html[data-ts=l] :is(.mnav .mn-in,#side)>*{zoom:1.12} } /* v17s: App and Studio tab rows copy the Academy menu rows (no row lines, no arrows); one line above the first and below the last */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head{border:1px solid transparent!important;border-radius:10px!important;min-height:31px!important;height:31px!important;padding:0 9px!important;margin:0!important;background:none!important;font:400 13px Geist,system-ui,sans-serif!important;color:#f3eaff!important;display:flex!important;align-items:center!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.on{border-color:#8b5cf6!important;background:rgba(139,92,246,.12)!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head>span[aria-hidden],html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head::after{display:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.mh-first{margin-top:0!important;box-shadow:0 -9px 0 -8px #2a1f3d!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.mh-last{margin-bottom:12px!important;box-shadow:0 9px 0 -8px #2a1f3d!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html[data-ts=l] :is(.mnav .mn-in,#side)>.mx-links{zoom:1}} /* v17s: A A A, Sign out, Admin side by side, with room above and below, above the small print */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){.mx-set{flex-wrap:nowrap!important;margin:24px 0 0!important;padding:16px 0!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft-foot,html.pf-acad #side .lfoot{margin-top:8px!important}} /* v17t (Richard, 11 Nov 2026): phone page content one step up. Small = the old middle (.9), middle = 1, large = 1.1. The menus keep their sizes (small .9, middle 1, large 1.12). Phones and tablets under 861px only. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html :is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage):not(:is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage) *){zoom:1} html[data-ts=s] :is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage):not(:is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage) *){zoom:.9} html[data-ts=l] :is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage):not(:is(#page,#center,.a-main,.spanel,#agMain,.stage>.doc,main.stage) *){zoom:1.1} } /* v17t: the A A A / Sign out / Admin section sits centred between its two lines, the same on all three */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){.mx-set{margin:24px 0 0!important;padding:20px 0!important;align-items:center!important} html:is(.pf-app,.pf-studio) .mnav .mn-in>.mleft-foot,html.pf-acad #side .lfoot{margin-top:0!important;padding-top:0!important}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html:is(.pf-app,.pf-studio) body .mnav .mn-in>.mleft-foot,html.nl.pf-acad #side.open>.lfoot{margin-top:0!important}} /* v17t (Richard): the lit row in the phone menu tabs (My workspace) looks exactly like the lit link button at the top: one solid violet line all round, the same fill, no glow, no side bar, no offset */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.on,html.nl #side.open #sidenav .mhead .sp.on,html.nl #side.open #sidenav .mhead .on{ border:1px solid #8b5cf6!important;background:#24183a!important;border-radius:10px!important;outline:0!important;transform:none!important;margin-left:0!important;margin-right:0!important; box-shadow:none!important;background-image:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.on::before,html.nl #side.open #sidenav .mhead .sp.on::before,html.nl #side.open #sidenav .mhead .sp.on::after{display:none!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.on.mh-first{box-shadow:0 -9px 0 -8px #2a1f3d!important} html:is(.pf-app,.pf-studio) .mnav .mn-in .mn-head.on.mh-last{box-shadow:0 9px 0 -8px #2a1f3d!important} } /* v17u (Richard): Academy phone menu lists what the computer's left column lists; extras hidden on phones only */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-acad #sidenav .mx-off{display:none!important}} @media (min-width:861px) and (hover:hover), (min-width:1401px){html.pf-acad #sidenav [data-mxp]{display:none!important}} /* v17u (Richard): phone top bar: the menu button and the platform mark one step bigger than the wordmark; the menu button has two white lines and four white dots (the violet dots were lost on the dark bar). App, Studio, Academy and both admins. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html header.top :is(.mburger,.burger,#burger,#agtBurger){width:36px!important} html header.top :is(.mburger,.burger,#burger,#agtBurger) svg{width:30px!important;height:26px!important} html header.top :is(.mburger,.burger,#burger,#agtBurger) svg .dots{stroke:#fff!important;stroke-dasharray:0.1 5.7667!important;stroke-width:2.6px!important} html.nl header.top .brand .nlico,html header.top .brand.lockup .lico{width:36px!important;height:36px!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-acad body #side #sidenav .sp.mx-off,html.pf-acad body #side.open #sidenav>.sp.mx-off{display:none!important}} /* v17v (Richard, 11 Nov 2026): ONE phone top bar and menu for everything with a menu button (App, Studio, Academy, both admins, website). Menu: one solid colour, very slightly see-through, the violet glow at the top kept, no dots. Menu button: thinner lines and lighter dots. Platform mark one step bigger than the wordmark, closer to it. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html:is(.pf-app,.pf-studio) .mnav,html.nl #side.open,html.pf-core #adm #side.a-nav.open{ background:radial-gradient(60% 260px at 100% 0%,rgba(110,55,190,.30),transparent 70%) no-repeat,rgba(16,10,26,.95)!important;background-attachment:local,scroll!important} html header.top :is(.mburger,.burger,#burger,#agtBurger) svg :is(.l1,.l2){stroke-width:1.5px!important} html header.top :is(.mburger,.burger,#burger,#agtBurger) svg .dots{stroke-width:2px!important} html header.top .brand{gap:6px!important} html header.top .brand :is(.nlico,.lico){width:26px!important;height:26px!important;max-height:none!important;max-width:none!important;margin:0!important;object-fit:contain} html header.top .brand>svg:first-child{width:26px!important;height:26px!important;margin:0!important} .stban{margin:0 16px 12px!important;width:auto!important;box-sizing:border-box} html.hdup header.top{transform:translateY(-100%)!important;transition:transform .4s cubic-bezier(.22,.61,.36,1)!important} html header.top{transition:transform .4s cubic-bezier(.22,.61,.36,1)} } /* v17v (Richard): every Academy page on a phone keeps the 16px side gutter (pages outside the workspace frame had none) */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html.pf-acad.nl #center.doc:not(.nlapp):not(.nlmix){padding-left:16px!important;padding-right:16px!important;box-sizing:border-box} html header.top :is(.mburger,.burger,#burger,#agtBurger) svg path:not(:last-child){stroke-width:1.5px!important} html header.top :is(.mburger,.burger,#burger,#agtBurger) svg path:last-child{stroke:#fff!important;stroke-dasharray:0.1 5.7667!important;stroke-width:2px!important} html header.top :is(.mburger,.burger,#burger,#agtBurger){background:none!important;border:0!important;box-shadow:none!important;width:36px!important} html header.top :is(.mburger,.burger,#burger,#agtBurger) svg{width:30px!important;height:26px!important}} /* v17w (Richard, 11 Nov 2026): apps saved to the iPhone home screen open full screen under the clock and battery bar. The 48px top bar now sits below that bar (safe area) instead of hiding under it. Safari in the browser is unchanged (safe area 0). */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html header.top{height:calc(48px + env(safe-area-inset-top))!important;min-height:calc(48px + env(safe-area-inset-top))!important;padding-top:env(safe-area-inset-top)!important;box-sizing:border-box!important} } /* v17x (Richard, 11 Nov 2026): phone top bar on every platform: mark 22px (between the old 15 and 26), 9px to the wordmark, a little more room after the menu button, and the divider before the platform name a very light line */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html header.top .brand :is(.nlico,.lico),html header.top .brand>svg:first-child{width:22px!important;height:22px!important} html header.top .brand{gap:9px!important;margin-left:6px!important} html header.top .brand .bdv{display:block!important;width:1px!important;height:18px!important;background:rgba(243,234,255,.28)!important;opacity:1!important;border:0!important} } @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html body header.top{padding-left:8px!important;padding-right:12px!important} html body header.top :is(.mburger,.burger,#burger,#agtBurger){margin:0!important}} /* v17y (Richard): the platform mark was still 36px on phones (a v17u rule outranked v17x). One rule, measured: mark 20px, the wordmark is 15px. Menus: the frosted see-through look (no dots): dark colour at 78%, page blurred behind. */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ html body header.top .brand img:is(.nlico,.lico),html.nl body header.top .brand img.nlico,html body header.top .brand.lockup img.lico,html body header.top .brand>svg:first-child{width:20px!important;height:20px!important;min-width:20px!important;max-width:20px!important;max-height:20px!important} html:is(.pf-app,.pf-studio) body .mnav,html.nl body #side.open,html.pf-core body #adm #side.a-nav.open{ background:radial-gradient(60% 260px at 100% 0%,rgba(110,55,190,.30),transparent 70%) no-repeat,rgba(16,10,26,.78)!important;background-attachment:local,scroll!important; -webkit-backdrop-filter:blur(16px)!important;backdrop-filter:blur(16px)!important} } /* v17y: the top bar slide is a class on the bar itself (no page-wide restyle while scrolling), GPU-only movement */ @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){html body header.top.hdup{transform:translate3d(0,-100%,0)!important} html body header.top{will-change:transform;transition:transform .4s cubic-bezier(.22,.61,.36,1)!important}} @media (max-width:860px), (max-width:1400px) and (hover:none) and (pointer:coarse){ :where(html.pf-app) .in .dtool{top:calc(var(--mtop) + env(safe-area-inset-top))!important;transition:transform .4s cubic-bezier(.22,.61,.36,1)!important;will-change:transform} :where(html.pf-app) body.hdhide .in .dtool{transform:translate3d(0,calc(-1 * (var(--mtop) + env(safe-area-inset-top))),0)} html.pf-app body.hdhide header.top{transform:translate3d(0,-100%,0)!important} } /* v18e (Richard, 12 Nov 2026): App and Studio page chips (Home, Arguta OS ... Questions) centred on the computer, as on the Academy. Up to 1799px the page name and its buttons sit on the first line and the chips get their own centred line (they were squeezed between them, off centre and partly hidden behind Preview as). From 1800px all three share one line with the chips in the middle. */ @media (min-width:861px) and (max-width:1799px) and (hover:hover), (min-width:1401px) and (max-width:1799px){ html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar):has(>nav.apnav){grid-template-columns:minmax(0,1fr) auto!important;grid-template-areas:"by act" "nav nav"!important;row-gap:10px!important} html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar):has(>nav.apnav)>.by{grid-area:by!important} html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar):has(>nav.apnav)>.dbtn{grid-area:act!important} html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar):has(>nav.apnav)>nav.apnav{grid-area:nav!important;justify-self:center!important;max-width:100%} } @media (min-width:1800px){html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar):has(>nav.apnav){grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important} html:is(.pf-app,.pf-studio) :is(.dtool.hs,.snbar):has(>nav.apnav)>.dbtn{justify-self:end}} /* v18g (Richard, 12 Nov): with the Overview pinned, reading pages keep their centre column where it sits unpinned; it only moves left once the pinned panel would cover it. Studio keeps its canvas centred in the work area. */ @media (min-width:1101px) and (hover:hover), (min-width:1401px){html.nl:not(.pf-studio) .main.nlpinned .nlpanel .nlscroll>.cols{margin-left:clamp(0px,calc((100cqw + 392px - 1120px) / 2),calc(100cqw - 1136px))!important;margin-right:0!important}} /* v18g (Richard, 12 Nov): "brain" in the Intro headline "The AI brain behind your business" is the headline word again. The Business Brain page styles (#page .brain, .snd .brain) were shrinking it to 14px. */ :is(#page,.snd,#center,.doc) .hbr span.brain:is(span,#_){font:inherit!important;letter-spacing:inherit!important;color:var(--p-h,#f3eaff)!important} /* v18l (Richard, 12 Nov): App home task cards on desktop: the crew faces twice the size with a thin violet ring, so you can see who does the job */ @media (min-width:861px) and (hover:hover), (min-width:1401px){html.pf-app .exc:is(.exc,#_){grid-template-columns:80px 1fr!important;column-gap:16px!important;padding:14px 16px!important} html.pf-app .exc img:is(img,#_){width:80px!important;height:80px!important;border-width:1px!important}} /* v18l: when the centre column is narrow (Overview pinned, smaller screens) each card stacks: face on top, then the words, so nothing is squeezed */ @media (min-width:861px) and (hover:hover), (min-width:1401px){html.pf-app .ex{container-type:inline-size;container-name:exg}} @container exg (max-width:760px){html.pf-app .exc:is(.exc,#_){grid-template-columns:1fr!important;align-content:start;text-align:left} html.pf-app .exc img:is(img,#_){grid-row:auto!important;margin:0 0 10px!important}} /* v18m (Richard, 12 Nov): crew faces sit lower in their frames, so the top of the head is never cut (App task cards, the crew lists in the menus, chat and job faces). Pictures that set their own framing keep it */ img:is([src*="/faces/"],[src*="/crew/"]){object-position:50% 6%} /* v18x (Richard, 12 Nov 2026): computer screens. The App's six job cards come down to about three quarters of their size (face 80px to 60px, padding 14/16 to 10/12, so each card is 108px to 80px tall), and the App's portrait rings are 1px. */ @media (min-width:861px) and (hover:hover), (min-width:1401px){html.pf-app .exc:is(.exc,#_):is(.exc,#_){column-gap:12px!important;padding:10px 12px!important} html.pf-app .exc img:is(img,#_):is(img,#_){width:60px!important;height:60px!important} html.pf-app :is(.avahead img,.dtool .by img,.card header img,.herofaces img,.cm img){border-width:1px!important}} @container exg (min-width:761px){html.pf-app .exc:is(.exc,#_):is(.exc,#_){grid-template-columns:60px 1fr!important}} @container exg (max-width:760px){html.pf-app .exc img:is(img,#_):is(img,#_){margin:0 0 6px!important}}