/* Phantom Arcades — "The Void" design system.
   Contract: void #0A0A12, phantom blue #0088C9, coin amber #FFB020,
   Russo One display / Chakra Petch body, chamfered "cabinet-cut" corners. */

:root{
  --void:#0A0A12; --panel:#12141D; --panel2:#171A26;
  --blue:#0088C9; --blue-lit:#29A9E4; --indigo:#35407F;
  --amber:#FFB020; --text:#E8EAF2; --muted:#9AA1B5;
  --chamfer:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  --display:'Russo One',sans-serif; --body:'Chakra Petch',sans-serif;
}
*{box-sizing:border-box;margin:0}
html{scroll-behavior:smooth}
body{background:var(--void);color:var(--text);font-family:var(--body);line-height:1.55}
img{max-width:100%}
a{color:var(--blue-lit)}

/* top bar */
.topbar{position:fixed;inset:0 0 auto 0;z-index:40;display:flex;align-items:center;gap:2rem;
  padding:.65rem 1.25rem;background:rgba(10,10,18,.82);backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(53,64,127,.45)}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;color:var(--text);
  font-family:var(--display);font-size:1.02rem;letter-spacing:.06em}
.brand em{color:var(--blue-lit);font-style:normal}
.topbar nav{display:flex;gap:1.4rem;margin-inline:auto}
.topbar nav a{color:#C0C6DA;text-decoration:none;font-weight:600;font-size:.92rem}
.topbar nav a:hover,.topbar nav a:focus-visible{color:var(--text)}
.made{font-size:.8rem;color:#C8CEE0;border:1px solid #4A5490;padding:.35rem .7rem;
  clip-path:var(--chamfer)}

/* stage layout */
.stage{display:grid;grid-template-columns:1fr 380px;grid-template-rows:1fr auto;
  height:100dvh;padding-top:56px}
.viewport{position:relative;grid-row:1/3;overflow:hidden}
#scene{width:100%;height:100%;display:block;touch-action:none}
#scene:focus-visible{outline:2px solid var(--amber);outline-offset:-2px}
#designer,#machines,#craft{scroll-margin-top:56px}
.view-hint{position:absolute;right:16px;bottom:14px;
  color:var(--muted);font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;opacity:.7}

.hero-copy{position:absolute;bottom:12%;left:4%;max-width:400px;z-index:5;
  transition:opacity .5s,transform .5s}
.hero-copy.gone{opacity:0;transform:translateY(-16px);pointer-events:none}
.hero-copy h1{font-family:var(--display);font-size:clamp(1.3rem,2.4vw,1.9rem);
  line-height:1.2;text-shadow:0 0 24px rgba(0,136,201,.4)}
.hero-copy p{margin:.9rem 0 1.3rem;color:var(--muted);max-width:38ch}

/* option rail */
.rail{grid-column:2;grid-row:1;overflow-y:auto;background:var(--panel);
  border-left:1px solid rgba(53,64,127,.5);padding:1.1rem 1.1rem 6rem}
.rail-head h2{font-family:var(--display);font-size:1.05rem;letter-spacing:.05em}
.cab-name{color:var(--blue-lit);font-weight:600;font-size:.9rem;margin-top:.2rem}
.step{margin-top:1.15rem}
.step > h3{font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);
  display:flex;justify-content:space-between;align-items:baseline}
.step > h3 .sel{color:var(--amber);font-size:.72rem;letter-spacing:0;text-transform:none}
.opts{display:grid;grid-template-columns:1fr 1fr;gap:.45rem;margin-top:.55rem}
.opt{background:#1C2030;border:1px solid #4A5490;color:var(--text);
  font-family:var(--body);font-weight:600;font-size:.8rem;padding:.55rem .7rem;cursor:pointer;
  min-height:44px;text-align:left;transition:border-color .15s,background .15s}
