/* Ctrl One 3.6 simulation: the app's own look (obsidian #0A0A0E, mint #63E6BE, borderless rounded controls) */
.c1wrap{max-width:1120px;margin:0 auto}
.c1bar{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center;justify-content:space-between;margin:0 0 12px}
.c1os{display:inline-flex;background:rgba(255,255,255,.08);border-radius:999px;padding:4px}
.c1os button{all:unset;cursor:pointer;padding:8px 16px;border-radius:999px;font-size:14px;font-weight:600;color:rgba(255,255,255,.75);min-height:28px;display:inline-flex;align-items:center}
.c1os button[aria-pressed=true]{background:#63E6BE;color:#06231C}.c1os button:focus-visible{outline:2px solid #63E6BE;outline-offset:2px}
.c1note{font-size:13.5px;color:rgba(255,255,255,.72)}
.c1{--bg:#0A0A0E;--side:#101015;--pop:#1C1C22;--tx:#F5F5F7;--mu:#8E8E93;--ink:255,255,255;--acc:#63E6BE;--onacc:#0A0A0E;--card:rgba(255,255,255,.05);--hov:rgba(255,255,255,.09);--line:rgba(255,255,255,.07);--soft:rgba(99,230,190,.18);--warn:#FFB340;--ok:#30D158;--live:#FF5C8A;
 position:relative;border-radius:14px;overflow:hidden;background:var(--bg);color:var(--tx);font:13px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,Ubuntu,sans-serif;box-shadow:0 30px 80px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.08);text-align:left;transition:background .6s}
