/* GENERATED MIRROR: source of truth is world1/css/concierge.css. Edit there, then run world1/_src/sync-concierge.py. */
/* Studio Concierge · shared component CSS (single source of truth: world1/css/concierge.css; the AI LAB gets a synced mirror).
   ONE component, TWO worlds. Geometry, typography, spacing, motion are identical; only the theme tokens below change.
     .cc-root                  = creative (World 1): azure / white / orange, luminous white glass
     .cc-root[data-mode="ai"]  = AI LAB (World 2): midnight / electric blue / violet, deep optical glass
   Type = Inter (variable, self-hosted in both worlds), tight tracking. */
/* Inter is declared once in fonts.css on World 1; this face is kept for the World 2 mirror, where the file sits beside it. */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(../assets/fonts/inter-var-latin.woff2) format('woff2')}
.cc-root{
  --cg-font:var(--font,Inter),system-ui,sans-serif;--cg-out:cubic-bezier(.2,.7,.2,1);--cg-ease:cubic-bezier(.4,0,.2,1);
  /* semantic theme tokens: creative */
  --cg-ink:#0F172A;--cg-mute:#5B6478;--cg-hair:var(--glass-hair,rgba(15,23,42,.08));
  --cg-primary:#2A8FFF;--cg-primary-ink:#1E7BE6;--cg-focus:rgba(42,143,255,.45);
  --cg-signal:radial-gradient(circle at 34% 30%,#ffd9c6 0,#ff9660 30%,#ff6a2b 58%,#d24a12 100%);
  --cg-signal-shadow:inset 0 -1px 1px rgba(120,30,0,.35),inset 0 1px 1px rgba(255,255,255,.6),0 1px 4px rgba(200,70,10,.35);
  --cg-alt-signal:radial-gradient(circle at 34% 30%,#eaf5ff 0,#8cc2ff 30%,#4f9dff 58%,#1f6fe0 100%);
  --cg-alt-signal-shadow:inset 0 -1px 1px rgba(10,40,120,.35),0 0 10px rgba(95,168,255,.8);
  --cg-glass:var(--glass-bg,rgba(238,246,255,.50));--cg-blur:var(--glass-blur,blur(30px) saturate(1.45) brightness(1.12));--cg-blur-m:var(--glass-blur-m,blur(22px) saturate(1.4));
  /* master rim: World 1's --glass-rim carries exactly these numbers; the literal stays here so the World 2 mirror is self-contained */
  --cg-rim:0 0 0 1px rgba(255,255,255,.85),0 0 0 2px rgba(150,200,255,.30),0 0 46px rgba(120,185,255,.40),0 34px 90px rgba(6,26,54,.22),inset 0 1px 0 rgba(255,255,255,.9),inset 0 0 0 1px rgba(255,255,255,.35);
  --cg-spec:linear-gradient(118deg,rgba(255,255,255,.55) 0%,rgba(255,255,255,.12) 26%,rgba(255,255,255,0) 50%),linear-gradient(180deg,rgba(255,255,255,.35),rgba(255,255,255,0) 22%),radial-gradient(70% 45% at 100% 100%,rgba(90,165,255,.28),transparent 62%),radial-gradient(50% 30% at 0% 100%,rgba(255,255,255,.35),transparent 60%);
  --cg-rimline:linear-gradient(200deg,rgba(255,255,255,.9),rgba(255,255,255,0) 30%,rgba(255,255,255,0) 70%,rgba(160,205,255,.8));
  --cg-inner-glow:inset -30px -30px 80px -50px rgba(255,255,255,0);
  --cg-card:var(--glass-card,rgba(255,255,255,.44));--cg-card-h:var(--glass-card-h,rgba(255,255,255,.62));--cg-card-top:rgba(255,255,255,.9);--cg-card-line:var(--glass-card-line,rgba(255,255,255,.75));--cg-card-line-h:rgba(255,255,255,.95);--cg-card-shadow-h:0 10px 26px rgba(6,26,54,.1);
  --cg-cap:linear-gradient(135deg,#4AA3FF,#1E7BE6);--cg-cap-ink:#fff;--cg-cap-shadow:inset 0 1px 0 rgba(255,255,255,.4),0 8px 20px rgba(30,123,230,.28);
  --cg-mark-bg:linear-gradient(145deg,#4FA6FF,#1E7BE6);--cg-mark-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 6px 16px rgba(30,123,230,.35);--cg-mark-ink:#fff;
  --cg-launch-bg:linear-gradient(135deg,rgba(255,255,255,.55),rgba(225,240,255,.35));
  --cg-launch-rim:0 0 0 1px rgba(255,255,255,.85),0 0 0 2px rgba(150,200,255,.28),0 0 30px rgba(120,185,255,.35),0 18px 44px rgba(6,26,54,.18),inset 0 1px 0 rgba(255,255,255,.9);
  --cg-launch-rim-h:0 0 0 1px rgba(255,255,255,.95),0 0 0 2px rgba(150,200,255,.4),0 0 40px rgba(120,185,255,.5),0 22px 50px rgba(6,26,54,.2),inset 0 1px 0 rgba(255,255,255,.95);
  --cg-status:radial-gradient(circle at 35% 30%,#bfe0ff,#2A8FFF 60%,#1565c9);--cg-status-glow:0 0 8px rgba(42,143,255,.7);
  --cg-send-bg:linear-gradient(145deg,rgba(255,255,255,.95),rgba(214,234,255,.9));--cg-send-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(255,255,255,.9),0 4px 12px rgba(30,123,230,.2),0 0 0 1px rgba(150,200,255,.35);
  --cg-input-bg-f:rgba(255,255,255,.6);--cg-head-line:rgba(255,255,255,.55);--cg-more-h:rgba(255,255,255,.55);--cg-thinking:rgba(120,190,255,.9);
  position:fixed;right:32px;bottom:32px;z-index:8500;font-family:var(--cg-font);font-feature-settings:"cv11","ss01","calt";letter-spacing:-.018em;color:var(--cg-ink);-webkit-font-smoothing:antialiased}
/* ---------- AI LAB theme: same physics, different light ---------- */
.cc-root[data-mode="ai"]{
  --cg-ink:#F7F9FF;--cg-mute:rgba(214,224,255,.64);--cg-hair:rgba(190,208,255,.14);
  --cg-primary:#5FA8FF;--cg-primary-ink:#8CC0FF;--cg-focus:rgba(95,168,255,.5);
  --cg-signal:radial-gradient(circle at 34% 30%,#eaf5ff 0,#8cc2ff 30%,#4f9dff 58%,#1f6fe0 100%);
  --cg-signal-shadow:inset 0 -1px 1px rgba(10,40,120,.35),inset 0 1px 1px rgba(255,255,255,.55),0 0 8px rgba(95,168,255,.75);
  --cg-alt-signal:radial-gradient(circle at 34% 30%,#ffd9c6 0,#ff9660 30%,#ff6a2b 58%,#d24a12 100%);
  --cg-alt-signal-shadow:inset 0 -1px 1px rgba(120,30,0,.35),0 0 10px rgba(255,106,43,.7);
  --cg-glass:rgba(13,20,56,.58);--cg-blur:blur(30px) saturate(1.4);--cg-blur-m:blur(22px) saturate(1.35);
  --cg-rim:0 0 0 1px rgba(130,170,255,.42),0 0 0 2px rgba(110,77,255,.16),0 0 46px rgba(36,107,255,.32),0 34px 90px rgba(2,6,24,.6),inset 0 1px 0 rgba(170,205,255,.42),inset 0 0 0 1px rgba(255,255,255,.07);
  --cg-spec:radial-gradient(60% 40% at 0% 0%,rgba(70,140,255,.30),transparent 62%),linear-gradient(180deg,rgba(150,190,255,.14),rgba(150,190,255,0) 22%),radial-gradient(60% 45% at 100% 100%,rgba(110,77,255,.24),transparent 62%);
  --cg-rimline:linear-gradient(200deg,rgba(150,195,255,.85),rgba(150,195,255,0) 30%,rgba(110,77,255,0) 70%,rgba(110,77,255,.7));
  --cg-inner-glow:inset -30px -30px 80px -50px rgba(110,77,255,.55);
  --cg-card:rgba(255,255,255,.065);--cg-card-h:rgba(255,255,255,.11);--cg-card-top:rgba(255,255,255,.12);--cg-card-line:rgba(160,190,255,.22);--cg-card-line-h:rgba(160,190,255,.42);--cg-card-shadow-h:0 10px 26px rgba(2,6,24,.35);
  --cg-cap:linear-gradient(135deg,#3B86FF,#246BFF);--cg-cap-ink:#fff;--cg-cap-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 8px 20px rgba(36,107,255,.32);
  --cg-mark-bg:linear-gradient(145deg,rgba(28,60,170,.72),rgba(63,42,143,.78)),var(--cg-flower,linear-gradient(145deg,#1B3FA8,#3F2A8F)) center/cover;--cg-mark-shadow:inset 0 1px 0 rgba(170,205,255,.4),0 6px 16px rgba(36,107,255,.35),0 0 0 1px rgba(130,170,255,.35);--cg-mark-ink:#fff;
  --cg-launch-bg:linear-gradient(135deg,rgba(40,74,170,.55),rgba(63,42,143,.38));
  --cg-launch-rim:0 0 0 1px rgba(130,170,255,.5),0 0 0 2px rgba(110,77,255,.18),0 0 30px rgba(36,107,255,.3),0 18px 44px rgba(2,6,24,.5),inset 0 1px 0 rgba(170,205,255,.4);
  --cg-launch-rim-h:0 0 0 1px rgba(160,195,255,.75),0 0 0 2px rgba(110,77,255,.28),0 0 40px rgba(36,107,255,.45),0 22px 50px rgba(2,6,24,.55),inset 0 1px 0 rgba(170,205,255,.55);
  --cg-status:radial-gradient(circle at 35% 30%,#dff0ff,#5FA8FF 60%,#246BFF);--cg-status-glow:0 0 8px rgba(95,168,255,.8);
  --cg-send-bg:linear-gradient(145deg,rgba(60,110,230,.9),rgba(36,107,255,.85));--cg-send-shadow:inset 0 1px 0 rgba(255,255,255,.3),inset 0 0 0 1px rgba(160,195,255,.35),0 4px 12px rgba(36,107,255,.35);
  --cg-input-bg-f:rgba(255,255,255,.1);--cg-head-line:rgba(160,190,255,.16);--cg-more-h:rgba(255,255,255,.1);--cg-thinking:rgba(150,195,255,.95)}
.cc-root[data-mode="ai"] .cg-send{color:#fff}
.cc-root[data-mode="ai"] .cg-mark i{opacity:1;color:#8CC0FF}
.cc-root[data-mode="ai"] .cg-mark::after{box-shadow:var(--cg-signal-shadow),0 0 0 2px rgba(13,20,56,.9)}
.cc-root button{font-family:inherit;letter-spacing:inherit}
/* the signal sphere (shared) */
.cg-bead,.cg-rail-bead,.cg-welcome h2 i,.cg-cap i,.cg-opt.picked::after,.cg-cta::before,.cg-mark::after,.cc-root[data-state="min"] .cg::after{background:var(--cg-signal);box-shadow:var(--cg-signal-shadow)}
/* ---------- closed capsule ---------- */
.cg{position:relative;display:flex;align-items:center;gap:12px;height:56px;padding:0 20px 0 20px;border-radius:28px;border:0;cursor:pointer;color:var(--cg-ink);font:500 16px/1 var(--cg-font);letter-spacing:-.02em;
  background:var(--cg-launch-bg);box-shadow:var(--cg-launch-rim);
  -webkit-backdrop-filter:var(--cg-blur-m);backdrop-filter:var(--cg-blur-m);
  transition:transform .3s var(--cg-out),box-shadow .3s var(--cg-out),width .35s var(--cg-out),padding .35s var(--cg-out),opacity .3s}
.cg:hover{transform:translateY(-1px);box-shadow:var(--cg-launch-rim-h)}
.cg:focus-visible{outline:none;box-shadow:0 0 0 3px var(--cg-focus),0 18px 44px rgba(6,26,54,.18)}
.cg-bead{width:10px;height:10px;border-radius:50%;flex:none;animation:cgIdle 7s var(--cg-ease) infinite}
@keyframes cgIdle{0%,78%,100%{transform:translateX(0)}84%{transform:translateX(12px)}92%{transform:translateX(-2px)}}
.cc-root[data-mode="ai"] .cg-bead{width:8px;height:8px;animation:cgPulse 7s var(--cg-ease) infinite}
@keyframes cgPulse{0%,80%,100%{transform:scale(1)}86%{transform:scale(1.35)}93%{transform:scale(.95)}}
.cg-cue{color:var(--cg-ink);opacity:.75;font-size:17px;margin-left:2px;transition:transform .3s var(--cg-out)}
.cg:hover .cg-cue{transform:translateX(3px);opacity:1}
.cg-mini,.cg-continue{display:none}
.cc-root[data-state="min"] .cg{width:56px;height:56px;padding:0;border-radius:18px;justify-content:center;gap:0}
.cc-root[data-state="min"] .cg-bead,.cc-root[data-state="min"] .cg-label,.cc-root[data-state="min"] .cg-cue{display:none}
.cc-root[data-state="min"] .cg-mini{display:block;font:600 19px/1 var(--cg-font);letter-spacing:-.05em}
.cc-root[data-state="min"] .cg-mini i{font-style:normal;color:#FF6A2B}
.cc-root[data-mode="ai"][data-state="min"] .cg-mini i{color:var(--cg-primary-ink)}
.cc-root[data-state="min"] .cg::after{content:"";position:absolute;right:8px;top:8px;width:7px;height:7px;border-radius:50%}
.cc-root[data-state="min"] .cg:hover{width:236px;border-radius:28px;justify-content:flex-start;padding:0 22px;gap:12px}
.cc-root[data-state="min"] .cg:hover .cg-continue{display:block;white-space:nowrap;padding-right:14px}
.cc-root[data-state="min"] .cg:hover::after{top:50%;right:16px;margin-top:-4px}
/* ---------- panel: one luminous glass sheet ---------- */
.cg-panel{position:absolute;right:0;bottom:0;width:min(620px,calc(100vw - 64px));max-height:min(84vh,780px);display:flex;border-radius:36px;transform-origin:100% 100%;transform:scale(.3,.08);opacity:0;pointer-events:none;
  background:var(--cg-glass);box-shadow:var(--cg-rim);
  -webkit-backdrop-filter:var(--cg-blur);backdrop-filter:var(--cg-blur);
  transition:transform .65s var(--cg-out),opacity .3s ease;will-change:transform}
.cg-panel::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:var(--cg-spec)}
.cg-panel::after{content:"";position:absolute;inset:-1px;border-radius:inherit;pointer-events:none;background:var(--cg-rimline);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1.5px;opacity:.9}
.cc-root.is-open .cg-panel{transform:none;opacity:1;pointer-events:auto}
.cc-root.is-open .cg{opacity:0;pointer-events:none;transform:scale(.6)}
/* the light travels through the glass: the rim (blue) is immediate, the inner violet refraction follows */
.cg-inner{position:relative;flex:1;display:flex;flex-direction:column;min-height:0;opacity:0;transition:opacity .35s ease .3s,box-shadow .8s ease .35s;overflow:hidden;border-radius:inherit;box-shadow:inset -30px -30px 80px -50px rgba(110,77,255,0)}
.cc-root.is-open .cg-inner{opacity:1;box-shadow:var(--cg-inner-glow)}
/* the bead's rail: invisible track along the left edge, only the sphere is seen */
.cg-rail{position:absolute;left:0;top:28px;bottom:28px;width:0;z-index:2}
.cg-rail.thinking::before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;border-radius:2px;background:linear-gradient(180deg,transparent,var(--cg-thinking),transparent);animation:cgRail 1.3s var(--cg-ease) infinite;transform-origin:top}
@keyframes cgRail{from{transform:translateY(-40%) scaleY(.4);opacity:0}30%{opacity:1}to{transform:translateY(100%) scaleY(.4);opacity:0}}
.cg-rail-bead{position:absolute;left:-5px;top:64%;width:10px;height:10px;margin-top:-5px;border-radius:50%;transition:top .55s var(--cg-out),background .3s,box-shadow .3s}
.cg-rail-bead.up{transition-duration:.45s}.cg-rail-bead.land{transition-duration:.7s}.cg-rail-bead.toai{transition-duration:.48s}
.cg-rail-bead.blue{background:var(--cg-alt-signal);box-shadow:var(--cg-alt-signal-shadow)}
/* header */
.cg-head{display:flex;align-items:center;gap:14px;height:84px;padding:0 24px 0 32px;border-bottom:1px solid var(--cg-head-line);box-shadow:0 1px 0 var(--cg-hair);flex:none}
.cg-mark{position:relative;width:40px;height:40px;border-radius:12px;background:var(--cg-mark-bg);color:var(--cg-mark-ink);display:inline-flex;align-items:center;justify-content:center;font:600 16px/1 var(--cg-font);letter-spacing:-.05em;flex:none;box-shadow:var(--cg-mark-shadow)}
.cg-mark i{font-style:normal;color:#fff;opacity:.9}
.cg-mark::after{content:"";position:absolute;right:-3px;bottom:-3px;width:9px;height:9px;border-radius:50%;box-shadow:0 0 0 2px rgba(255,255,255,.9)}
.cg-title{display:flex;flex-direction:column;line-height:1.2;gap:2px}
.cg-title b{font-size:16.5px;font-weight:500;letter-spacing:-.024em}.cg-title span{font-size:13px;color:var(--cg-mute);letter-spacing:-.01em}
.cg-status{margin-left:auto;display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--cg-mute)}
.cg-status::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--cg-status);box-shadow:var(--cg-status-glow)}
.cg-more,.cg-close{width:38px;height:38px;border-radius:12px;color:var(--cg-ink);font-size:15px;display:inline-flex;align-items:center;justify-content:center;transition:background .2s;opacity:.7;letter-spacing:.05em}
.cg-close{font-size:22px;line-height:1;letter-spacing:0}
.cg-more:hover,.cg-close:hover{background:var(--cg-more-h);opacity:1}
/* conversation: hidden scrollbar + fade masks */
.cg-conv{flex:1 1 auto;min-height:0;overflow-y:auto;padding:30px 40px 18px;scroll-behavior:smooth;overscroll-behavior:contain;scrollbar-width:none;-ms-overflow-style:none;
  -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,var(--fade-top,1)) 0,#000 24px,#000 calc(100% - 32px),rgba(0,0,0,var(--fade-bot,1)) 100%);mask-image:linear-gradient(180deg,rgba(0,0,0,var(--fade-top,1)) 0,#000 24px,#000 calc(100% - 32px),rgba(0,0,0,var(--fade-bot,1)) 100%)}
.cg-conv::-webkit-scrollbar{display:none;width:0;height:0}
.cg-conv.can-up{--fade-top:0}.cg-conv.can-down{--fade-bot:0}
.cg-welcome h2{font-size:34px;font-weight:400;line-height:1.1;letter-spacing:-.04em;margin:14px 0 26px;color:var(--cg-ink)}
.cg-welcome h2 i{display:inline-block;width:9px;height:9px;margin-left:6px;border-radius:50%;vertical-align:baseline}
.cg-sugs{display:flex;flex-direction:column;gap:12px}
.cg-sug{display:grid;grid-template-columns:24px 1fr auto;gap:2px 18px;align-items:center;text-align:left;padding:20px 22px 20px 22px;min-height:82px;border-radius:20px;color:var(--cg-ink);
  background:var(--cg-card);box-shadow:inset 0 0 0 1px var(--cg-card-line),inset 0 1px 0 var(--cg-card-top),0 1px 0 var(--cg-hair);
  transition:background .18s,transform .25s var(--cg-out),box-shadow .25s}
.cg-sug-ic{grid-column:1;grid-row:1/3;color:var(--cg-primary-ink);display:inline-flex}
.cg-sug b{grid-column:2;grid-row:1;font-size:16px;font-weight:500;letter-spacing:-.022em}.cg-sug small{grid-column:2;grid-row:2;font-size:13.5px;color:var(--cg-mute);letter-spacing:-.01em}
.cg-sug-arrow{grid-column:3;grid-row:1/3;color:var(--cg-ink);opacity:.8;display:inline-flex;transition:transform .25s var(--cg-out)}
.cg-sug:hover{background:var(--cg-card-h);transform:translateY(-1px);box-shadow:inset 0 0 0 1px var(--cg-card-line-h),inset 0 1px 0 var(--cg-card-top),var(--cg-card-shadow-h)}
.cg-sug:hover .cg-sug-arrow{transform:translateX(3px)}
.cg-hint{display:block;margin:14px 2px 0;font-size:13.5px;font-weight:450;color:var(--cg-mute);letter-spacing:-.01em;text-align:left;transition:color .2s}
.cg-hint:hover{color:var(--cg-primary-ink)}
.cg-askhint{font-size:13px;color:var(--cg-mute);letter-spacing:-.01em;margin:-8px 0 14px}
.cg-msg{margin:0 0 22px;animation:cgIn .4s var(--cg-out) both}
.cg-msg.no-anim,.cg-msg.no-anim .cg-block{animation:none}
@keyframes cgIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.cg-user{display:flex;justify-content:flex-end}
.cg-cap{position:relative;display:inline-block;max-width:78%;padding:11px 30px 11px 18px;border-radius:20px 20px 6px 20px;font-size:14.5px;font-weight:500;line-height:1.4;color:var(--cg-cap-ink);letter-spacing:-.015em;background:var(--cg-cap);box-shadow:var(--cg-cap-shadow)}
.cg-cap i{position:absolute;right:12px;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%}
.cg-ai .cg-block{animation:cgIn .4s var(--cg-out) both;animation-delay:calc(var(--i) * 110ms)}
.cg-t{font-size:15.5px;font-weight:450;line-height:1.55;letter-spacing:-.016em;max-width:94%;margin:0 0 14px}
.cg-opts{display:flex;flex-wrap:wrap;gap:8px;margin:2px 0 18px}
.cg-opt{height:40px;padding:0 15px;border-radius:14px;background:var(--cg-card);box-shadow:inset 0 0 0 1px var(--cg-card-line),0 1px 0 var(--cg-hair);font-size:14px;font-weight:500;letter-spacing:-.015em;color:var(--cg-ink);transition:background .14s,box-shadow .14s}
.cg-opt:hover{background:var(--cg-card-h);box-shadow:inset 0 0 0 1px var(--cg-card-line-h),0 6px 16px rgba(6,26,54,.08)}
.cg-opt.picked{background:rgba(255,255,255,.7);box-shadow:inset 0 0 0 1px rgba(42,143,255,.7);display:inline-flex;align-items:center}
.cc-root[data-mode="ai"] .cg-opt.picked{background:var(--cg-card-h);box-shadow:inset 0 0 0 1px var(--cg-primary)}
.cg-opt.picked::after{content:"";display:inline-block;width:6px;height:6px;margin-left:8px;border-radius:50%}
.cg-opt:disabled:not(.picked){opacity:.4}
/* content blocks: hairlines on the glass, no boxes */
.cg-card{padding:6px 0 4px;margin:4px 0 18px}
.cg-eyebrow{font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--cg-primary-ink);margin:0 0 6px}
.cg-step{display:grid;grid-template-columns:34px 1fr;gap:1px 8px;padding:12px 0;border-top:1px solid var(--cg-hair);position:relative}
.cg-step:last-child{border-bottom:1px solid var(--cg-hair)}
.cg-step::after{content:"";position:absolute;left:0;bottom:-1px;width:0;height:1px;background:var(--cg-primary);transition:width .35s var(--cg-out)}
.cg-step:hover::after{width:100%}
.cg-step span{color:#FF6A2B;font-size:11.5px;font-weight:600;grid-row:1/3;padding-top:3px;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.cc-root[data-mode="ai"] .cg-step span{color:var(--cg-primary-ink)}
.cg-step b{font-size:15px;font-weight:500;letter-spacing:-.02em}.cg-step small{font-size:13px;color:var(--cg-mute);letter-spacing:-.01em}
.cg-snap .cg-row{display:grid;grid-template-columns:150px 1fr;gap:2px 14px;padding:11px 0;border-top:1px solid var(--cg-hair)}
.cg-snap .cg-row:last-child{border-bottom:1px solid var(--cg-hair)}
.cg-snap small{font-size:12.5px;color:var(--cg-mute);letter-spacing:-.005em;padding-top:2px}
.cg-snap b{font-size:14.5px;font-weight:500;letter-spacing:-.02em;line-height:1.35}
/* system map (AI LAB): two columns of fine glass modules joined by thin connections; one active path */
.cg-map{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:4px 0 20px}
.cg-map-col{display:flex;flex-direction:column}
.cg-map-col .cg-eyebrow{margin-bottom:10px}
.cg-node{position:relative;padding:10px 12px 10px 14px;border-radius:12px;background:var(--cg-card);box-shadow:inset 0 0 0 1px var(--cg-card-line);font-size:13.5px;font-weight:500;letter-spacing:-.015em;color:var(--cg-ink)}
.cg-node+.cg-node{margin-top:14px}
.cg-node+.cg-node::before{content:"";position:absolute;left:18px;top:-14px;height:14px;width:1px;background:var(--cg-hair)}
.cg-map-col.is-active .cg-node+.cg-node::before{background:var(--cg-primary);opacity:.55}
.cg-node.is-new{box-shadow:inset 0 0 0 1px var(--cg-primary)}
.cg-node.is-human{color:var(--cg-mute)}
.cg-node i{position:absolute;right:10px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--cg-primary);box-shadow:0 0 6px var(--cg-focus);opacity:0}
.cg-node.is-new i{opacity:1}
.cg-svc{border-top:1px solid var(--cg-hair)}
.cg-svc:last-child{border-bottom:1px solid var(--cg-hair)}
.cg-svc summary{list-style:none;display:grid;grid-template-columns:1fr auto;gap:1px 12px;padding:13px 2px;cursor:pointer}
.cg-svc summary::-webkit-details-marker{display:none}
.cg-svc summary b{grid-column:1;grid-row:1;font-size:15px;font-weight:500;letter-spacing:-.02em}.cg-svc summary small{grid-column:1;grid-row:2;font-size:13px;color:var(--cg-mute)}
.cg-svc summary i{grid-column:2;grid-row:1/3;align-self:center;width:14px;height:14px;position:relative}
.cg-svc summary i::before,.cg-svc summary i::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;border-radius:1px;background:var(--cg-primary-ink);transform:translate(-50%,-50%)}
.cg-svc summary i::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .25s}
.cg-svc[open] summary i::after{transform:translate(-50%,-50%)}
.cg-svc p{font-size:14px;font-weight:450;line-height:1.55;padding:0 2px 14px;color:var(--cg-ink)}
.cg-svc.is-ai summary b::after{content:"";display:inline-block;width:6px;height:6px;margin-left:8px;border-radius:50%;background:#5FA8FF;vertical-align:middle;box-shadow:0 0 6px rgba(95,168,255,.8)}
.cg-svc p a{color:var(--cg-primary-ink);font-weight:500;text-decoration:none}
.cg-cases{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:2px 0 18px}
.cg-cases:has(> :only-child){grid-template-columns:1fr}
.cg-case{display:flex;flex-direction:column;border-radius:20px;overflow:hidden;background:var(--cg-card);box-shadow:inset 0 0 0 1px var(--cg-card-line),0 1px 0 var(--cg-hair);color:var(--cg-ink);transition:transform .25s var(--cg-out),box-shadow .25s,background .2s}
.cg-case:hover{transform:translateY(-1px);background:var(--cg-card-h);box-shadow:inset 0 0 0 1px var(--cg-card-line-h),0 12px 30px rgba(6,26,54,.12)}
.cg-case img{width:100%;aspect-ratio:16/10;object-fit:cover}
.cg-case-body{display:flex;flex-direction:column;gap:2px;padding:14px 16px 16px}
.cg-case-body b{font-size:14.5px;font-weight:500;letter-spacing:-.02em}.cg-case-body small{font-size:12px;color:var(--cg-mute)}
.cg-case-body p{font-size:13px;line-height:1.45;color:var(--cg-mute);margin:6px 0 8px}
.cg-case-body em{font-style:normal;font-size:13px;font-weight:500;color:var(--cg-primary-ink)}
.cg-book b{display:block;font-size:17px;font-weight:500;letter-spacing:-.025em}.cg-book small{display:block;font-size:13px;color:var(--cg-mute);margin:3px 0 10px}.cg-book p{font-size:14px;line-height:1.55;margin:0 0 14px;color:var(--cg-ink)}
.cg-cta{display:inline-flex;align-items:center;height:42px;padding:0 18px;border-radius:14px;background:var(--cg-cap);color:var(--cg-cap-ink);font-size:14px;font-weight:500;letter-spacing:-.015em;box-shadow:var(--cg-cap-shadow);transition:transform .25s var(--cg-out),box-shadow .25s}
.cg-cta::before{content:"";width:7px;height:7px;border-radius:50%;margin-right:10px}
.cg-cta:hover{transform:translateY(-1px)}
.cg-link{display:inline-flex;align-items:center;gap:8px;margin:0 0 18px;font-size:14.5px;font-weight:500;letter-spacing:-.015em;color:var(--cg-primary-ink);text-decoration:none;transition:opacity .2s}
.cg-link:hover{opacity:.75}
.cg-contact ul{margin:0 0 6px;padding:0;list-style:none}
.cg-contact li{position:relative;padding:8px 0 8px 16px;font-size:14.5px;font-weight:450;border-top:1px solid var(--cg-hair)}
.cg-contact li::before{content:"";position:absolute;left:0;top:15px;width:5px;height:5px;border-radius:50%;background:var(--cg-primary)}
.cg-contact label{display:block;font-size:12.5px;color:var(--cg-mute);margin:12px 0 0}
.cg-contact input{display:block;width:100%;height:44px;margin-top:5px;padding:0 14px;border-radius:14px;border:0;background:var(--cg-card-h);box-shadow:inset 0 0 0 1px var(--cg-card-line),0 1px 0 var(--cg-hair);font:inherit;font-size:14.5px;color:var(--cg-ink)}
.cg-contact input:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--cg-primary),0 0 0 4px rgba(42,143,255,.12)}
.cg-contact .cg-cta{margin-top:14px}
.cg-fine{display:block;margin-top:10px;font-size:12px;color:var(--cg-mute)}
/* world portals: AI LAB card (midnight, flower) in World 1 · Creative Studio card (warm white, orange signal) in the AI LAB */
.cg-ailab{position:relative;display:grid;grid-template-columns:42% 1fr;min-height:150px;margin:2px 0 18px;border-radius:20px;overflow:hidden;background:#070D1F;color:#fff;box-shadow:inset 0 0 0 1px rgba(120,176,255,.35),0 16px 40px rgba(3,8,24,.3);transition:box-shadow .5s}
.cg-ailab-visual{position:relative;overflow:hidden;background:#050A19}
.cg-ailab-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:68% 48%;transform:scale(1.35);transform-origin:68% 48%;transition:filter .6s,transform .8s}
.cg-ailab-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,13,31,0) 70%,rgba(7,13,31,.9))}
.cg-ailab-body{display:flex;flex-direction:column;padding:18px 20px 16px}
.cg-ailab-eyebrow{font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#7EB2FF}
.cg-ailab b{margin-top:8px;font-size:17px;font-weight:600;letter-spacing:.02em}
.cg-ailab small{margin-top:6px;font-size:13px;line-height:1.45;color:rgba(255,255,255,.65)}
.cg-ailab em{margin-top:auto;font-style:normal;font-size:13.5px;font-weight:500;color:#fff}
.cg-ailab-spark{position:absolute;left:-4px;top:24px;width:8px;height:8px;border-radius:50%;background:#5FA8FF;box-shadow:0 0 0 2px rgba(255,255,255,.4),0 0 10px rgba(95,168,255,.9);opacity:0}
.cg-ailab.lit{box-shadow:inset 0 0 0 1px rgba(150,200,255,.75),0 16px 40px rgba(30,90,220,.32)}
.cg-ailab.lit .cg-ailab-visual img{filter:brightness(1.25) saturate(1.1)}
.cg-ailab.lit .cg-ailab-spark{animation:cgSpark .5s ease}
@keyframes cgSpark{0%{opacity:1;transform:scale(1)}50%{opacity:1;transform:scale(2.2)}100%{opacity:0;transform:scale(1)}}
.cg-studio{position:relative;display:flex;flex-direction:column;min-height:132px;margin:2px 0 18px;padding:18px 20px 16px;border-radius:20px;overflow:hidden;background:linear-gradient(160deg,#FFFFFF,#F5F1EA);color:#0F172A;box-shadow:inset 0 0 0 1px rgba(255,255,255,.9),0 16px 40px rgba(2,6,24,.35);transition:box-shadow .5s}
.cg-studio-eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#1E7BE6}
.cg-studio-eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:radial-gradient(circle at 34% 30%,#ffd9c6 0,#ff9660 30%,#ff6a2b 58%,#d24a12 100%)}
.cg-studio b{margin-top:8px;font-size:17px;font-weight:600;letter-spacing:-.02em}
.cg-studio small{margin-top:6px;font-size:13px;line-height:1.45;color:#5B6478;max-width:360px}
.cg-studio em{margin-top:auto;padding-top:14px;font-style:normal;font-size:13.5px;font-weight:500;color:#0F172A}
.cg-studio .cg-ailab-spark{background:#FF6A2B;box-shadow:0 0 0 2px rgba(255,255,255,.7),0 0 10px rgba(255,106,43,.9)}
.cg-studio.lit{box-shadow:inset 0 0 0 1px rgba(255,140,90,.7),0 16px 40px rgba(255,106,43,.22)}
.cg-studio.lit .cg-ailab-spark{animation:cgSpark .5s ease}
/* input: glass capsule */
.cg-input{flex:none;display:flex;align-items:center;gap:6px;margin:8px 22px 22px 22px;height:60px;padding:0 10px 0 8px;border-radius:20px;background:var(--cg-card);box-shadow:inset 0 0 0 1px var(--cg-card-line),inset 0 1px 0 var(--cg-card-top),0 1px 0 var(--cg-hair);transition:box-shadow .2s,background .2s}
.cg-input:focus-within{background:var(--cg-input-bg-f);box-shadow:inset 0 0 0 1px var(--cg-card-line-h),inset 0 1px 0 var(--cg-card-top),0 0 0 4px rgba(42,143,255,.12)}
.cg-plus{width:40px;height:40px;border-radius:12px;color:var(--cg-primary-ink);font-size:22px;font-weight:300;line-height:1;transition:background .2s}
.cg-plus:hover{background:var(--cg-card-h)}
.cg-input input{flex:1;min-width:0;height:100%;border:0;background:none;font:inherit;font-size:15.5px;font-weight:450;color:var(--cg-ink);outline:none;letter-spacing:-.016em;padding-left:6px}
.cg-input input::placeholder{color:var(--cg-mute);font-weight:400}
.cg-send{position:relative;width:42px;height:42px;border-radius:50%;background:var(--cg-send-bg);color:var(--cg-primary-ink);display:inline-flex;align-items:center;justify-content:center;box-shadow:var(--cg-send-shadow);transition:transform .25s var(--cg-out),box-shadow .25s}
.cg-send svg{width:18px;height:18px}
.cg-send::after{content:"";position:absolute;right:-1px;top:-1px;width:8px;height:8px;border-radius:50%;background:var(--cg-signal);box-shadow:0 0 0 2px rgba(255,255,255,.9);opacity:0;transform:scale(.5);transition:opacity .25s,transform .25s var(--cg-out)}
.cc-root[data-mode="ai"] .cg-send::after{box-shadow:0 0 0 2px rgba(13,20,56,.95)}
.cg-send.armed{box-shadow:var(--cg-send-shadow),0 0 0 1.5px var(--cg-primary)}
.cg-send.armed::after{opacity:1;transform:scale(1)}
.cg-send:hover{transform:translateX(1px)}
.cg-panel *:focus-visible{outline:none;box-shadow:0 0 0 3px var(--cg-focus)}
.cg-input input:focus-visible{box-shadow:none}
/* mobile */
@media (max-width:809px){
  .cc-root{right:14px;bottom:calc(14px + env(safe-area-inset-bottom))}
  .cg{height:52px;font-size:15px}
  .cg-panel{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));width:auto;max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom));border-radius:28px;-webkit-backdrop-filter:var(--cg-blur-m);backdrop-filter:var(--cg-blur-m);--cg-glass:rgba(238,246,255,.55)}
  .cc-root[data-mode="ai"] .cg-panel{--cg-glass:rgba(13,20,56,.66)}
  .cg-head{height:72px;padding:0 14px 0 20px;gap:12px}
  .cg-mark{width:36px;height:36px;font-size:15px}
  .cg-status{display:none}
  .cg-conv{padding:22px 20px 12px}
  .cg-welcome h2{font-size:29px}
  .cg-sug{padding:16px 18px;min-height:74px;gap:2px 14px;border-radius:18px}
  .cg-cases{grid-template-columns:1fr}
  .cg-map{grid-template-columns:1fr;gap:14px}
  .cg-ailab{grid-template-columns:38% 1fr;min-height:132px}
  .cg-input{margin:6px 14px calc(14px + env(safe-area-inset-bottom)) 14px;height:56px}
  .cg-input input{font-size:16px}
  .cg-snap .cg-row{grid-template-columns:118px 1fr}
}
@media (prefers-reduced-motion:reduce){
  .cg-bead,.cg-rail.thinking::before,.cg-ailab-spark{animation:none!important}
  .cg-panel{transition:opacity .25s ease;transform:none}
  .cg-inner{transition:opacity .25s ease}
  .cg-msg,.cg-ai .cg-block{animation:none}
  .cg-rail-bead{transition:none}
}

/* the consent bar owns the bottom edge until the visitor decides (narrow screens only: there the bar is full width) */
@media (max-width:900px){.cc-root.cc-pending{opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .3s var(--cg-out),transform .3s var(--cg-out)}}
@media (prefers-reduced-motion:reduce){.cc-root.cc-pending{transition:none}}