/* th-demos2.css — /demos V2 (V13, 2026-09-28; S8 redesign). Built by _thbuild/v13/demos_page.js; behaviour th-demos2.js.
   Our brand around it (void hero, paper wall, deep close). Inside a card and a takeover each fictional business wears
   ITS OWN brand: --acc/--acc2/--bg/--bot/--ff come from its LOOK, and [data-theme] picks one of ten site layouts.
   No blue, grey-blue or purple grounds (Duval; demos_page.js check() refuses them). */

/* ── hero ── */
.dm-hero{position:relative;overflow:hidden;background:var(--void);color:#fff;padding:clamp(118px,17vh,168px) var(--pad) clamp(48px,8vh,84px)}
.dm-hero::before{content:"";position:absolute;left:-20%;bottom:-60%;width:80vmax;height:80vmax;border-radius:50%;
  background:radial-gradient(closest-side,rgba(79,216,166,.2),rgba(79,216,166,0));pointer-events:none}
.dm-hero__in{position:relative;max-width:1180px;margin:0 auto}
.dm-hero .eyebrow{margin-top:1.2rem;color:rgba(255,255,255,.5)}
.dm-hero h1{margin:.7rem 0 0;color:#fff}
.dm-hero__p{margin:1.1rem 0 0;max-width:36rem;font-size:clamp(1.02rem,1.5vw,1.2rem);line-height:1.5;color:rgba(255,255,255,.74)}
.dm-hero .cta-row{margin-top:1.6rem}

/* ── the wall ── */
.dm{background:var(--paper);color:var(--on-paper);padding:clamp(26px,5vh,60px) var(--pad) clamp(56px,9vh,110px)}
.dm__in{max-width:1320px;margin:0 auto}
.dm__bar{position:sticky;top:64px;z-index:5;margin:0 calc(var(--pad) * -1) 18px;padding:10px var(--pad);background:rgba(242,247,244,.92);
  -webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px)}
.dm__fs{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.dm__fs::-webkit-scrollbar{display:none}
.dm-f{flex:none;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid rgba(2,36,25,.16);background:transparent;color:var(--on-paper);
  font:600 .94rem/1 Switzer,ui-sans-serif,system-ui,sans-serif;cursor:pointer;white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
.dm-f:hover{border-color:#0B8059}
.dm-f.is-on{background:var(--on-paper);border-color:var(--on-paper);color:#fff}
.dm__grid{display:grid;gap:18px}
@media (min-width:720px){.dm__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}}
@media (min-width:1180px){.dm__grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
.dm__note{margin:26px 0 0;font-size:.94rem;color:rgba(4,36,26,.66)}

/* a card: the business's site as a picture you can open, then who they are */
.dm-card{position:relative;display:flex;flex-direction:column;min-width:0;padding:6px;border-radius:30px;border:1px solid var(--line-ink);background:rgba(255,255,255,.5)}
.dm-card[hidden]{display:none}
.dm-card__shot{display:block;padding:0;border:0;border-radius:24px;background:none;cursor:pointer;text-align:left;
  transition:transform .5s var(--e-out)}
.dm-card__shot:hover{transform:translateY(-3px)}
.dm-card__shot:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
.dm-card__txt{position:relative;display:flex;flex-direction:column;gap:8px;flex:1;padding:18px 16px 16px;border-radius:24px;background:#fff;margin-top:6px}
.dm-card__n{position:absolute;right:14px;top:6px;font:900 3.4rem/1 "Cabinet Grotesk",Satoshi,ui-sans-serif,sans-serif;color:rgba(4,36,26,.06);pointer-events:none}
.dm-card__h{margin:0;font:900 1.35rem/1.08 Satoshi,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.03em}
.dm-card__k{margin:0;font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(4,36,26,.6)}
.dm-card__why{margin:2px 0 0;font-size:.98rem;line-height:1.48;color:rgba(4,36,26,.8)}
.dm-card__caps{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 0;padding:0;list-style:none}
.dm-card__caps li{padding:6px 10px;border-radius:999px;background:var(--paper);font-size:.8rem;font-weight:700;color:rgba(4,36,26,.78)}
.dm-card__go{margin-top:12px;align-self:flex-start}

/* ── the mini site (a card's picture): the business's own font, colours and layout signature ── */
.dm-mini{position:relative;display:block;height:clamp(236px,58vw,300px);border-radius:24px;overflow:hidden;background:var(--bg);color:#141414;
  font-family:var(--ff);box-shadow:inset 0 0 0 1px rgba(2,36,25,.08)}
@media (min-width:720px){.dm-mini{height:280px}}
.dm-mini[data-dark="1"]{color:#F4F1EE}
.dm-mini__nav{position:relative;z-index:2;display:flex;align-items:center;gap:8px;height:46px;padding:0 16px;font-weight:800;font-size:.84rem;letter-spacing:-.01em}
.dm-mini__nav b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:48%}
.dm-mini__nav em{margin-left:auto;font-size:.66rem;font-weight:600;font-style:normal;opacity:.6;white-space:nowrap}
.dm-mini__nav em + em{margin-left:10px}
@media (max-width:420px){.dm-mini__nav em{display:none}}
.dm-logo{width:26px;height:26px;border-radius:8px;flex:none}
.dm-mini__hero{position:relative;display:block;margin:0 12px;padding:16px 18px 18px;border-radius:18px;background:var(--acc);color:var(--acc-ink);overflow:hidden;height:calc(100% - 58px)}
.dm-mini__hero small{position:relative;z-index:1;display:block;font-size:.6rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;opacity:.82}
.dm-mini__hero strong{position:relative;z-index:1;display:block;margin-top:.4em;max-width:11ch;font-size:1.62rem;font-weight:800;line-height:1;letter-spacing:-.035em}
.dm-mini__hero > span{position:relative;z-index:1;display:block;margin-top:.55em;max-width:21ch;font-size:.8rem;line-height:1.4;opacity:.88}
.dm-mini__hero u{position:relative;z-index:1;display:inline-flex;align-items:center;margin-top:.9em;height:28px;padding:0 12px;border-radius:999px;background:var(--acc-ink);color:var(--acc);text-decoration:none;font-weight:800;font-size:.7rem}
.dm-art{position:absolute;inset:0;pointer-events:none}
.dm-mini__chat{position:absolute;right:14px;bottom:60px;z-index:3;display:flex;align-items:flex-end;gap:7px;max-width:min(74%,244px);
  transform:translateY(6px);transition:transform .5s var(--e-out)}
.dm-mini__chat > span{padding:9px 12px;border-radius:16px 16px 4px 16px;background:var(--bot);color:#151515;font-size:.76rem;line-height:1.38;
  box-shadow:0 14px 34px -12px rgba(0,0,0,.45);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.dm-mini[data-dark="1"] .dm-mini__chat > span{color:#F4F1EE}
.dm-mini__chat[data-bubble="pill"] > span{border-radius:20px}
.dm-mini__chat[data-bubble="square"] > span{border-radius:4px}
.dm-mini__chat[data-bubble="speech"] > span{border-radius:16px 16px 16px 2px}
.dm-mini__chat[data-bubble="asymmetric"] > span{border-radius:20px 4px 20px 20px}
.dm-av{order:2;width:26px;height:26px;border-radius:50%;flex:none;box-shadow:0 0 0 2px var(--bg)}
.dm-av[data-av="rounded"]{border-radius:8px}
.dm-av[data-av="square"]{border-radius:3px}
.dm-mini__fab{position:absolute;right:14px;bottom:14px;z-index:3;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--acc);color:var(--acc-ink);
  box-shadow:0 10px 24px -8px rgba(0,0,0,.5)}
.dm-mini__fab[data-btn="square"]{border-radius:10px}
.dm-mini__fab[data-btn="pill"]{width:54px;border-radius:999px}
.dm-mini__fab svg{width:19px;height:19px}
.dm-card__shot:hover .dm-mini__chat{transform:translateY(0)}

/* ── the close ── */
.dm-after{background:var(--deep);color:#fff;padding:clamp(64px,11vh,130px) var(--pad)}
.dm-after__in{max-width:1180px;margin:0 auto}
.dm-after .eyebrow{color:rgba(255,255,255,.5)}
.dm-after h2{margin:.8rem 0 0;color:#fff}
.dm-after__l{list-style:none;margin:30px 0 0;padding:0;display:grid;gap:16px;max-width:780px}
.dm-after__l li{display:grid;grid-template-columns:28px 1fr;gap:14px;font-size:1.05rem;line-height:1.5;color:rgba(255,255,255,.82)}
.dm-after__l b{color:#fff}
.dm-after__l svg{width:24px;height:24px;margin-top:2px;color:var(--mint)}
.dm-after .cta-row{margin-top:30px}
.dm-after__n{margin:18px 0 0;font-size:.92rem;color:rgba(255,255,255,.6)}

/* ── the takeover: our chrome, their site, the real bot ── */
.dm-fs{position:fixed;inset:0;z-index:2147483000;display:flex;flex-direction:column;background:#0B0F0D;color:#fff}
.dm-fs[hidden]{display:none}
.dm-fs__top{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:10px 12px;padding:8px 10px 8px;padding-top:calc(8px + env(safe-area-inset-top))}
.dm-fs__x{width:48px;height:48px;border:0;border-radius:14px;background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.dm-fs__x svg{width:18px;height:18px}
.dm-fs__t{display:grid;gap:3px;min-width:0}
.dm-fs__t b{font:900 1.05rem/1.1 Satoshi,ui-sans-serif,sans-serif;letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dm-fs__t span{font-size:.8rem;color:rgba(255,255,255,.6)}
.dm-fs__plan{grid-column:1 / -1;display:flex;gap:4px;padding:4px;border-radius:999px;background:rgba(255,255,255,.07);overflow-x:auto;scrollbar-width:none}
.dm-fs__plan::-webkit-scrollbar{display:none}
.dm-fs__plan button{flex:1 0 auto;min-height:40px;padding:0 14px;border:0;border-radius:999px;background:transparent;color:rgba(255,255,255,.72);
  font:700 .88rem/1 Switzer,ui-sans-serif,system-ui,sans-serif;cursor:pointer}
.dm-fs__plan button.is-on{background:var(--mint);color:var(--on-mint)}
@media (min-width:900px){
  .dm-fs__top{grid-template-columns:48px 1fr auto;padding:10px 14px}
  .dm-fs__plan{grid-column:auto}
}
.dm-fs__view{position:relative;flex:1;margin:0 8px 8px;border-radius:18px;overflow:hidden;background:var(--bg,#fff)}
.dm-fs__cap{position:absolute;left:50%;bottom:calc(14px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:5;display:flex;align-items:center;gap:12px;
  width:min(560px,calc(100% - 28px));padding:10px 10px 10px 16px;border-radius:18px;background:var(--void);color:#fff;font-size:.92rem;box-shadow:0 20px 50px -18px rgba(0,0,0,.7)}
.dm-fs__cap[hidden]{display:none}
.dm-fs__cap span{flex:1}
html.dm-locked,html.dm-locked body{overflow:hidden}
html.dm-locked #ddb,html.dm-locked #ddw{display:none}

/* the widget slot: preview-slot mode lays the real widget out INSIDE it */
.dm-slot{position:absolute;right:0;bottom:0;z-index:3;width:100%;height:70%;pointer-events:none}
.dm-slot > *{pointer-events:auto}
.dm-slot.dd-render-slot{position:absolute;left:auto;right:0;top:auto;bottom:0}
@media (min-width:900px){.dm-slot{width:400px;height:min(100%,680px)}}
/* shortcuts: ONE compact row (Duval 09-25 "next to each other"; 09-28 "the shortcuts for pro+ must not be so big").
   The runtime squeezes three reply options into thirds and wraps each label inside a round pill — three fat
   circles on Pro+. Here each keeps its natural width on one line and the row scrolls sideways if it must. */
.dm-fs .dd-host .dd-chips{flex-wrap:nowrap!important;justify-content:flex-start!important;overflow-x:auto;scrollbar-width:none;gap:6px}
.dm-fs .dd-chips::-webkit-scrollbar,.dm-fs .dd-qr::-webkit-scrollbar{display:none}
.dm-fs .dd-chip{flex:0 0 auto!important;max-width:none!important;white-space:nowrap;font-size:12.5px!important;line-height:1.2;padding:7px 12px!important;min-height:32px;border-radius:999px}
.dm-fs .dd-qr{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none;margin:6px 0 2px}
.dm-fs .dd-qr-b{flex:0 0 auto!important;max-width:none!important;white-space:nowrap!important;font-size:12px!important;line-height:1.2!important;padding:6px 11px!important;min-height:30px}
.dm-fs .dd-qr[data-more],.dm-fs .dd-chips[data-more]{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 40px),transparent)}
.dm-fs[data-sent] .dd-chips{display:none!important}

/* ── the stand-in site: the ten layouts live in th-sites.css (shared with /instant-demo); here only its room ── */
@media (min-width:900px){.dm-fs .dms-hero,.dm-fs .dms-menu,.dm-fs .dms-info{margin-right:calc(400px + 4%)}}
@media (max-width:899px){.dm-fs .dms-links,.dm-fs .dms-menu,.dm-fs .dms-info,.dm-fs .dms-navcta{display:none}.dm-fs .dms-h{font-size:clamp(1.9rem,8.4vw,2.6rem)}}

/* 1 salon — dark editorial, a serif name, two tall arches */
.dm-mini[data-theme="salon"] .dm-mini__hero{background:linear-gradient(160deg,#241319,#140F11);color:#F4F1EE}
.dm-mini[data-theme="salon"] .dm-mini__hero strong{font-weight:400;font-style:italic}
.dm-mini[data-theme="salon"] .dm-mini__hero u{background:transparent;color:var(--acc2);box-shadow:inset 0 0 0 1px var(--acc2)}
.dm-mini[data-theme="salon"] .dm-art{background:radial-gradient(60% 90% at 88% 110%,var(--acc) 0 38%,transparent 39%),radial-gradient(40% 70% at 64% 120%,var(--acc2) 0 36%,transparent 37%)}

/* 2 clinic — airy white, a soft rounded card, round blobs */
.dm-mini[data-theme="clinic"] .dm-mini__hero{background:linear-gradient(135deg,#E3F5EE,#fff 72%);color:var(--acc);border-radius:26px}
.dm-mini[data-theme="clinic"] .dm-mini__hero u{background:var(--acc);color:#fff}
.dm-mini[data-theme="clinic"] .dm-art{background:radial-gradient(circle at 96% 8%,var(--acc2) 0 22%,transparent 23%),radial-gradient(circle at 70% 118%,rgba(14,140,107,.16) 0 24%,transparent 25%)}

/* 3 bistro — dark and warm, a glow like embers, a framed menu card */
.dm-mini[data-theme="bistro"] .dm-mini__hero{background:radial-gradient(90% 80% at 50% 125%,var(--acc),transparent 72%),#1F1510;color:#F4E9DF;text-align:center;border-radius:6px}
.dm-mini[data-theme="bistro"] .dm-mini__hero strong,.dm-mini[data-theme="bistro"] .dm-mini__hero > span{margin-left:auto;margin-right:auto}
.dm-mini[data-theme="bistro"] .dm-mini__hero small{color:var(--acc2)}
.dm-mini[data-theme="bistro"] .dm-mini__hero u{background:var(--acc2);color:#1F1510}

/* 4 motion — light and split, motion rings, big numerals */
.dm-mini[data-theme="motion"] .dm-mini__hero{background:var(--bg);color:#1E2B10;border-radius:0;margin:0;padding-left:28px}
.dm-mini[data-theme="motion"] .dm-mini__hero small{color:var(--acc)}
.dm-mini[data-theme="motion"] .dm-mini__hero u{background:var(--acc);color:#fff}
.dm-mini[data-theme="motion"] .dm-art{background:radial-gradient(circle at 92% 30%,transparent 0 18%,var(--acc2) 18.5% 25%,transparent 25.5%),radial-gradient(circle at 92% 30%,transparent 0 7%,var(--acc) 7.5% 11%,transparent 11.5%)}

/* 5 road — asphalt and a moving centre line, bold type, package cards */
.dm-mini[data-theme="road"] .dm-mini__hero{background:#1D1D1D;color:#fff;border-radius:4px;border-left:7px solid var(--acc)}
.dm-mini[data-theme="road"] .dm-mini__hero strong{text-transform:uppercase;font-weight:900;font-size:1.4rem}
.dm-mini[data-theme="road"] .dm-mini__hero u{border-radius:3px;background:var(--acc);color:#fff}
.dm-mini[data-theme="road"] .dm-art{background:repeating-linear-gradient(90deg,#fff 0 26px,transparent 26px 48px) left calc(100% - 14px) / 100% 4px no-repeat;opacity:.8}

/* 6 coast — warm sand, layered sea waves, listing cards */
.dm-mini[data-theme="coast"] .dm-mini__hero{background:#EFE6D6;color:var(--acc);border-radius:22px}
.dm-mini[data-theme="coast"] .dm-mini__hero strong{font-weight:300}
.dm-mini[data-theme="coast"] .dm-art{background:radial-gradient(80% 30% at 30% 108%,var(--acc) 0 60%,transparent 61%),radial-gradient(90% 34% at 70% 104%,var(--acc2) 0 60%,transparent 61%)}

/* 7 sun — a sunrise: a big warm disc rising behind the words */
.dm-mini[data-theme="sun"] .dm-mini__hero{background:linear-gradient(180deg,#FFF3E0,#FFD9A8);color:#3A1E08;border-radius:22px}
.dm-mini[data-theme="sun"] .dm-mini__hero small{color:var(--acc)}
.dm-mini[data-theme="sun"] .dm-mini__hero u{background:var(--acc);color:#fff}
.dm-mini[data-theme="sun"] .dm-art{background:radial-gradient(circle at 86% 112%,var(--acc2) 0 18%,var(--acc) 26%,rgba(232,116,28,0) 42%)}

/* 8 counsel — classical: centred serif, double rules, faint columns */
.dm-mini[data-theme="counsel"] .dm-mini__hero{background:var(--bg);color:var(--acc);text-align:center;border-radius:0;border-top:3px double rgba(122,31,43,.45);border-bottom:3px double rgba(122,31,43,.45)}
.dm-mini[data-theme="counsel"] .dm-mini__hero strong,.dm-mini[data-theme="counsel"] .dm-mini__hero > span{margin-left:auto;margin-right:auto}
.dm-mini[data-theme="counsel"] .dm-mini__hero strong{font-weight:400}
.dm-mini[data-theme="counsel"] .dm-mini__hero > span{font-style:italic;color:#3b2a2c}
.dm-mini[data-theme="counsel"] .dm-mini__hero u{border-radius:0;background:var(--acc);color:#fff}
.dm-mini[data-theme="counsel"] .dm-art{background:repeating-linear-gradient(90deg,transparent 0 30px,rgba(122,31,43,.06) 30px 32px)}

/* 9 iron — black and lime, huge outlined capitals, slashes */
.dm-mini[data-theme="iron"] .dm-mini__hero{background:#0B0B0B;color:#fff;border-radius:0;margin:0}
.dm-mini[data-theme="iron"] .dm-mini__hero small{color:var(--acc)}
.dm-mini[data-theme="iron"] .dm-mini__hero strong{text-transform:uppercase;font-weight:900;color:transparent;-webkit-text-stroke:1.5px var(--acc);font-size:1.7rem}
.dm-mini[data-theme="iron"] .dm-mini__hero u{border-radius:0;background:var(--acc);color:#0B0B0B;text-transform:uppercase}
.dm-mini[data-theme="iron"] .dm-art{background:linear-gradient(72deg,transparent 0 78%,var(--acc) 78% 83%,transparent 83% 86%,var(--acc2) 86% 88%,transparent 88%)}

/* 10 studio — playful: giant type, overlapping discs, tilted tiles */
.dm-mini[data-theme="studio"] .dm-mini__hero{background:var(--bg);color:#151515;margin:0;border-radius:0}
.dm-mini[data-theme="studio"] .dm-mini__hero strong{font-size:2rem;letter-spacing:-.05em}
.dm-mini[data-theme="studio"] .dm-mini__hero u{background:#151515;color:#fff;transform:rotate(-3deg)}
.dm-mini[data-theme="studio"] .dm-art{background:radial-gradient(circle at 80% 30%,var(--acc) 0 16%,transparent 16.5%),radial-gradient(circle at 92% 52%,var(--acc2) 0 12%,transparent 12.5%),radial-gradient(circle at 70% 60%,#151515 0 4%,transparent 4.5%)}

@media (prefers-reduced-motion:reduce){.dm-card__shot,.dm-mini__chat,.dm-f{transition:none}}
/* desktop: every filter visible at once (the scroll row hid "Professional services" off the edge with no affordance) */
@media (min-width:900px){.dm__fs{flex-wrap:wrap;overflow:visible}}

/* S9: each wall card's hero carries its business's illustrated scene (th-scenes.js), in its own colours */
.dm-mini{--deepink:color-mix(in srgb,var(--acc) 32%,#111)}
.dm-mini[data-dark="1"]{--deepink:#F4F1EE}
.dm-mini .dm-art:has(.dms-scene){background:none!important}
.dm-mini__hero > :not(.dm-art){position:relative;z-index:1}
.dm-mini .dms-scene{width:50%;height:82%;opacity:.95}
@media (max-width:700px){.dm-mini .dms-scene{width:54%;opacity:.7}}

/* ═══ S10 (2026-09-28) · the DoubleDown AI look (Duval: "fit the style of doubledown ai… look clean and with quality").
   The wall's mini sites and the takeover's stand-in site wear ONE layout (th-sites.css ddai): white and paper, Satoshi,
   deep-green ink, the trade's scene in mint and deep green. The chat bubble and button on each card are the BUSINESS's
   colour (--bc) — the chatbot is their brand. The takeover sits on our deep green. The filter bar no longer rides under
   the site header on a phone (it overlapped the logo); on a desktop it sticks below the header, solid. ═══ */
.dm-mini[data-theme="ddai"]{background:#fff;color:#04241A;font-family:Switzer,ui-sans-serif,system-ui,sans-serif;box-shadow:inset 0 0 0 1px rgba(4,36,26,.08)}
.dm-mini[data-theme="ddai"] .dm-mini__nav{font-family:Satoshi,ui-sans-serif,system-ui,sans-serif;font-weight:800;border-bottom:1px solid rgba(4,36,26,.07)}
.dm-mini[data-theme="ddai"] .dm-logo{border-radius:50%}
.dm-mini[data-theme="ddai"] .dm-mini__hero{margin:10px 12px 0;height:calc(100% - 68px);background:linear-gradient(160deg,#F2F7F4,#E4EEE9);color:#04241A;border-radius:18px;text-align:left}
.dm-mini[data-theme="ddai"] .dm-mini__hero small{opacity:.55;font-weight:600;letter-spacing:.2em;color:inherit}
.dm-mini[data-theme="ddai"] .dm-mini__hero strong{font-family:Satoshi,ui-sans-serif,system-ui,sans-serif;font-weight:900;letter-spacing:-.045em;font-style:normal}
.dm-mini[data-theme="ddai"] .dm-mini__hero > span{opacity:.7;font-style:normal}
.dm-mini[data-theme="ddai"] .dm-mini__hero u{background:#04241A;color:#fff;box-shadow:none;border-radius:999px}
.dm-mini[data-theme="ddai"] .dm-art{background:none;--acc:#0B7A55;--acc2:#4FD8A6;--soft:#D6E8DF;--bg:#FFFFFF;--deepink:#04241A}
.dm-mini[data-theme="ddai"] .dm-mini__chat > span{background:var(--bc);color:var(--bc-ink)}
.dm-mini[data-theme="ddai"] .dm-mini__fab{background:var(--bc);color:var(--bc-ink)}
.dm-mini[data-theme="ddai"] .dm-av{box-shadow:0 0 0 2px #fff}
.dm-mini[data-theme="ddai"][data-dark="1"]{background:#063D2B;color:#fff}
.dm-mini[data-theme="ddai"][data-dark="1"] .dm-mini__nav{border-bottom-color:rgba(255,255,255,.1)}
.dm-mini[data-theme="ddai"][data-dark="1"] .dm-mini__hero{background:radial-gradient(90% 90% at 80% 0%,#0A5A3F,#063D2B 60%,#02180F);color:#fff}
.dm-mini[data-theme="ddai"][data-dark="1"] .dm-mini__hero u{background:#4FD8A6;color:#02241A}
.dm-mini[data-theme="ddai"][data-dark="1"] .dm-art{--acc:#4FD8A6;--acc2:#66E9B9;--soft:rgba(255,255,255,.08);--bg:#0A4A33;--deepink:#E4EEE9}
.dm-fs[data-theme="ddai"]{background:radial-gradient(90% 60% at 50% 0%,#0A5A3F 0%,#063D2B 45%,#02180F 100%)}
.dm-fs[data-theme="ddai"] .dm-fs__x{background:rgba(255,255,255,.1)}
.dm-fs[data-theme="ddai"] .dm-fs__view{box-shadow:0 30px 70px -30px rgba(0,0,0,.7)}
@media (max-width:899px){.dm__bar{position:relative;top:auto;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}}
@media (min-width:900px){.dm__bar{top:100px;background:var(--paper)}}