.c1[data-theme=light]{--bg:#F6F6F8;--side:#EDEDF0;--pop:#fff;--tx:#1D1D1F;--mu:#6E6E73;--ink:0,0,0;--acc:#007A6C;--onacc:#fff;--card:rgba(0,0,0,.05);--hov:rgba(0,0,0,.09);--line:rgba(0,0,0,.10);--soft:rgba(0,168,150,.16)}
.c1[data-theme=colour]{--side:rgba(255,255,255,.04);--tx:#fff;--card:rgba(255,255,255,.07);--hov:rgba(255,255,255,.12);--line:rgba(255,255,255,.13)}
.c1 .bd{position:absolute;inset:0;opacity:0;transition:opacity .7s;pointer-events:none}.c1[data-theme=colour] .bd{opacity:1}
.c1 .bd i{position:absolute;border-radius:50%;filter:blur(40px);transition:background 1s}
.c1 *{box-sizing:border-box}
/* title bars */
.c1 .qtb{position:relative;height:34px;display:flex;align-items:center;padding:0 0 0 12px;font-size:12px;color:var(--mu);background:var(--side);user-select:none}
.c1 .qtb img{width:16px;height:16px;margin-right:8px;border-radius:4px}
.c1 .qwc{margin-left:auto;display:flex;height:100%}.c1 .qwc i{width:44px;display:grid;place-items:center;font-style:normal;font-size:12px}
.c1[data-os=linux] .qtb{justify-content:center;padding:0 10px;font-weight:600;color:var(--tx)}.c1[data-os=linux] .qtb img{position:absolute;left:12px}
.c1[data-os=linux] .qwc{position:absolute;right:8px;gap:6px;align-items:center}.c1[data-os=linux] .qwc i{width:20px;height:20px;border-radius:50%;background:rgba(var(--ink),.12);font-size:10px}
.c1[data-os=linux] .qwc i:last-child{background:#E8564A;color:#fff}
/* window body */
.c1 .qwb{position:relative;z-index:1;display:flex;height:560px;overflow:hidden}.c1 .qtb,.c1 .qtk{z-index:1}.c1 .mn{min-height:0}.c1 .qpg{min-height:0}
.c1 .qsd{width:206px;flex:none;background:var(--side);padding:12px 10px;display:flex;flex-direction:column;gap:8px;transition:background .6s}
.c1 .qbr{display:flex;align-items:center;gap:9px;font-weight:700;font-size:14px;padding:2px 2px 4px}.c1 .qbr img{width:26px;height:26px;border-radius:7px;box-shadow:0 0 0 1px rgba(255,255,255,.15)}
.c1 .srch{all:unset;cursor:pointer;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;background:var(--card);color:var(--mu);font-size:12.5px}.c1 .srch kbd{margin-left:auto;font:inherit;font-size:11px;opacity:.8}
.c1 .qnav{display:flex;flex-direction:column;gap:1px;overflow:auto;scrollbar-width:none}.c1 .qnav::-webkit-scrollbar{display:none}
.c1 .qnav button{all:unset;cursor:pointer;display:flex;align-items:center;gap:9px;padding:7px 10px;border-radius:10px;font-size:13px;white-space:nowrap}
.c1 .qnav button:hover{background:var(--hov)}.c1 .qnav button[aria-current=true]{background:var(--soft);font-weight:600}.c1 .qnav button:focus-visible,.c1 button:focus-visible{outline:2px solid var(--acc);outline-offset:1px}
.c1 .qnav svg{width:16px;height:16px;flex:none}
.c1 .env{margin-top:auto;font-size:10.5px;color:var(--mu)}
.c1 .mn{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}
.c1 .hd{padding:16px 24px 6px}.c1 .hd h3{all:unset;display:block;font-size:20px;font-weight:700;letter-spacing:-.2px}.c1 .hd p{margin:2px 0 0;font-size:12.5px;color:var(--mu)}
.c1 .qpg{flex:1;overflow:auto;padding:6px 24px 22px;scrollbar-width:thin}
.c1 .qcard{background:var(--card);border-radius:14px;padding:14px 16px;margin-bottom:10px;transition:background .6s}
.c1 .eb{font-size:10.5px;font-weight:700;letter-spacing:.06em;color:var(--acc);text-transform:uppercase}
.c1 .qmut{color:var(--mu)}.c1 .sm{font-size:12px}
.c1 .btn{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:10px;background:var(--hov);font-size:12.5px;font-weight:600;white-space:nowrap}
.c1 .btn:hover{background:rgba(var(--ink),.14)}.c1 .btn.qpri{background:var(--acc);color:var(--onacc)}.c1 .btn.qpri:hover{filter:brightness(1.08)}
.c1 .row2{display:grid;grid-template-columns:1.5fr 1fr;gap:10px}
.c1 .rn{background:linear-gradient(120deg,rgba(var(--ink),.06),var(--soft));border-radius:16px;padding:16px 18px;margin-bottom:10px;transition:background .6s}
.c1 .rn h4{all:unset;display:block;font-size:19px;font-weight:700;margin:2px 0 4px}.c1 .rn .acts{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.c1 .chg{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:3px;font-size:12.5px}.c1 .chg li{display:flex;gap:8px;align-items:center;opacity:0;transform:translateY(4px);transition:.25s}.c1 .chg li.qon{opacity:1;transform:none}
.c1 .chg li i{width:15px;height:15px;border-radius:50%;background:var(--acc);display:grid;place-items:center;flex:none}.c1 .chg li i::after{content:"";width:6px;height:3px;border:solid var(--onacc);border-width:0 0 2px 2px;transform:rotate(-45deg) translate(1px,-1px)}
.c1 .rings{display:grid;gap:10px}.c1 .rg{display:flex;align-items:center;gap:12px}.c1 .rg svg{width:64px;height:64px;flex:none}
.c1 .rg .tr{stroke:rgba(var(--ink),.1)}.c1 .rg .qfg{stroke:var(--acc);transition:stroke-dashoffset 1.2s cubic-bezier(.3,.8,.3,1),stroke .4s}.c1 .rg text{fill:var(--tx);font:700 17px system-ui,sans-serif}
.c1 .qsec{display:flex;align-items:center;justify-content:space-between;margin:12px 0 8px;font-weight:700;font-size:14px}
.c1 .modes{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.c1 .qmode{all:unset;cursor:pointer;background:var(--card);border-radius:12px;padding:10px;display:flex;align-items:center;gap:9px;box-shadow:inset 0 0 0 2px transparent;transition:box-shadow .3s,background .3s}
.c1 .qmode:hover{background:var(--hov)}.c1 .qmode.qon{box-shadow:inset 0 0 0 2px var(--acc);background:var(--soft)}
.c1 .qmode .qmi{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;flex:none}.c1 .qmode .qmi svg{width:16px;height:16px}
.c1 .qmode b{display:block;font-size:13px}.c1 .qmode small{font-size:11px;color:var(--mu)}
.c1 .tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.c1 .qtile{all:unset;cursor:pointer;background:var(--card);border-radius:12px;padding:10px 12px;min-height:62px;display:flex;flex-direction:column;justify-content:space-between;gap:6px;transition:background .3s}
.c1 .qtile:hover{background:var(--hov)}.c1 .qtile.qon{background:var(--soft)}.c1 .qtile b{font-size:12.5px}.c1 .qtile small{font-size:11px;color:var(--mu)}.c1 .qtile.qon small{color:var(--acc)}
.c1 .qtile .ti{width:24px;height:24px;border-radius:50%;background:rgba(var(--ink),.08);display:grid;place-items:center}.c1 .qtile.qon .ti{background:var(--acc);color:var(--onacc)}.c1 .qtile .ti svg{width:13px;height:13px}
.c1 .wk{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.c1 .wk b{display:block;font-size:17px}
.c1 .qsw{all:unset;cursor:pointer;width:36px;height:21px;border-radius:999px;background:rgba(var(--ink),.18);position:relative;flex:none;transition:background .25s}
.c1 .qsw::after{content:"";position:absolute;left:3px;top:3px;width:15px;height:15px;border-radius:50%;background:#fff;transition:transform .25s;box-shadow:0 1px 2px rgba(0,0,0,.3)}
.c1 .qsw[aria-checked=true]{background:var(--acc)}.c1 .qsw[aria-checked=true]::after{transform:translateX(15px)}.c1 .qsw[aria-disabled=true]{opacity:.4;cursor:not-allowed}
.c1 .lst{display:grid;gap:4px}.c1 .li{display:flex;align-items:center;gap:12px;background:var(--card);border-radius:12px;padding:10px 12px;transition:opacity .4s,transform .4s,background .3s}
.c1 .li .tx{flex:1;min-width:0}.c1 .li b{font-size:13px;display:block}.c1 .li small{font-size:11.5px;color:var(--mu)}
.c1 .qst{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;flex:none;font-weight:800;font-size:12px;transition:background .3s}
.c1 .qst.w{background:rgba(255,179,64,.18);color:var(--warn)}.c1 .qst.k{background:rgba(48,209,88,.18);color:var(--ok)}
.c1 .pill{font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px;background:rgba(var(--ink),.08);white-space:nowrap}.c1 .pill.live{background:rgba(255,92,138,.18);color:var(--live)}
.c1 .ai2{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;color:#fff;font-weight:700;flex:none;font-size:13px}
.c1 table{width:100%;border-collapse:separate;border-spacing:0 4px;font-size:12.5px}.c1 th{font-size:11px;color:var(--mu);font-weight:600;text-align:left;padding:2px 10px}
.c1 td{background:var(--card);padding:8px 10px}.c1 td:first-child{border-radius:10px 0 0 10px}.c1 td:last-child{border-radius:0 10px 10px 0}
.c1 tr.qsel td{background:var(--soft)}.c1 tr.qgone{opacity:0;transition:opacity .5s}.c1 tbody tr{cursor:pointer}
.c1 .gr4{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px}.c1 .gr4 .qcard{margin:0;padding:10px 12px}.c1 .gr4 b{font-size:16px;display:block}.c1 .gr4 canvas{width:100%;height:34px;display:block;margin-top:4px}
.c1 .cf{background:var(--pop);border-radius:14px;padding:14px;box-shadow:0 10px 30px rgba(0,0,0,.35);margin:8px 0}
.c1 .seg{display:inline-flex;background:var(--card);border-radius:10px;padding:3px;gap:2px;flex-wrap:wrap}.c1 .seg button{all:unset;cursor:pointer;padding:6px 12px;border-radius:8px;font-size:12.5px;color:var(--mu)}
.c1 .seg button[aria-pressed=true]{background:rgba(var(--ink),.12);color:var(--tx);font-weight:600}
.c1 .pals{display:flex;gap:10px;flex-wrap:wrap}.c1 .pal{all:unset;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:var(--mu)}
.c1 .pal i{width:56px;height:42px;border-radius:10px;box-shadow:inset 0 0 0 2px transparent;transition:box-shadow .25s,transform .25s}.c1 .pal:hover i{transform:translateY(-2px)}.c1 .pal[aria-pressed=true] i{box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--acc)}
.c1 .setrow{display:flex;align-items:center;gap:14px;justify-content:space-between;padding:12px 0;border-top:1px solid var(--line)}.c1 .setrow:first-of-type{border-top:0}.c1 .setrow b{display:block}
.c1 .qsoon{display:grid;place-items:center;text-align:center;height:100%;color:var(--mu);gap:8px}
/* taskbar / panel with the tray icon */
.c1 .qtk{height:40px;display:flex;align-items:center;gap:8px;padding:0 10px;background:rgba(20,20,26,.92);color:#EDEDF2;font-size:11.5px;position:relative;z-index:3}
.c1 .qtk .sp{flex:1}.c1 .qtk .ap{width:26px;height:26px;border-radius:6px;background:rgba(255,255,255,.08)}
.c1[data-os=win] .qtk{justify-content:center}.c1[data-os=win] .qtk .sp{display:none}.c1[data-os=win] .qtk .rt{position:absolute;right:10px;display:flex;align-items:center;gap:10px}
.c1[data-os=linux] .qtk{background:#2B2B2E}.c1[data-os=linux] .qtk .rt{display:flex;align-items:center;gap:10px}
.c1 .tray{all:unset;cursor:pointer;width:28px;height:28px;border-radius:7px;display:grid;place-items:center;position:relative}.c1 .tray:hover,.c1 .tray[aria-expanded=true]{background:rgba(255,255,255,.12)}
.c1 .tray img{width:18px;height:18px;border-radius:4px}.c1 .tray::after{content:"";position:absolute;inset:-3px;border-radius:9px;box-shadow:0 0 0 2px #63E6BE;opacity:0;animation:c1hint 2.4s ease-in-out 1.5s 3}
@keyframes c1hint{50%{opacity:1}}
.c1 .qp{position:absolute;right:10px;bottom:48px;width:340px;max-width:calc(100% - 20px);max-height:calc(100% - 90px);overflow:auto;background:var(--pop);border-radius:16px;padding:12px;box-shadow:0 20px 50px rgba(0,0,0,.5),0 0 0 1px rgba(var(--ink),.08);z-index:5;transform-origin:bottom right;animation:c1qp .2s ease}
@keyframes c1qp{from{opacity:0;transform:scale(.96) translateY(6px)}}
.c1 .qp .us{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-bottom:8px}.c1 .qp .us div{background:var(--card);border-radius:10px;padding:6px 8px;font-size:10.5px;color:var(--mu)}.c1 .qp .us b{display:block;color:var(--tx);font-size:13px}
.c1 .qp .chips{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}.c1 .chip{all:unset;cursor:pointer;border:1px solid var(--line);border-radius:13px;padding:5px 11px;font-size:12px}.c1 .chip.qon{background:var(--acc);color:var(--onacc);border-color:var(--acc);font-weight:600}
.c1 .qp .tiles{grid-template-columns:repeat(3,1fr);gap:6px}.c1 .qp .qtile{min-height:54px;padding:8px 10px}
.c1 .qp h5{all:unset;display:block;font-size:11px;font-weight:700;color:var(--mu);margin:10px 0 6px}
.c1 .qrow{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 0;font-size:12.5px}
.c1 select{font:inherit;font-size:12px;background:var(--card);color:var(--tx);border:0;border-radius:8px;padding:5px 8px;max-width:170px}
.c1 .tipq{font-size:11px;color:var(--mu);margin:-2px 0 4px}
.c1 .toast{position:absolute;left:50%;bottom:54px;transform:translate(-50%,10px);background:var(--pop);color:var(--tx);border-radius:12px;padding:9px 14px;font-size:12.5px;font-weight:600;box-shadow:0 10px 30px rgba(0,0,0,.4);opacity:0;transition:.3s;pointer-events:none;z-index:6;white-space:nowrap}
.c1 .toast.qon{opacity:1;transform:translate(-50%,0)}
.c1 .about{display:flex;align-items:center;gap:10px;margin-top:8px}.c1 .about img{height:22px;width:auto}
/* phones and narrow tablets: one page at a time, sidebar becomes a tab strip */
@media (max-width:760px){
 .c1 .qwb{flex-direction:column;height:600px}.c1 .qsd{width:auto;padding:8px 8px 6px;gap:6px}.c1 .qbr,.c1 .srch,.c1 .env{display:none}
 .c1 .qnav{flex-direction:row;overflow-x:auto;gap:4px}.c1 .qnav button{padding:7px 10px;font-size:12.5px}.c1 .qnav svg{display:none}
 .c1 .hd{padding:12px 14px 4px}.c1 .qpg{padding:4px 14px 16px}.c1 .row2{grid-template-columns:1fr}.c1 .modes,.c1 .tiles,.c1 .gr4{grid-template-columns:1fr 1fr}.c1 .wk{grid-template-columns:1fr 1fr 1fr}
 .c1 .rings{grid-template-columns:1fr 1fr}.c1 table .hm{display:none}.c1 .qtk .ap{display:none}.c1 .toast{white-space:normal;width:max-content;max-width:90%}
}
@media (prefers-reduced-motion:reduce){.c1 *{transition:none!important;animation:none!important}}