/* App mock for ace.nikhilkale.com, ported 2026-10-20 from the meet-ace page (its "The app" section).
   2026-10-21: repainted in ACE Desktop's own tokens (11-Artifacts/files/ace-os/app/app.css, dark and .light),
   with a theme toggle and a quick-capture button in the title bar, as the app has. */
@font-face{font-family:'Instrument Sans';src:url('fonts/instrument-sans-latin.woff2') format('woff2');font-weight:400 700;font-style:normal;font-display:swap}
.appwin{
  --ease:cubic-bezier(0.16,1,0.3,1);
  --font-body:'Instrument Sans',-apple-system,system-ui,sans-serif;
  --font-mono:'JetBrains Mono','SF Mono',monospace;
  --font-script:'Instrument Serif',Georgia,serif;
  --bg-deep:#080a12;--bg-surface:#0c0e18;--bg-card:#101420;--bg-elevated:#141828;
  --lavender-rgb:200,160,240;--green-rgb:96,216,168;--expansion-rgb:224,128,160;
  --text:#d8d4e4;--text-mid:#b3b1cd;--text-dim:#8a88a8;
  --authority:#c8a0f0;--capacity:#60d8a8;--expansion:#e080a0;
  --border:rgba(140,120,255,0.10);--overlay-2:rgba(255,255,255,0.05);
  font-family:var(--font-body);color:var(--text);position:relative;
  transition:background-color .35s var(--ease),border-color .35s var(--ease);
}
.appwin.light{
  --bg-deep:#f0eef6;--bg-surface:#e8e6f0;--bg-card:#e4e1ee;--bg-elevated:#dedbe9;
  --lavender-rgb:74,56,176;--green-rgb:20,122,84;--expansion-rgb:176,56,104;
  --text:#16142e;--text-mid:#302e52;--text-dim:#5c5a78;
  --authority:#4a38b0;--capacity:#147a54;--expansion:#b03868;
  --border:rgba(80,70,140,0.18);--overlay-2:rgba(0,0,0,0.06);
  box-shadow:0 40px 120px rgba(0,0,0,0.45),0 0 60px rgba(74,56,176,0.10);
}
.appwin.light .orb .ow,.appwin.light .cad-ring .cn{color:var(--text)}
.appwin-wrap{margin-top:3rem}
.appwin-note{text-align:center;color:var(--text-dim);font-family:var(--mono);font-size:1.15rem;text-transform:uppercase;letter-spacing:0.16em;margin-top:2.4rem}
/* Title bar controls, as in the app */
.appbar{position:relative}
.appbar-right{margin-left:auto;display:flex;align-items:center;gap:0.6rem}
.appbar-btn{display:grid;place-items:center;width:3rem;height:3rem;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--text-dim);cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)}
.appbar-btn:hover,.appbar-btn[aria-expanded="true"]{background:rgba(var(--lavender-rgb),0.10);color:var(--text);border-color:var(--border)}
.appbar-btn:focus-visible{outline:2px solid var(--capacity);outline-offset:2px}
.mock-theme .i-moon{display:none}
.appwin.light .mock-theme .i-sun{display:none}
.appwin.light .mock-theme .i-moon{display:block}
.mock-capture-pop{position:absolute;top:calc(100% + 0.8rem);right:1.4rem;z-index:5;width:30rem;padding:1.4rem 1.6rem;border-radius:12px;background:var(--bg-elevated);border:1px solid var(--border);box-shadow:0 18px 50px rgba(0,0,0,0.35);display:flex;flex-direction:column;gap:0.8rem}
.mock-capture-pop[hidden]{display:none}
.mcp-label{font-family:var(--font-mono);font-size:0.95rem;text-transform:uppercase;letter-spacing:0.16em;color:var(--text-dim)}
.mock-capture-pop input{font:inherit;font-size:1.45rem;color:var(--text);background:var(--bg-card);border:1px solid var(--border);border-radius:8px;padding:0.9rem 1.1rem;outline:none}
.mock-capture-pop input:focus{border-color:rgba(var(--lavender-rgb),0.45)}
.mcp-hint{font-family:var(--font-mono);font-size:0.95rem;color:var(--text-dim)}
.mock-capture-toast{position:absolute;top:calc(100% + 0.8rem);right:1.4rem;z-index:5;padding:1rem 1.4rem;border-radius:10px;background:var(--bg-elevated);border:1px solid rgba(var(--green-rgb),0.35);color:var(--capacity);font-family:var(--font-mono);font-size:1.15rem}
.mock-capture-toast[hidden]{display:none}
/* Hero: members under the one call to action */
#heroSocial{flex-direction:column;align-items:center;gap:1.8rem}
.hero-members{display:inline-flex;align-items:center;gap:1.2rem;text-decoration:none;color:var(--text-mid);font-size:1.45rem}
.hero-faces{display:flex}
.hero-faces img{width:3.24rem;height:3.24rem;border-radius:50%;object-fit:cover;border:2px solid var(--bg);margin-left:-1.25rem;background:var(--bg-subtle)}
.hero-faces img:first-child{margin-left:0}
.hero-members-text b{color:var(--text);font-weight:500}
.hero-members:hover .hero-members-text{color:var(--text)}
@media(max-width:480px){.hero-faces img:nth-child(n+8){display:none}.hero-members{flex-direction:column;gap:0.8rem}}
.appwin{max-width:92rem;margin:0 auto;background:var(--bg-deep);border:1px solid var(--border);border-radius:16px;overflow:hidden;
    box-shadow:0 40px 120px rgba(0,0,0,0.6),0 0 60px rgba(var(--lavender-rgb),0.06)}
