/* generated from v3.4/index.html "live demos" — scoped under .sim */
.sim .demo-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.sim .demo-head b{font-size:17px}
.sim .demo-head .btn{margin-left:auto}
.sim .ex{font-family:var(--hud);font-weight:700;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--amber);border:1px solid rgba(255,176,32,.55);padding:2px 7px}
.sim .muted{color:var(--ink-3);font-size:14px}
.sim .cal-legend{display:flex;gap:14px;margin-bottom:10px;font-size:13px}
.sim .lg::before{content:"";display:inline-block;width:10px;height:10px;margin-right:6px;vertical-align:-1px}
.sim .lg.feed::before,.sim .cal-cell.feed{--c:var(--holo)}
.sim .lg.reel::before,.sim .cal-cell.reel{--c:#C792FF}
.sim .lg.google::before,.sim .cal-cell.google{--c:var(--amber)}
.sim .lg::before{background:var(--c)}
.sim .cal-wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;align-items:start}
.sim .cal-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}
@media(max-width:600px){.sim .cal-cell i{display:none}
}
.sim .cal-dow{font-family:var(--hud);font-size:12px;letter-spacing:.1em;color:var(--ink-3);text-align:center;padding-bottom:4px}
.sim .cal-cell{aspect-ratio:1;border:1px solid rgba(79,216,255,.12);background:rgba(3,14,22,.6);display:flex;flex-direction:column;justify-content:space-between;padding:5px;text-align:left;font-size:12.5px;color:var(--ink-3)}
.sim .cal-cell.empty{border:0;background:none}
.sim .cal-cell.has{color:var(--ink);border-color:var(--c);cursor:pointer;box-shadow:inset 0 -3px 0 var(--c)}
.sim .cal-cell.has:hover,.sim .cal-cell.sel{background:rgba(79,216,255,.12);box-shadow:inset 0 -3px 0 var(--c),0 0 14px rgba(79,216,255,.2)}
.sim .cal-cell.sel{outline:1px solid var(--c)}
.sim .cal-cell i{font-style:normal;font-size:10.5px;color:var(--c);line-height:1.2}
.sim .post{border:1px solid var(--line-2);background:#06121B}
.sim .post-img{aspect-ratio:1;display:grid;place-items:center;background:radial-gradient(circle at 30% 30%,rgba(79,216,255,.35),transparent 60%),linear-gradient(135deg,#0E2B3D,#061019)}
.sim .post.reel .post-img{aspect-ratio:9/12;background:radial-gradient(circle at 70% 30%,rgba(199,146,255,.4),transparent 60%),linear-gradient(160deg,#241638,#08060F)}
.sim .post.google .post-img{aspect-ratio:16/10;background:radial-gradient(circle at 30% 60%,rgba(255,176,32,.35),transparent 60%),linear-gradient(135deg,#2A1E08,#0B0804)}
.sim .post-img span{font-family:var(--hud);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:13px;color:var(--ink);border:1px solid var(--line-2);padding:4px 10px;background:rgba(0,0,0,.35)}
.sim .post-body{padding:12px 14px}
.sim .post-body p{margin-top:4px;font-size:15px}
.sim .post-body small{color:var(--ink-3);font-size:12.5px}
.sim .auto-cols{display:grid;grid-template-columns:1fr 1fr 1.2fr;gap:14px}
.sim .auto-col{border:1px solid var(--line);background:rgba(3,14,22,.55);padding:12px;min-height:280px}
.sim .auto-col h4{margin-bottom:10px}
.sim .chat{display:flex;flex-direction:column;gap:8px}
.sim .bubble{max-width:90%;padding:8px 12px;font-size:14px;line-height:1.5;animation:rise .35s var(--ease) both}
.sim .bubble.c{align-self:flex-start;background:#FEE500;color:#2A1A1A;border-radius:2px 12px 12px 12px}
.sim .bubble.a{align-self:flex-end;background:rgba(79,216,255,.16);border:1px solid var(--holo);color:var(--ink);border-radius:12px 2px 12px 12px}
.sim .otable{width:100%;border-collapse:collapse;font-size:13.5px;font-variant-numeric:tabular-nums}
.sim .otable th{text-align:left;font-family:var(--hud);font-weight:600;letter-spacing:.1em;font-size:12px;color:var(--ink-3);padding:5px 4px;border-bottom:1px solid var(--line)}
.sim .otable td{padding:6px 4px;border-bottom:1px solid rgba(79,216,255,.08)}
.sim .otable tr.in{animation:rise .35s var(--ease) both}
.sim .otable tfoot td{font-weight:800;color:var(--holo);border-bottom:0}
.sim .otable tfoot td:last-child{text-align:right}
.sim span.chip,.sim span.chip:hover{border-color:transparent;color:inherit;background:rgba(79,216,255,.07);font-weight:600}
.sim .otable td:nth-child(n+3),.sim .otable th:nth-child(n+3){text-align:right}
.sim p.wait{margin:10px 0;font-size:13.5px;color:var(--amber)}
.sim .okd{margin-top:10px;font-weight:800;color:#7BE09B}
.sim .kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.sim .kpis div{border:1px solid var(--line);padding:12px 14px;background:rgba(3,14,22,.55)}
.sim .kpis span{display:block;font-size:13px;color:var(--ink-3)}
.sim .kpis b{display:block;font-family:var(--hud);font-weight:700;font-size:32px;color:var(--holo);line-height:1.1;margin-top:4px}
.sim .kpis small{display:block;font-size:12px;color:var(--ink-3)}
.sim .kpis .warn{border-color:rgba(255,90,71,.5)}
.sim .kpis .warn b{color:var(--red)}
.sim .bars{list-style:none;display:grid;gap:7px;margin-top:10px}
.sim .bars li{display:grid;grid-template-columns:minmax(110px,170px) 1fr 70px;gap:10px;align-items:center;font-size:13.5px}
.sim .bt{height:10px;background:rgba(79,216,255,.08);position:relative}
.sim .bt i{position:absolute;inset:0 auto 0 0;background:var(--holo);box-shadow:0 0 10px rgba(79,216,255,.5);animation:grow .9s var(--ease) both}
.sim .bars li.slow .bt i{background:var(--red);box-shadow:0 0 10px rgba(255,90,71,.5)}
.sim .bars li.slow .bn{color:#FFB3A8}
.sim .bv{font-family:var(--hud);text-align:right;color:var(--ink-2)}
@keyframes grow{from{transform:scaleX(0);transform-origin:left}
to{transform:scaleX(1);transform-origin:left}
}
.sim .qs{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.sim .qs .chip{cursor:pointer;background:none}
.sim .qs .chip.on{border-color:var(--holo);color:var(--holo);background:rgba(79,216,255,.1)}
.sim .answer{margin-top:12px;min-height:3em}
.sim .answer .q{font-size:13.5px;color:var(--ink-3)}
.sim .answer .a{margin-top:6px;padding:12px 14px;border-left:2px solid var(--holo);background:rgba(79,216,255,.07);animation:rise .35s var(--ease) both}
.sim .map-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.sim .map-col{border:1px solid var(--line);background:rgba(3,14,22,.55);padding:14px}
.sim .map-col h4{font-size:17px}
.sim .map-col small{display:block;font-size:13px;color:var(--ink-3)}
.sim .map-col ul{list-style:none;margin-top:10px;display:grid;gap:6px}
.sim .map-col li{padding:8px 10px;font-size:14.5px;border:1px solid rgba(79,216,255,.14)}
.sim .map-col.c0{border-color:var(--holo)}
.sim .map-col.c0 h4{color:var(--holo)}
.sim .map-col.c1 h4{color:var(--ink)}
.sim .map-col.c2{border-color:rgba(255,176,32,.6)}
.sim .map-col.c2 h4{color:var(--amber)}
.sim .map-col.c2 li{border-style:dashed;border-color:rgba(255,176,32,.35)}
.sim .tl{list-style:none;display:grid;gap:0;border-left:1px solid var(--line-2);margin-left:6px}
.sim .tl li{position:relative;display:grid;grid-template-columns:52px 110px 1fr;gap:10px;padding:9px 0 9px 18px;font-size:14.5px}
.sim .tl li::before{content:"";position:absolute;left:-5px;top:15px;width:9px;height:9px;transform:rotate(45deg);background:var(--void);border:1.5px solid var(--holo)}
.sim .tl .tm{font-family:var(--hud);color:var(--holo)}
.sim .tl li > span:last-child{color:var(--ink-2)}
.sim .tl li.brk{opacity:.55}
.sim .ui-thumb{display:grid;place-items:center;background:radial-gradient(circle at 50% 55%,rgba(79,216,255,.2),transparent 62%),repeating-linear-gradient(0deg,rgba(79,216,255,.07) 0 1px,transparent 1px 16px),#03111C}
.sim .ui-thumb svg{width:30%;height:auto;color:var(--holo);filter:drop-shadow(0 0 10px rgba(79,216,255,.65));transition:transform .5s var(--ease)}
@media(hover:hover){.sim .sc-card:hover .ui-thumb svg{transform:scale(1.06)}
.sim .dev button:not([aria-pressed="true"]):hover{color:var(--holo)}
}
.sim .btn:active,.sim button.chip:active,.sim .dev button:active,.sim .m-btn:active{transform:scale(.97)}
.sim .tile:active,.sim .sc-card:active,.sim .rec:active{transform:scale(.99)}
.sim .ui-thumb .tag{position:absolute;left:10px;bottom:8px;z-index:1;font-family:var(--hud);font-weight:600;font-size:11.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--holo-2)}
.sim .demo-foot{margin-top:12px;font-size:13px;line-height:1.6}
.sim .try{margin-top:16px;padding:14px;border:1px dashed var(--line-2);background:rgba(79,216,255,.04)}
.sim .try h4{margin-bottom:10px}
.sim .try-row{display:flex;flex-wrap:wrap;gap:8px}
.sim .try-row input,.sim .try-row textarea,.sim .try-row select,.sim .qty-in{min-width:0;min-height:44px;padding:9px 12px;font:inherit;font-size:16px;color:var(--ink);background:rgba(3,10,16,.75);border:1px solid var(--line-2);border-radius:0}
.sim .try-row input,.sim .try-row select{flex:1 1 140px}
.sim .try-row textarea{flex:1 1 100%;resize:vertical}
.sim .try-row :focus-visible,.sim .qty-in:focus-visible{outline:2px solid var(--holo);outline-offset:1px}
.sim .qty-in{width:76px;min-height:38px;padding:5px 8px;font-variant-numeric:tabular-nums}
.sim .dev.push{margin-left:auto}
.sim .tscroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:14px}
.sim .tscroll .otable{min-width:520px}
.sim .modal{grid-template-columns:minmax(0,1fr)}
.sim .m-win,.sim .of-cols > *,.sim .ar-out > *,.sim .pos-two > *{min-width:0}
.sim .otable .chip{margin:0;padding:6px 12px;min-height:44px;font-size:13px;cursor:pointer;background:none}
.sim .otable small{display:block;font-size:12px}
.sim .chat.ch-sms .bubble.c{background:#E9E9EB;color:#111;border-radius:14px 14px 14px 4px}
.sim .chat.ch-sms .bubble.a{background:#34C759;border-color:#34C759;color:#fff;border-radius:14px 14px 4px 14px}
.sim .chat.ch-wa .bubble.c{background:#1F2C34;color:#E9EDEF;border-radius:2px 10px 10px 10px}
.sim .chat.ch-wa .bubble.a{background:#005C4B;border-color:#005C4B;color:#E9EDEF;border-radius:10px 2px 10px 10px}
.sim .chat.ch-email .bubble{max-width:100%;align-self:stretch;border-radius:0;background:rgba(232,246,255,.05);color:var(--ink);border:0;border-left:2px solid var(--ink-3)}
.sim .chat.ch-email .bubble.a{border-left-color:var(--holo);background:rgba(79,216,255,.07)}
.sim .aging td:nth-child(n+2),.sim .aging th:nth-child(n+2){text-align:right}
.sim .aging td.late1{color:var(--amber)}
.sim .aging td.late2{color:#FF8A5C}
.sim .aging td.late3{color:var(--red);font-weight:800}
.sim .otable tr.late td,.sim .otable tr.flag td{color:var(--amber)}
.sim .otable tr.over td{color:#FFB3A8}
.sim .payables td:nth-child(2){color:var(--ink-2)}
.sim .disc{color:var(--amber)}
.sim .ar-out{display:grid;grid-template-columns:1.1fr 1fr;gap:14px;margin-top:14px;align-items:start}
.sim .stmt{background:#EAF4F9;color:#0C1C26;padding:16px 18px;box-shadow:0 18px 40px rgba(0,0,0,.45);animation:rise .35s var(--ease) both}
.sim .stmt .hud{color:#0B5C78}
.sim .stmt p{margin:6px 0 10px;font-size:14.5px}
.sim .stmt .otable th{color:#557083;border-color:#C5D9E4}
.sim .stmt .otable td{border-color:#D6E5ED}
.sim .stmt .otable tfoot td{color:#0B5C78}
.sim .stmt .otable tr.late td{color:#B4501A}
.sim .draft{border:1px solid var(--line);background:rgba(3,14,22,.55);padding:14px;animation:rise .35s var(--ease) both}
.sim .draft > p{font-size:14.5px;margin-top:8px}
.sim .alert{display:flex;gap:12px;align-items:baseline;border:1px solid rgba(255,90,71,.5);background:rgba(255,90,71,.08);padding:12px 14px}
.sim .alert .hud{color:var(--red);white-space:nowrap}
.sim .alert p{font-size:14.5px}
.sim .pill{display:inline-block;font-size:12px;font-weight:800;padding:1px 8px;border:1px solid}
.sim .pill.s0{color:var(--red);border-color:rgba(255,90,71,.6)}
.sim .pill.s1{color:var(--amber);border-color:rgba(255,176,32,.6)}
.sim .pill.s2{color:#7BE09B;border-color:rgba(123,224,155,.5)}
.sim .stock td:nth-child(2),.sim .stock th:nth-child(2),.sim .po td:nth-child(2),.sim .po th:nth-child(2){text-align:right}
.sim .po-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:14px}
.sim .po{border:1px solid var(--line);background:rgba(3,14,22,.55);padding:12px;animation:rise .35s var(--ease) both}
.sim .po h4{margin-bottom:8px}
.sim .po .btn{margin-top:10px}
.sim .of-cols{display:grid;grid-template-columns:1fr 1.7fr;gap:14px}
.sim .of-cols .tscroll{margin-top:0}
.sim .docs{list-style:none;display:grid;gap:8px}
.sim .docs li{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid rgba(79,216,255,.18);font-size:14px;animation:rise .35s var(--ease) both;transition:opacity .4s,border-color .4s}
.sim .docs li small{display:block;color:var(--ink-3);font-size:12px}
.sim .docs li.done{opacity:.5;border-color:rgba(123,224,155,.4)}
.sim .docs li.done::after{content:"✓";margin-left:auto;color:#7BE09B;font-weight:800}
.sim .docs li.flag{border-color:rgba(255,176,32,.7)}
.sim .docs li.flag::after{content:"?";margin-left:auto;color:var(--amber);font-weight:800}
.sim .ledger td:nth-child(3),.sim .ledger th:nth-child(3){text-align:left;color:var(--ink-3)}
.sim .abc td:nth-child(2),.sim .abc th:nth-child(2){text-align:center}
.sim .grade{display:inline-block;min-width:22px;text-align:center;font-family:var(--hud);font-weight:700;border:1px solid}
.sim .grade.A{color:var(--holo);border-color:var(--holo)}
.sim .grade.B{color:var(--ink-2);border-color:var(--line-2)}
.sim .grade.C{color:var(--ink-3);border-color:var(--line)}
.sim .share{display:inline-flex;align-items:center;gap:8px}
.sim .share i{display:block;height:6px;background:var(--holo);box-shadow:0 0 8px rgba(79,216,255,.5)}
.sim .otable tr.slow td{color:#FFB3A8}
.sim .heat{display:grid;grid-template-columns:34px repeat(11,minmax(0,1fr));gap:3px;margin-top:10px;font-size:11.5px}
.sim .heat span{font-family:var(--hud);color:var(--ink-3);text-align:center;align-self:center}
.sim .heat i{height:clamp(18px,2.6vw,28px);background:rgba(79,216,255,var(--v));border:1px solid rgba(79,216,255,.1)}
.sim .heat i.peak{outline:1px solid var(--amber);box-shadow:0 0 12px rgba(255,176,32,.55)}
.sim .pos-two{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;margin-top:18px;align-items:start}
.sim .quad{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}
.sim .quad > div{border:1px solid var(--line);padding:10px;background:rgba(3,14,22,.55)}
.sim .quad b{font-size:15px}
.sim .quad small{display:block;font-size:12px;color:var(--ink-3)}
.sim .quad ul{list-style:none;margin-top:6px;display:grid;gap:5px;font-size:14px}
.sim .quad .q0{border-color:var(--holo)}
.sim .quad .q0 b{color:var(--holo)}
.sim .quad .q3{border-style:dashed;border-color:rgba(255,176,32,.55)}
.sim .quad .q3 b{color:var(--amber)}
.sim .brief{margin-top:10px;border:1px solid var(--line-2);border-radius:18px;padding:14px 16px;background:#06121B;box-shadow:0 0 24px rgba(79,216,255,.1)}
.sim .brief .from{font-family:var(--hud);letter-spacing:.14em;font-size:11.5px;text-transform:uppercase;color:var(--holo)}
.sim .brief p{font-size:14px;margin-top:6px;line-height:1.65}
@media(max-width:900px){.sim .cal-wrap,.sim .auto-cols,.sim .kpis,.sim .map-cols,.sim .ar-out,.sim .of-cols,.sim .pos-two{grid-template-columns:1fr}
.sim .tl li{grid-template-columns:44px 1fr}
.sim .tl li > span:last-child{grid-column:2}
.sim .bars li{grid-template-columns:110px 1fr 56px}
.sim .heat{grid-template-columns:28px repeat(11,minmax(0,1fr));gap:2px;font-size:11.5px}
}
.sim .foot .legal{margin-top:12px;font-size:12px;color:#7F97A7}
.sim .h-page{font-size:clamp(30px,4.2vw,50px);margin-top:10px}
@media (prefers-reduced-motion:reduce){.sim *,.sim *::before,.sim *::after{animation:none!important;transition:none!important}
.sim .bp li{opacity:1}
}