.opt:hover{border-color:var(--blue)}
.opt:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.opt[aria-pressed="true"]{background:#00577F;border-color:var(--blue-lit);color:#fff}
.opt .p{color:var(--muted);font-weight:700;margin-left:.35rem;font-size:.72rem}
.opt[aria-pressed="true"] .p{color:#FFE2A6}
.swatches{grid-template-columns:repeat(6,40px)}
.swatches .opt{width:40px;height:40px;min-height:40px;padding:0;border-width:2px;border-radius:50%}
.concierge{margin-top:1.4rem;padding:1rem;background:var(--panel2);clip-path:var(--chamfer)}
.concierge p{font-size:.88rem;color:var(--muted)}
.concierge strong{color:var(--text)}
.concierge .btn-ghost{display:inline-block;margin-top:.7rem;text-decoration:none}

/* price bar */
.pricebar{grid-column:2;grid-row:2;display:flex;align-items:center;justify-content:space-between;
  flex-wrap:wrap;gap:.8rem;padding:.85rem 1.1rem;background:var(--panel2);
  border-left:1px solid rgba(53,64,127,.5);border-top:1px solid rgba(53,64,127,.5)}
.price-label{display:block;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
#price{font-family:var(--display);font-size:1.75rem;color:var(--amber)}
.price-actions{display:flex;gap:.5rem}

/* buttons */
.btn-coin{font-family:var(--display);font-size:.9rem;letter-spacing:.04em;color:#1A1205;
  background:linear-gradient(180deg,#FFC95A,var(--amber));border:0;padding:.7rem 1.1rem;
  cursor:pointer;clip-path:var(--chamfer);box-shadow:0 0 22px rgba(255,176,32,.35)}
.btn-coin:hover{filter:brightness(1.07)}
.btn-coin:focus-visible{outline:2px solid #fff;outline-offset:2px}
.btn-ghost{font-family:var(--body);font-weight:700;font-size:.82rem;color:var(--text);
  background:transparent;border:1px solid var(--indigo);padding:.65rem .9rem;cursor:pointer;
  clip-path:var(--chamfer)}
.btn-ghost:hover{border-color:var(--blue)}
.btn-ghost:focus-visible{outline:2px solid var(--amber);outline-offset:2px}

/* loading eyes */
.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;
  justify-content:center;gap:1rem;background:var(--void);z-index:6;color:var(--muted);
  letter-spacing:.1em;font-size:.85rem;transition:opacity .6s}
.loading.done{opacity:0;pointer-events:none}
.loading .eye{animation:blink 3.2s infinite}
@keyframes blink{0%,92%,100%{transform:scaleY(1)}95%{transform:scaleY(.08)}}

/* lower strips */
.strip{padding:4.5rem 5vw}
.strip-title{font-family:var(--display);font-size:clamp(1.3rem,2.6vw,2rem);margin-bottom:1.8rem;
  text-shadow:0 0 26px rgba(0,136,201,.4)}
.cab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem}
.cab-card{background:var(--panel);border:1px solid rgba(53,64,127,.5);padding:1.1rem;
  clip-path:var(--chamfer);cursor:pointer;text-align:left;color:var(--text);font-family:var(--body)}
.cab-card:hover{border-color:var(--blue)}
.cab-card:focus-visible{outline:2px solid var(--amber);outline-offset:2px}
.cab-card h3{font-family:var(--display);font-size:.95rem;line-height:1.3}
.cab-card .meta{color:var(--muted);font-size:.8rem;margin-top:.35rem}
.cab-card .from{color:var(--amber);font-weight:700;margin-top:.55rem;display:block}
.craft{background:var(--panel)}
.craft-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.6rem}
.craft-item h3{font-family:var(--display);font-size:.95rem;color:var(--blue-lit);margin-bottom:.4rem}
.craft-item p{color:var(--muted);font-size:.9rem}

.foot{padding:2.4rem 5vw;display:flex;align-items:center;gap:1rem;border-top:1px solid rgba(53,64,127,.4);flex-wrap:wrap}
.foot .fine{color:var(--muted);font-size:.78rem;width:100%}

.dlg{background:var(--panel);color:var(--text);border:1px solid var(--indigo);
  clip-path:var(--chamfer);padding:1.4rem;max-width:520px;width:92vw}
.dlg::backdrop{background:rgba(4,4,8,.72)}
.dlg h2{font-family:var(--display);font-size:1rem;margin-bottom:.8rem}
.dlg pre{background:var(--void);padding:1rem;font-size:.8rem;overflow:auto;max-height:50vh;white-space:pre-wrap}
.dlg-row{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1rem}

/* mobile */
@media (max-width:900px){
  .topbar nav{display:none}
  .stage{grid-template-columns:1fr;grid-template-rows:40dvh 1fr auto;height:auto;min-height:100dvh}
  .viewport{grid-row:1;grid-column:1;height:40dvh}
  .rail{grid-row:2;grid-column:1;border-left:0;border-top:1px solid rgba(53,64,127,.5);padding-bottom:7rem}
  .price-actions{width:100%}
  .price-actions a.btn-coin{flex:1;justify-content:center}
  .hero-copy{bottom:8%;top:auto;left:5%;right:5%}
  .pricebar{grid-row:3;grid-column:1;position:sticky;bottom:0;z-index:30;border-left:0}
  .hero-copy p{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .loading .eye{animation:none}
  .hero-copy{transition:none}
}

/* ---------- inner pages ---------- */
.page{padding:110px 5vw 4rem;max-width:1180px;margin-inline:auto}
.page-hero h1{font-family:var(--display);font-size:clamp(1.7rem,3.4vw,2.6rem);
  text-shadow:0 0 34px rgba(0,136,201,.5)}
.page-hero p{color:#B9C0D4;max-width:62ch;margin-top:.8rem;font-size:1.02rem}
.topbar nav a[aria-current="page"]{color:var(--blue-lit)}

.m-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.2rem;margin-top:2.2rem}
.m-card{background:var(--panel);border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer);
  padding:1.3rem;display:flex;flex-direction:column;gap:.55rem}
.m-card h2{font-family:var(--display);font-size:1.05rem;line-height:1.3}
.m-card .m-meta{color:#B9C0D4;font-size:.88rem}
.m-card .m-desc{color:#B9C0D4;font-size:.94rem;line-height:1.6;flex:1}
.m-card .m-price{color:var(--amber);font-family:var(--display);font-size:1.25rem}
.m-card .btn-coin{align-self:flex-start;text-decoration:none;display:inline-block}
.m-card ul{margin:.2rem 0 .2rem 1.1rem;color:var(--muted);font-size:.88rem}
.badge{display:inline-block;font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  color:var(--blue-lit);border:1px solid var(--indigo);padding:.25rem .55rem;clip-path:var(--chamfer)}

.tier-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.2rem;margin-top:2.2rem}
.tier{background:var(--panel);border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer);padding:1.3rem}
.tier h2{font-family:var(--display);font-size:1rem;color:var(--blue-lit)}
.tier .t-price{color:var(--amber);font-family:var(--display);font-size:1.3rem;margin:.4rem 0 .8rem}
.tier p{color:var(--muted);font-size:.9rem;margin-bottom:.7rem}
.tier ul{margin:0 0 0 1.1rem;color:var(--muted);font-size:.85rem;line-height:1.7}
.tier .plus{color:var(--text);font-weight:700;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;margin:.6rem 0 .3rem}

.feature-rows{margin-top:2.2rem;display:flex;flex-direction:column;gap:1.2rem}
.f-row{background:var(--panel);border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer);
  padding:1.4rem;display:grid;grid-template-columns:220px 1fr;gap:1.4rem;align-items:start}
.f-row h2{font-family:var(--display);font-size:1rem;color:var(--blue-lit)}
.f-row p{color:var(--muted);font-size:.94rem;margin-top:.5rem}
.f-row p+p{margin-top:.6rem}

.c-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1.2rem;margin-top:2.2rem}
.c-card{background:var(--panel);border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer);padding:1.3rem}
.c-card h2{font-family:var(--display);font-size:.95rem;color:var(--blue-lit);margin-bottom:.5rem}
.c-card a{font-weight:700;text-decoration:none}
.c-card p{color:var(--muted);font-size:.9rem;margin:.3rem 0}
.cta-band{margin-top:3rem;padding:2.2rem;text-align:center;background:var(--panel2);
  border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer)}