.appbar{display:flex;align-items:center;gap:0.8rem;padding:1.4rem 1.8rem;border-bottom:1px solid var(--border);background:var(--bg-surface)}
.dot{width:11px;height:11px;border-radius:50%}
.dot.r{background:#e0607a}
.dot.y{background:#e0c060}
.dot.g{background:#60d8a8}
.appbar .title{margin-left:1.2rem;font-family:var(--font-mono);font-size:1.15rem;color:var(--text-dim);letter-spacing:0.1em}
.appbody{display:grid;grid-template-columns:20rem 1fr;min-height:44rem}
.appnav{border-right:1px solid var(--border);padding:2rem 1.4rem;background:var(--bg-surface)}
.appnav .ni{display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem;border-radius:9px;font-size:1.5rem;color:var(--text-mid);margin-bottom:0.4rem}
.appnav .ni.on{background:rgba(var(--lavender-rgb),0.10);color:var(--text)}
.appnav .ni .ic{width:7px;height:7px;border-radius:50%;background:var(--text-dim)}
.appnav .ni.on .ic{background:var(--authority);box-shadow:0 0 8px var(--authority)}
.ni-cmds{margin-top:2rem;padding-top:1.6rem;border-top:1px solid var(--border)}
.ni-cmds-h{font-family:var(--font-mono);font-size:0.95rem;text-transform:uppercase;letter-spacing:0.16em;color:var(--text-dim);padding:0 1.2rem;margin-bottom:1rem}
.ni-cmds .cmd{display:block;font-family:var(--font-mono);font-size:1.35rem;color:var(--text-mid);padding:0.5rem 1.2rem}
.appmain{padding:2.4rem 3rem 3rem;display:flex;flex-direction:column}
.view-top{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);padding-bottom:1.4rem;margin-bottom:2.4rem}
.view-top .vn{font-family:var(--font-mono);font-size:1.1rem;text-transform:uppercase;letter-spacing:0.26em;color:var(--text-dim)}
.view-top .vs{width:1.6rem;height:1.6rem;border-radius:50%;border:1px solid var(--border);opacity:.55}
.you-here{text-align:center;margin-bottom:3rem}
.you-here .yh-eye{font-family:var(--font-mono);font-size:0.85rem;text-transform:uppercase;letter-spacing:0.32em;color:var(--text-dim);margin-bottom:1.1rem}
.you-here .yh-aff{font-family:var(--font-script);font-size:2.2rem;color:var(--authority);letter-spacing:-0.01em}
.you-here .yh-meta{font-family:var(--font-mono);font-size:0.9rem;text-transform:uppercase;letter-spacing:0.18em;color:var(--text-dim);margin-top:1.1rem}
.you-here .yh-track{height:4px;margin:1.6rem auto 0;max-width:78%;border-radius:2px;
    background:repeating-linear-gradient(90deg,var(--text-dim) 0 3px,transparent 3px 10px);opacity:.4}
.cmd-grid{display:grid;grid-template-columns:1fr 1.15fr 1fr;gap:2rem;align-items:center;flex:1}
.orb-col,.mid-col,.cad-col{text-align:center}
.orb{position:relative;width:15rem;height:15rem;margin:0 auto 1.6rem;border-radius:50%;display:grid;place-items:center;
    background:radial-gradient(circle at 42% 36%,rgba(var(--lavender-rgb),0.30),rgba(var(--lavender-rgb),0.06) 58%,transparent 72%);
    border:1px solid rgba(var(--lavender-rgb),0.18);box-shadow:0 0 60px rgba(var(--lavender-rgb),0.14),inset 0 0 42px rgba(var(--lavender-rgb),0.07)}
.orb .ow{font-family:var(--font-script);font-size:3.4rem;color:var(--text);line-height:1}
.orb .os{font-family:var(--font-mono);font-size:1rem;color:var(--text-dim);letter-spacing:0.14em;margin-top:0.6rem}
.orb-cap{font-family:var(--font-mono);font-size:0.9rem;text-transform:uppercase;letter-spacing:0.14em;color:var(--text-dim);line-height:1.55}
.orb-pulse{font-family:var(--font-mono);font-size:0.85rem;color:var(--capacity);margin-top:0.9rem;letter-spacing:0.08em}
.mid-col .mt{font-family:var(--font-script);font-size:2.1rem;color:var(--text)}
.mid-col .ms{font-family:var(--font-script);font-style:italic;font-size:1.5rem;color:var(--text-dim);margin-top:0.8rem;line-height:1.45}
.mid-col .mdots{display:flex;justify-content:center;gap:0.6rem;margin:1.8rem 0}
.mid-col .mdots i{width:8px;height:8px;border-radius:50%;display:block}
.mid-col .mdots i.g{background:var(--capacity)}
.mid-col .mdots i.o{background:var(--expansion)}
.mom-pill{display:inline-block;font-family:var(--font-mono);font-size:0.95rem;text-transform:uppercase;letter-spacing:0.14em;
    color:var(--expansion);border:1px solid rgba(var(--expansion-rgb),0.35);border-radius:999px;padding:0.6rem 1.4rem;background:rgba(var(--expansion-rgb),0.08)}
.mid-col .mp{font-family:var(--font-script);font-style:italic;font-size:1.5rem;color:var(--text-mid);margin-top:1.6rem}
.cad-ring{position:relative;width:13rem;height:13rem;margin:0 auto 1.4rem;border-radius:50%;display:grid;place-items:center;
    background:conic-gradient(var(--capacity) 0% 28%,var(--overlay-2) 28% 100%)}
.cad-ring::before{content:'';position:absolute;inset:10px;border-radius:50%;background:var(--bg-deep)}
.cad-ring .cn{position:relative;font-family:var(--font-script);font-size:3.4rem;color:var(--text);display:flex;align-items:baseline;gap:0.4rem}
.cad-ring .cn small{font-family:var(--font-mono);font-size:1.05rem;color:var(--text-dim);letter-spacing:0.1em}
.cad-since{font-family:var(--font-mono);font-size:0.85rem;text-transform:uppercase;letter-spacing:0.16em;color:var(--text-dim)}
.cad-label{font-family:var(--font-mono);font-size:0.85rem;text-transform:uppercase;letter-spacing:0.22em;color:var(--text-dim);margin-top:1.4rem}
.cad-stats{display:flex;justify-content:center;gap:1.8rem;margin-top:0.7rem;font-family:var(--font-mono);font-size:1.15rem}
.cad-stats .w{color:var(--capacity)}
.cad-stats .m{color:var(--authority)}
.appnav .ni{cursor:pointer;transition:background .25s var(--ease),color .25s var(--ease)}
.appnav .ni:hover{background:rgba(var(--lavender-rgb),0.06);color:var(--text)}
.ni-cmds .cmd{cursor:pointer;border-radius:7px;transition:background .25s var(--ease),color .25s var(--ease)}
.ni-cmds .cmd:hover,.ni-cmds .cmd.on{background:rgba(var(--green-rgb),0.08);color:var(--capacity)}
.appwin.auto .appnav .ni.on{animation:niSweep 0.8s var(--ease)}
.appwin.auto .view-top .vs{border-color:var(--capacity);opacity:1;box-shadow:0 0 8px rgba(var(--green-rgb),0.4);animation:blink 1.6s var(--ease) infinite}
.mviews{display:grid;flex:1}
.mview{grid-area:1/1;display:flex;flex-direction:column;justify-content:center;visibility:hidden;opacity:0;transform:translateY(8px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.mview.on{visibility:visible;opacity:1;transform:none}
.term{max-width:56rem;margin:0 auto;width:100%;background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:2.4rem 2.8rem;font-family:var(--font-mono)}
.term .tline{font-size:1.4rem;color:var(--text-mid);padding:0.7rem 0;display:flex;gap:1.1rem;align-items:baseline}
.term .tline.u{color:var(--text);font-size:1.5rem}
.term .tick{color:var(--capacity);flex-shrink:0}
.term .tick.s{animation:blink 1.6s var(--ease) infinite}
.vnote{font-family:var(--font-script);font-style:italic;font-size:1.5rem;color:var(--text-dim);text-align:center;margin-top:2.6rem}
.aglist{max-width:56rem;margin:0 auto;width:100%}
.agrow{display:flex;align-items:center;gap:1.4rem;padding:1.3rem 0.4rem;border-bottom:1px solid var(--border);font-size:1.45rem}
.agrow:last-of-type{border-bottom:none}
.agrow .adot{width:8px;height:8px;border-radius:50%;background:var(--text-dim);flex-shrink:0}
.agrow .adot.live{background:var(--capacity);box-shadow:0 0 8px var(--capacity);animation:blink 1.6s var(--ease) infinite}
.agrow b{display:block;font-weight:500;color:var(--text)}
.agrow .sub{display:block;font-family:var(--font-mono);font-size:1.05rem;color:var(--text-dim);margin-top:0.2rem}
.agrow em{margin-left:auto;font-style:normal;font-family:var(--font-mono);font-size:1.05rem;text-transform:uppercase;letter-spacing:0.12em;color:var(--text-dim);flex-shrink:0}
.agrow em.live{color:var(--capacity)}
.ktiles{display:grid;grid-template-columns:repeat(3,1fr);gap:1.8rem;max-width:62rem;margin:0 auto;width:100%}
.ktile{background:var(--bg-card);border:1px solid var(--border);border-radius:14px;padding:2.2rem;text-align:center}
.ktile .kh{font-family:var(--font-mono);font-size:1rem;text-transform:uppercase;letter-spacing:0.16em;color:var(--authority)}
.ktile p{font-size:1.35rem;color:var(--text-mid);margin-top:0.9rem;line-height:1.5}
.ktile .ktag{display:inline-block;margin-top:1.3rem;font-family:var(--font-mono);font-size:0.95rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--capacity);border:1px solid rgba(var(--green-rgb),0.3);border-radius:999px;padding:0.3rem 1rem}
.orb.breath{background:radial-gradient(circle at 42% 36%,rgba(var(--green-rgb),0.25),rgba(var(--green-rgb),0.05) 58%,transparent 72%);border-color:rgba(var(--green-rgb),0.18);box-shadow:0 0 60px rgba(var(--green-rgb),0.12),inset 0 0 42px rgba(var(--green-rgb),0.06)}
.term .tline.type{opacity:0;transform:translateY(6px);animation:tlineIn .5s var(--ease) forwards;animation-delay:var(--td,0s)}
.appwin{transform-style:preserve-3d}
@keyframes niSweep{0%{background:rgba(var(--lavender-rgb),0.30);transform:translateX(3px)}100%{background:rgba(var(--lavender-rgb),0.10);transform:none}}
@keyframes blink{0%,100%{opacity:1}50%{opacity:0.35}}
@keyframes tlineIn{to{opacity:1;transform:none}}
.term .tline.type{opacity:0;transform:translateY(6px);animation:tlineIn .5s var(--ease) forwards;animation-delay:var(--td,0s)}
@media(max-width:860px){
  .appbody{grid-template-columns:1fr}
  .appnav{display:none}
  .cmd-grid{grid-template-columns:1fr;gap:3rem}
  .appmain{min-width:0;padding:2rem 1.6rem 2.4rem}
  .mviews,.mview{min-width:0}
  .ktiles{grid-template-columns:1fr;gap:1.2rem}
  .term{padding:1.8rem 1.6rem}
  .agrow em{display:none}
}
@media(prefers-reduced-motion:reduce){
  .term .tline.type{animation:none!important;opacity:1!important;transform:none!important}
  .appwin.auto .appnav .ni.on,.appwin.auto .view-top .vs,.term .tick.s,.agrow .adot.live{animation:none!important}
}