.cta-band h2{font-family:var(--display);font-size:1.3rem;margin-bottom:1rem}
.cta-band .btn-coin{text-decoration:none;display:inline-block}

@media (max-width:900px){
  .topbar{gap:.9rem;flex-wrap:wrap;padding:.55rem .9rem}
  .topbar nav{display:flex;gap:.9rem;margin-inline:0;order:3;width:100%;overflow-x:auto;
    padding-bottom:.15rem;-webkit-overflow-scrolling:touch}
  .topbar nav a{font-size:.85rem;white-space:nowrap}
  .made{display:none}
  .stage{padding-top:88px}
  .page{padding-top:130px}
  .f-row{grid-template-columns:1fr;gap:.6rem}
}

/* ---------- global footer ---------- */
.foot2{border-top:1px solid rgba(53,64,127,.4);padding:2.6rem 5vw 2rem;background:var(--panel)}
.foot2-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:2rem;max-width:1180px;margin-inline:auto}
.foot2 h3{font-family:var(--display);font-size:.85rem;letter-spacing:.1em;color:var(--muted);
  text-transform:uppercase;margin-bottom:.7rem}
.foot2 ul{list-style:none;margin:0;padding:0}
.foot2 li{margin:.35rem 0}
.foot2 a{color:var(--text);text-decoration:none;font-size:.92rem}
.foot2 a:hover{color:var(--blue-lit)}
.foot2-brand{display:flex;align-items:center;gap:.6rem;font-family:var(--display);letter-spacing:.05em}
.foot2-brand em{color:var(--blue-lit);font-style:normal}
.foot2-brand+p{color:var(--muted);font-size:.88rem;margin-top:.7rem;max-width:34ch}
.foot2-legal{max-width:1180px;margin:2rem auto 0;padding-top:1.2rem;border-top:1px solid rgba(53,64,127,.35);
  display:flex;flex-wrap:wrap;gap:.4rem 1.4rem;align-items:center;color:var(--muted);font-size:.8rem}
.foot2-legal a{color:var(--muted);font-size:.8rem;text-decoration:none}
.foot2-legal a:hover{color:var(--text)}
.foot2-legal .power a{color:var(--blue-lit)}
@media (max-width:700px){.foot2-grid{grid-template-columns:1fr 1fr}}

/* famous game rooms */
.fame-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:1rem;margin-top:1.6rem}
.fame{background:var(--panel);border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer);
  padding:1.1rem;text-decoration:none;display:block}
.fame:hover{border-color:var(--blue)}
.fame b{font-family:var(--display);color:var(--text);display:block;font-size:.98rem}
.fame span{color:var(--muted);font-size:.82rem}
.fame .see{display:block;color:var(--blue-lit);font-size:.8rem;font-weight:700;margin-top:.5rem}
.sect-title{font-family:var(--display);font-size:1.25rem;margin-top:3rem;
  text-shadow:0 0 26px rgba(0,136,201,.4)}

/* ---------- checkout ---------- */
.co-page{max-width:1080px}
.co-demo-note{margin-top:1.4rem;padding:.8rem 1rem;background:rgba(255,176,32,.08);
  border:1px solid rgba(255,176,32,.4);clip-path:var(--chamfer);font-size:.9rem;color:var(--text)}
.co-grid{display:grid;grid-template-columns:1fr 320px;gap:1.6rem;margin-top:1.8rem;align-items:start}
.co-step{background:var(--panel);border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer);margin-bottom:1rem}
.co-step summary{font-family:var(--display);font-size:1rem;padding:1rem 1.2rem;cursor:pointer;
  display:flex;align-items:center;gap:.8rem;list-style:none}
.co-step summary::-webkit-details-marker{display:none}
.co-num{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;
  background:var(--indigo);color:#fff;font-size:.85rem;clip-path:var(--chamfer)}
.co-step[open] .co-num{background:var(--blue)}
.co-body{padding:0 1.2rem 1.3rem}
.co-cab{margin-bottom:.5rem}
.co-opts{margin:0 0 1rem 1.1rem;color:var(--muted);font-size:.9rem;line-height:1.8}
.co-opts b{color:var(--amber)}
.co-edit{font-size:.85rem}
.fld{margin-bottom:1rem;max-width:420px}
.fld label{display:block;font-weight:600;font-size:.88rem;margin-bottom:.3rem}
.opt-tag{color:var(--muted);font-weight:400;font-size:.78rem}
.fld input{width:100%;background:var(--void);border:1px solid var(--indigo);color:var(--text);
  font-family:var(--body);font-size:1rem;padding:.65rem .8rem}
.fld input:focus-visible{outline:2px solid var(--amber);outline-offset:1px}
.fld input[aria-invalid="true"]{border-color:#e05252}
.fld-err{color:#ff8a8a;font-size:.82rem;margin-top:.3rem}
.paycards{border:0;padding:0;margin:0 0 1rem}
.paycards legend{font-weight:600;font-size:.88rem;margin-bottom:.5rem}
.paycard{display:flex;gap:.7rem;align-items:center;background:var(--void);
  border:1px solid var(--indigo);padding:.7rem .9rem;margin-bottom:.5rem;cursor:pointer;
  clip-path:var(--chamfer);max-width:420px}
.paycard:has(input:checked){border-color:var(--blue-lit)}
.paycard input:focus-visible{outline:2px solid var(--blue-lit)}
.paycard b{display:block;font-size:.92rem}
.paycard em{color:var(--muted);font-style:normal;font-size:.78rem}
.co-trust{color:var(--muted);font-size:.84rem;margin:.9rem 0;line-height:1.7}
.co-declined{background:rgba(224,82,82,.1);border:1px solid rgba(224,82,82,.5);
  clip-path:var(--chamfer);padding:.9rem 1rem;margin-bottom:1rem;font-size:.9rem}
.co-fine{color:var(--muted);font-size:.76rem;margin-top:.8rem}
.co-summary{background:var(--panel2);border:1px solid rgba(53,64,127,.5);clip-path:var(--chamfer);
  padding:1.2rem;position:sticky;top:76px}
.co-summary h2{font-family:var(--display);font-size:.95rem;margin-bottom:.8rem}
.sum-row{display:flex;justify-content:space-between;gap:1rem;font-size:.87rem;
  color:var(--muted);padding:.28rem 0}
.sum-row b{color:var(--text);font-weight:600}
.sum-total{border-top:1px solid rgba(53,64,127,.5);margin-top:.5rem;padding-top:.6rem}
.sum-total b{font-family:var(--display);font-size:1.05rem}
.sum-due b{color:var(--amber);font-family:var(--display);font-size:1.2rem}
.co-confirm{max-width:640px;margin-top:1rem}
.co-confirm h1{font-family:var(--display);font-size:1.8rem;margin-top:1rem;
  text-shadow:0 0 30px rgba(47,191,79,.35)}
.co-ref{color:var(--muted);margin-top:.5rem}
.co-ref b{color:var(--amber)}
.co-next{margin-top:1.8rem}
.co-next h2{font-family:var(--display);font-size:1rem;margin-bottom:.7rem}
.co-next ol{margin-left:1.2rem;color:var(--muted);line-height:1.9}
.co-next b{color:var(--text)}
.co-sheet{background:var(--panel);border:1px solid rgba(53,64,127,.5);padding:1rem;
  font-size:.82rem;white-space:pre-wrap;margin-top:1.6rem}

/* ---------- animated quarter ---------- */
.coin-btn{display:inline-flex;align-items:center;gap:.6rem;position:relative}
.coin-wrap{position:relative;display:inline-flex;flex-direction:column;align-items:center}
.coin{display:block;transform-style:preserve-3d}
@keyframes coin-shine{0%,88%,100%{transform:rotateY(0)}92%{transform:rotateY(38deg)}96%{transform:rotateY(-25deg)}}
.coin-btn .coin{animation:coin-shine 4.2s ease-in-out infinite}
.slot{display:none;width:22px;height:3px;background:#1A1205;border-radius:2px;margin-top:1px}
.coin-btn.inserting .slot{display:block}
@keyframes coin-drop{
  0%{transform:translateY(0) rotateX(0);opacity:1}
  45%{transform:translateY(2px) rotateX(72deg)}
  100%{transform:translateY(15px) rotateX(88deg) scale(.72);opacity:0}}
.coin-btn.inserting .coin{animation:coin-drop .55s cubic-bezier(.5,0,.9,.6) forwards}
@keyframes slot-flash{0%,100%{box-shadow:none}55%{box-shadow:0 0 10px 3px rgba(255,255,255,.75)}}
.coin-btn.inserting .slot{animation:slot-flash .8s ease-out .35s}
@media (prefers-reduced-motion:reduce){
  .coin-btn .coin,.coin-btn.inserting .coin,.coin-btn.inserting .slot{animation:none}
}
@media (max-width:900px){.co-grid{grid-template-columns:1fr}.co-summary{position:static;order:-1}}
a.btn-coin,a.btn-ghost{text-decoration:none;display:inline-flex;align-items:center;gap:.5rem}
.co-sheet{overflow-wrap:anywhere}

/* panel items: print build sheet + hero proof link + "Estimated total" label */
.print-only{display:none}
@media print{
  body *{visibility:hidden}
  .print-only{display:block;visibility:visible;position:absolute;inset:0;
    background:#fff;color:#000;font-family:monospace;font-size:12pt;
    white-space:pre-wrap;padding:2cm}
}
.hero-proof{margin-top:.9rem;font-size:.85rem}
.hero-proof a{color:var(--muted)}
.hero-proof a:hover{color:var(--blue-lit)}
.opt-thumb{display:flex;align-items:center;gap:.55rem;padding:.4rem .55rem}
.opt-thumb img{width:44px;height:43px;object-fit:cover;flex:none;border:1px solid rgba(53,64,127,.6)}
.m-card .m-photo{width:100%;height:230px;object-fit:contain;background:radial-gradient(ellipse at 50% 80%,#141a2e,#0d0f18);margin-bottom:.4rem}
.cab-card .c-photo{width:100%;height:150px;object-fit:contain;background:radial-gradient(ellipse at 50% 80%,#141a2e,#0d0f18);margin-bottom:.5rem}

/* ---------- AI artwork chat ---------- */
.ai-dlg{max-width:560px}
.ai-sub{color:var(--muted);font-size:.88rem;margin-bottom:.9rem}
.ai-chat{background:var(--void);border:1px solid rgba(53,64,127,.5);min-height:180px;
  max-height:46vh;overflow-y:auto;padding:.9rem;display:flex;flex-direction:column;gap:.65rem}
.msg{max-width:85%;padding:.6rem .8rem;font-size:.9rem;line-height:1.5}
.msg.user{align-self:flex-end;background:#00577F;color:#fff;clip-path:var(--chamfer)}
.msg.bot{align-self:flex-start;background:var(--panel2);border:1px solid rgba(53,64,127,.5)}
.msg.bot.err{border-color:rgba(224,82,82,.6);background:rgba(224,82,82,.08)}
.msg img{width:180px;height:245px;object-fit:cover;display:block;border:1px solid var(--indigo)}
.msg .ai-acts{display:flex;gap:.5rem;margin-top:.6rem;flex-wrap:wrap}
.msg .ai-acts .btn-coin{font-size:.78rem;padding:.5rem .7rem}
.msg .ai-acts .btn-ghost{font-size:.75rem;padding:.45rem .6rem}
.typing{display:inline-flex;gap:4px;padding:.35rem 0}
.typing i{width:7px;height:7px;border-radius:50%;background:var(--blue-lit);animation:tp 1s infinite}
.typing i:nth-child(2){animation-delay:.18s}.typing i:nth-child(3){animation-delay:.36s}
@keyframes tp{0%,100%{opacity:.25;transform:translateY(0)}45%{opacity:1;transform:translateY(-3px)}}
@media (prefers-reduced-motion:reduce){.typing i{animation:none}}
.ai-row{display:flex;gap:.5rem;margin-top:.8rem}
.ai-row input{flex:1;background:var(--void);border:1px solid var(--indigo);color:var(--text);
  font-family:var(--body);font-size:.95rem;padding:.65rem .8rem}
.ai-row input:focus-visible{outline:2px solid var(--amber);outline-offset:1px}

.open-chip{position:absolute;left:50%;transform:translateX(-50%);bottom:44px;z-index:6;
  font-size:.82rem;padding:.6rem .95rem}

.dim-chip{position:absolute;right:16px;top:72px;z-index:6;font-size:.78rem}
.dim-chip[aria-pressed="true"]{border-color:var(--amber);color:var(--amber)}
.ai-attach{cursor:pointer;padding:.55rem .7rem;font-size:1rem}
.ai-cabrow{display:flex;gap:.4rem;flex-wrap:wrap;margin-top:.7rem}
.ai-cabrow .opt{font-size:.72rem;min-height:34px;padding:.35rem .55rem}
.ai-rules{color:var(--muted);font-size:.76rem;margin-top:.55rem}
.ai-rules b{color:var(--blue-lit)}
.msg .cutout{display:block;width:190px}
.msg .cutout img{width:100%;height:auto;border:0;display:block}
.msg .ref-img{width:120px;height:120px;object-fit:cover;border:1px solid rgba(255,255,255,.4)}
