/* Clio Drone — coquille mobile app-like. Genere depuis template-appmobile.html — ne pas editer a la main. */
@font-face{font-family:'CDMichroma';src:url('/assets/fonts/Michroma-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:'CDRoboto';src:url('/assets/fonts/Roboto-Variable.ttf') format('truetype');font-weight:100 900;font-display:swap}
@font-face{font-family:'CDRoboto';src:url('/assets/fonts/Roboto-Italic-Variable.ttf') format('truetype');font-weight:100 900;font-style:italic;font-display:swap}

:root{
  --navy:#0C2334; --navy-2:#12354A; --panel:#0F2B3E; --cream:#F3EEE3; --ink:#0A1720;
  --muted:#93A9B6; --amber:#7FC9DE; --amber-dim:rgba(127,201,222,.16); --line:rgba(243,238,227,.13); --cyan:#7FC9DE;
  --shadow:0 30px 80px -26px rgba(0,0,0,.8);
}
:root[data-theme="light"]{
  --navy:#F3EEE3; --navy-2:#E7DFCC; --panel:#FBF8F1; --cream:#0C2334; --ink:#0C2334;
  --muted:#5C6E79; --amber:#2C6E87; --amber-dim:rgba(44,110,135,.14); --line:rgba(12,35,52,.14); --cyan:#2C6E87;
  --shadow:0 30px 80px -26px rgba(60,50,20,.32);
}
#cd-app *{box-sizing:border-box}
#cd-app{position:fixed;inset:0;z-index:2147483000;background:var(--navy);color:var(--cream);overflow:hidden;font-family:'CDRoboto',system-ui,sans-serif;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%;text-size-adjust:100%}
#cd-app .backbtn, #cd-app .iconbtn{all:unset;cursor:pointer;width:38px;height:38px;border-radius:50%;
  background:rgba(9,23,32,.5);backdrop-filter:blur(8px);border:1px solid var(--line);
  display:flex;align-items:center;justify-content:center;color:#fff}
#cd-app .backbtn:active, #cd-app .iconbtn:active{transform:scale(.9)}
#cd-app .lock{position:absolute;inset:0;z-index:50;overflow:hidden;
  background:radial-gradient(ellipse at 50% 36%, #0C2637 0%, #071824 58%, #030B12 100%);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  -webkit-touch-callout:none;-webkit-user-select:none;user-select:none;
  transition:transform .6s cubic-bezier(.6,0,.2,1),opacity .5s ease}
#cd-app .lock.gone{transform:scale(1.7);opacity:0;filter:blur(7px);pointer-events:none;
  transition:transform .8s cubic-bezier(.5,0,.2,1),opacity .6s ease .1s,filter .6s ease}
#cd-app .lock-bg{position:absolute;inset:-10%;z-index:0;opacity:.08;filter:blur(38px) saturate(.7);
  background-size:cover;background-position:center;background-repeat:no-repeat}
#cd-app .lock-inner{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:26px;padding:0 30px}
#cd-app .bigbtn{position:relative;width:210px;height:210px;border-radius:50%;cursor:pointer;
  background:radial-gradient(circle at 50% 42%, #FFFFFF, #E7F0F3 78%);
  display:flex;align-items:center;justify-content:center;touch-action:none;user-select:none;-webkit-user-select:none;
  -webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;
  animation:breathe 3.6s ease-in-out infinite}
#cd-app .bigbtn *{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none}
@keyframes breathe{
  0%,100%{box-shadow:0 0 0 1px rgba(255,255,255,.28),0 0 48px -6px rgba(159,211,226,.5),0 0 120px -20px rgba(127,201,222,.4)}
  50%{box-shadow:0 0 0 1px rgba(255,255,255,.4),0 0 74px 0 rgba(207,239,246,.62),0 0 160px -12px rgba(127,201,222,.55)}}
#cd-app .bigbtn img, #cd-app .bigbtn #cdEmblem{width:86%;height:86%;object-fit:contain;pointer-events:none;display:flex;align-items:center;justify-content:center}
#cd-app .bigbtn #cdVault{position:absolute;inset:-30px;pointer-events:none;opacity:.7;transition:opacity .3s ease}
#cd-app .bigbtn #cdVault svg{width:100%;height:100%;overflow:visible;filter:none}
#cd-app .cd-vault path{fill:rgba(184,226,238,.28);stroke:rgba(224,246,251,.4);stroke-width:1.6;stroke-linejoin:round;
  transform-box:fill-box;transform-origin:50% 50%;transition:transform .12s linear,fill .25s ease}
#cd-app .cd-g1{transform:rotate(calc(var(--p,0)*72deg))}
#cd-app .cd-g2{transform:rotate(calc(var(--p,0)*-92deg))}
#cd-app .cd-g-arc{fill:none;stroke:#EAFBFF;stroke-width:2.1;stroke-linecap:round;
  stroke-dasharray:364.42;stroke-dashoffset:calc(364.42 * (1 - var(--p,0)));
  transform:rotate(-90deg);transform-box:fill-box;transform-origin:50% 50%;
  filter:drop-shadow(0 0 5px var(--cyan));opacity:calc(.15 + var(--p,0)*.85)}
#cd-app .bigbtn.holding #cdVault{opacity:1}
#cd-app .bigbtn.holding .cd-vault path{fill:rgba(127,201,222,calc(.38 + var(--p,0)*.42));
  filter:drop-shadow(0 0 calc(var(--p,0)*6px) var(--cyan))}
#cd-app .bigbtn.unlocked #cdVault{animation:cdVaultOpen 1s cubic-bezier(.3,.7,.15,1) forwards}
@keyframes cdVaultOpen{
  0%{transform:rotate(0) scale(1);opacity:1}
  16%{transform:rotate(26deg) scale(.96)}
  32%{transform:rotate(-7deg) scale(1.04)}
  100%{transform:rotate(64deg) scale(1.75);opacity:0}}
#cd-app .bigbtn.holding{animation:none;box-shadow:0 0 70px -4px rgba(207,239,246,.55)}
#cd-app .bigbtn.unlocked{animation:none;transform:scale(1.06);box-shadow:0 0 90px 0 rgba(207,239,246,.7);transition:transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease}
#cd-app .bigbtn svg{width:86%;height:86%;overflow:visible;
  filter:drop-shadow(0 0 calc(4px + var(--p,0)*16px) rgba(127,201,222,calc(.18 + var(--p,0)*.7)))
         drop-shadow(0 0 calc(var(--p,0)*34px) rgba(207,239,246,calc(var(--p,0)*.55)));
  transition:filter .12s linear}
#cd-app .bigbtn .cdContour{transition:stroke .3s ease,stroke-width .3s ease}
#cd-app .bigbtn.holding .cdContour{stroke:#E4FBFF!important;stroke-width:9!important}
#cd-app .bigbtn.holding .cdArc{stroke-width:11!important}
#cd-app #cdDrone{transform-box:fill-box;transform-origin:50% 45%}
#cd-app .bigbtn.unlocked #cdDrone{animation:cdFly 1.15s cubic-bezier(.34,.62,.28,1) forwards}
@keyframes cdFly{
  0%{transform:translate(0,0) rotate(0) scale(1);opacity:1}
  14%{transform:translate(0,12px) rotate(0) scale(.95);opacity:1}
  46%{transform:translate(5px,-150px) rotate(-4deg) scale(1.1);opacity:1}
  100%{transform:translate(-6px,-440px) rotate(3deg) scale(.48);opacity:0}}
#cd-app .bigbtn .ring, #cd-app .bigbtn .wind, #cd-app .bigbtn #cdEmblem, #cd-app .bigbtn svg{pointer-events:none}
#cd-app .bigbtn .wind{position:absolute;left:50%;top:38%;height:2px;width:44px;border-radius:2px;opacity:0;
  background:linear-gradient(90deg,transparent,rgba(207,239,246,.95),transparent)}
#cd-app .bigbtn .wind:nth-child(2){top:30%;width:34px}
#cd-app .bigbtn .wind:nth-child(3){top:46%;width:52px}
#cd-app .bigbtn .wind:nth-child(4){top:24%;width:26px}
#cd-app .bigbtn .wind:nth-child(5){top:52%;width:38px}
#cd-app .bigbtn.unlocked .wind{animation:windSweep .68s ease-out forwards}
#cd-app .bigbtn.unlocked .wind:nth-child(2){animation-delay:.05s}
#cd-app .bigbtn.unlocked .wind:nth-child(3){animation-delay:.09s}
#cd-app .bigbtn.unlocked .wind:nth-child(4){animation-delay:.02s}
#cd-app .bigbtn.unlocked .wind:nth-child(5){animation-delay:.12s}
@keyframes windSweep{
  0%{opacity:0;transform:translate(-40px,0) scaleX(.25)}
  25%{opacity:.9}
  100%{opacity:0;transform:translate(120px,-70px) scaleX(1.6)}}
#cd-app .lock h1{font-family:'CDMichroma',sans-serif;font-weight:700;font-size:31px;line-height:1.08;letter-spacing:.2em;
  margin:16px 0 0;text-align:center;color:#F4FAFD;-webkit-text-stroke:.9px #F4FAFD;
  text-shadow:0 0 20px rgba(127,201,222,.6),0 1px 3px rgba(0,0,0,.45)}
#cd-app .lock .hint{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--cyan);text-align:center}
#cd-app .lock .swipe{display:flex;flex-direction:column;align-items:center;gap:3px;color:var(--muted);margin-top:6px}
#cd-app .lock .swipe svg{width:16px;height:16px;animation:bob 1.7s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(3px)}50%{transform:translateY(-3px)}}
#cd-app .home{position:absolute;inset:0;z-index:10;overflow-y:auto}
#cd-app .home::-webkit-scrollbar{display:none}
#cd-app .hometop{position:absolute;top:0;left:0;right:0;z-index:14;display:flex;align-items:center;
  justify-content:space-between;padding:14px 16px 12px;
  background:linear-gradient(180deg,var(--navy) 40%,rgba(0,0,0,0))}
#cd-app .brand{font-family:'CDMichroma',sans-serif;font-size:12px;letter-spacing:.04em}
#cd-app .brand b{color:var(--amber);font-weight:400}
#cd-app .hero{position:relative;height:100%;min-height:560px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
#cd-app .hero-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#06171f;filter:brightness(1.1) saturate(1.06)}
#cd-app .hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,23,32,.35) 0%,rgba(9,23,32,.05) 40%,var(--navy) 99%)}
#cd-app .hero-copy{position:relative;z-index:3;padding:0 26px 30px}
#cd-app .hero-copy .kick{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin:0 0 12px;
  opacity:0;transform:translateY(10px);transition:.6s}
#cd-app .hero-copy h2{font-family:'CDMichroma',sans-serif;font-size:clamp(19px,6vw,25px);line-height:1.24;margin:0 0 14px;color:#fff}
#cd-app .hero-copy h2 span{display:inline-block;opacity:0;transform:translateY(14px);transition:transform .6s cubic-bezier(.22,1,.36,1),opacity .6s}
#cd-app .hero-copy p{font-size:13px;line-height:1.55;color:rgba(255,255,255,.82);margin:0 0 20px;max-width:34ch;
  opacity:0;transform:translateY(10px);transition:.6s .3s}
#cd-app .hero.play .kick, #cd-app .hero.play p{opacity:1;transform:none}
#cd-app .scrollcue{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:rgba(255,255,255,.75);opacity:0;transition:opacity .6s .6s}
#cd-app .hero.play .scrollcue{opacity:1}
#cd-app .scrollcue svg{width:13px;height:13px;animation:bob 1.7s ease-in-out infinite}
#cd-app .univers{padding:14px 22px 46px;position:relative}
#cd-app .univers .lead{font-family:'CDMichroma',sans-serif;font-size:11px;letter-spacing:.12em;color:var(--muted);
  text-transform:uppercase;margin:0 0 6px;text-align:center}
#cd-app .carousel{position:relative;height:250px;margin:0 auto;perspective:1100px;
  display:flex;align-items:center;justify-content:center;touch-action:none}
#cd-app .spin{position:relative;width:190px;height:190px;transform-style:preserve-3d}
#cd-app .bubble{position:absolute;top:0;left:0;width:190px;height:190px;border-radius:50%;overflow:hidden;
  cursor:pointer;border:1px solid var(--line);box-shadow:0 26px 60px -20px rgba(0,0,0,.7);
  backface-visibility:hidden;
  transition:transform .6s cubic-bezier(.3,1,.3,1),opacity .45s ease,filter .45s ease}
#cd-app .bubble[data-slot="c"]{transform:translateX(0) translateZ(40px) rotateY(0deg) scale(1);opacity:1;z-index:3;filter:none}
#cd-app .bubble[data-slot="r"]{transform:translateX(118px) translateZ(-30px) rotateY(-46deg) scale(.64);opacity:.4;z-index:2;filter:brightness(.62) blur(.5px)}
#cd-app .bubble[data-slot="l"]{transform:translateX(-118px) translateZ(-30px) rotateY(46deg) scale(.64);opacity:.4;z-index:2;filter:brightness(.62) blur(.5px)}
#cd-app .bubble .flt{position:absolute;inset:-16px;animation:float 6s ease-in-out infinite}
#cd-app .bubble[data-slot="c"] .flt{animation-play-state:running}
#cd-app .bubble:not([data-slot="c"]) .flt{animation-play-state:paused}
@keyframes float{0%,100%{transform:translateY(0) rotate(-1.2deg)}50%{transform:translateY(-12px) rotate(1.2deg)}}
#cd-app .bubble img{width:100%;height:100%;object-fit:cover}
#cd-app .bubble .cap{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,rgba(9,23,32,0) 55%,rgba(9,23,32,.55))}
#cd-app .bubble[data-slot="c"] .cap{background:radial-gradient(circle at 50% 42%,rgba(9,23,32,0) 62%,rgba(9,23,32,.32))}
#cd-app .bubble .cap .n{display:none}
#cd-app .uinfo{text-align:center;margin-top:2px;min-height:74px}
#cd-app .uinfo .t{font-family:'CDMichroma',sans-serif;font-size:14px;color:var(--cream);margin:0 0 5px}
#cd-app .uinfo .s{font-size:11px;color:var(--muted);margin:0 0 10px}
#cd-app .uinfo .open{all:unset;cursor:pointer;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);
  background:var(--amber);padding:9px 16px;border-radius:20px}
#cd-app .uinfo .open:active{transform:scale(.95)}
#cd-app .udots{display:flex;gap:7px;justify-content:center;margin-top:16px}
#cd-app .udots i{width:6px;height:6px;border-radius:50%;background:var(--line);transition:all .3s}
#cd-app .udots i.on{background:var(--amber);width:18px;border-radius:4px}
#cd-app .uarrow{position:absolute;top:50%;transform:translateY(-50%);z-index:6;all:unset;cursor:pointer;
  width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:rgba(9,23,32,.4);
  display:flex;align-items:center;justify-content:center;color:var(--cream)}
#cd-app .uarrow.l{left:-4px}
#cd-app .uarrow.r{right:-4px}
#cd-app .uarrow:active{transform:translateY(-50%) scale(.9)}
#cd-app .view{position:absolute;inset:0;z-index:30;background:var(--navy);overflow-y:auto;visibility:hidden;
  transform:translateY(6%);opacity:0;transition:transform .5s cubic-bezier(.22,1,.36,1),opacity .4s ease}
#cd-app .view.on{visibility:visible;transform:none;opacity:1}
#cd-app .view::-webkit-scrollbar{display:none}
#cd-app .vtop{position:absolute;top:0;left:0;right:0;z-index:20;display:flex;align-items:center;gap:10px;
  padding:14px 14px 12px;background:linear-gradient(180deg,var(--navy) 45%,rgba(0,0,0,0))}
#cd-app .vtop .vbrand{all:unset;cursor:pointer;font-family:'CDMichroma',sans-serif;font-size:12px;letter-spacing:.06em;
  color:var(--cream);white-space:nowrap}
#cd-app .vtop .vbrand b{color:var(--amber);font-weight:400}
#cd-app .vtop .vbrand:active{opacity:.6}
#cd-app .vprog{position:absolute;top:0;left:0;right:0;height:2px;background:var(--line);z-index:22}
#cd-app .vprog>i{display:block;height:100%;width:0;background:var(--amber);transition:width .1s linear}
#cd-app .vhero{position:relative;height:100%;min-height:520px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
#cd-app .vhero-frame{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(1.08) saturate(1.05)}
#cd-app .vhero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(9,23,32,.4),rgba(9,23,32,.05) 40%,var(--navy) 99%)}
#cd-app .vhero-copy{position:relative;z-index:3;padding:0 26px 28px}
#cd-app .vhero-copy .eyebrow{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin:0 0 8px}
#cd-app .vhero-copy h1{font-family:'CDMichroma',sans-serif;font-size:clamp(18px,5.6vw,23px);line-height:1.22;margin:0 0 12px;color:#fff}
#cd-app .vhero-copy p{font-size:12.5px;line-height:1.55;color:rgba(255,255,255,.82);margin:0 0 18px;max-width:38ch}
#cd-app .doc{padding:0 0 40px}
#cd-app .doc.pad{padding-top:64px}
#cd-app .doc .eyebrow{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--amber);margin:0 26px 8px;
  display:flex;align-items:center;gap:10px}
#cd-app .doc .eyebrow::after{content:"";flex:1;height:1px;background:var(--line)}
#cd-app .doc h1.t{font-family:'CDMichroma',sans-serif;font-size:clamp(19px,5.6vw,23px);line-height:1.24;margin:0 26px 14px;color:var(--cream)}
#cd-app .doc-media{position:relative;height:190px;overflow:hidden;margin:0 0 16px}
#cd-app .doc-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.1);opacity:0;
  transition:transform 1.1s cubic-bezier(.16,1,.3,1),opacity .8s ease}
#cd-app .doc-media.in img{transform:scale(1);opacity:1}
#cd-app .doc .cap{font-size:11px;color:var(--muted);font-style:italic;border-left:2px solid var(--line);padding-left:10px;margin:8px 26px 0}
#cd-app .doc .lede{font-size:14px;line-height:1.55;color:var(--cream);margin:14px 26px 12px}
#cd-app .doc .body{font-size:13px;line-height:1.62;color:var(--muted);margin:0 26px 12px;max-width:46ch}
#cd-app .doc .lsec{font-family:'CDMichroma',sans-serif;font-size:12px;letter-spacing:.02em;color:var(--cream);
  margin:22px 26px 8px;line-height:1.35}
#cd-app .doc .entry{margin:20px 26px;padding-top:16px;border-top:1px solid var(--line);display:flex;gap:12px}
#cd-app .doc .entry .num{font-family:'CDMichroma',sans-serif;font-size:10px;color:var(--amber);flex:0 0 auto;padding-top:3px}
#cd-app .doc .entry .thumb{flex:0 0 62px;height:62px;overflow:hidden;border:1px solid var(--line)}
#cd-app .doc .entry .thumb img{width:100%;height:100%;object-fit:cover}
#cd-app .doc .entry h3{margin:0 0 5px;font-size:13.5px;font-weight:700;color:var(--cream)}
#cd-app .doc .entry p{margin:0 0 5px;font-size:12px;line-height:1.5;color:var(--muted)}
#cd-app .doc .entry .liv{font-size:10px;color:var(--cyan);letter-spacing:.02em}
#cd-app .reveal{opacity:0;transform:translateY(15px);transition:opacity .55s ease,transform .55s cubic-bezier(.22,1,.36,1)}
#cd-app .reveal.in{opacity:1;transform:none}
#cd-app .doc .presrow, #cd-app .presrow{display:flex;gap:12px;align-items:center;padding:14px 0;border-top:1px solid var(--line);
  cursor:pointer;margin:0 26px}
#cd-app .doc>.presrow:first-of-type{border-top:none}
#cd-app .presrow .thumb{flex:0 0 60px;height:60px;border-radius:12px;overflow:hidden}
#cd-app .presrow .thumb img{width:100%;height:100%;object-fit:cover}
#cd-app .presrow h3{margin:0 0 3px;font-size:13.5px;font-weight:700;color:var(--cream)}
#cd-app .presrow p{margin:0;font-size:11.5px;color:var(--muted);line-height:1.4}
#cd-app .presrow .go{margin-left:auto;color:var(--amber);font-size:17px}
#cd-app .foot{margin:26px 26px 30px;padding-top:16px;border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:9px 16px}
#cd-app .foot a{font-size:10.5px;letter-spacing:.04em;color:var(--muted);cursor:pointer;text-decoration:none}
#cd-app .foot a:active{color:var(--amber)}
#cd-app .cta-strip{margin:24px 26px 6px;padding:20px;border:1px solid var(--amber);position:relative}
#cd-app .cta-strip h3{font-family:'CDMichroma',sans-serif;font-size:15px;margin:0 0 8px;color:var(--cream)}
#cd-app .cta-strip p{font-size:12px;color:var(--muted);margin:0 0 14px;line-height:1.5}
#cd-app .send{all:unset;cursor:pointer;background:var(--amber);color:var(--navy);font-family:'CDMichroma',sans-serif;
  font-size:11px;letter-spacing:.03em;padding:12px 17px;display:inline-flex;align-items:center;gap:8px}
#cd-app .send:active{transform:scale(.96)}
#cd-app .contact-lines{margin:16px 26px 0;font-size:12.5px;color:var(--cream);line-height:1.9}
#cd-app .contact-lines b{color:var(--amber);font-weight:400}
#cd-app .wz{margin:6px 26px 10px}
#cd-app .wz .prog{font-family:'CDMichroma',sans-serif;font-size:9px;letter-spacing:.13em;color:var(--muted);text-transform:uppercase;margin:0 0 6px}
#cd-app .wz .bar{height:2px;background:var(--line);border-radius:2px;margin:0 0 20px;overflow:hidden}
#cd-app .wz .bar>i{display:block;height:100%;background:var(--amber);transition:width .4s ease}
#cd-app .wz h2.q{font-family:'CDMichroma',sans-serif;font-size:15px;line-height:1.32;color:var(--cream);margin:0 0 6px}
#cd-app .wz .qsub{font-size:11px;color:var(--muted);margin:0 0 15px}
#cd-app .wz .choice{display:flex;align-items:center;gap:11px;padding:12px 13px;border:1px solid var(--line);border-radius:12px;
  margin-bottom:8px;cursor:pointer;font-size:12.5px;color:var(--cream);transition:border-color .2s,background .2s}
#cd-app .wz .choice.sel{border-color:var(--amber);background:var(--amber-dim)}
#cd-app .wz .choice .box{width:17px;height:17px;border:1.5px solid var(--muted);border-radius:50%;flex:0 0 auto;position:relative}
#cd-app .wz .choice.multi .box{border-radius:5px}
#cd-app .wz .choice.sel .box{border-color:var(--amber);background:var(--amber)}
#cd-app .wz .choice.sel .box::after{content:"";position:absolute;inset:4px;background:var(--navy);border-radius:inherit}
#cd-app .wz input.txt, #cd-app .wz textarea.txt, #cd-app .wz select.txt{width:100%;background:var(--panel);border:1px solid var(--line);
  border-radius:10px;padding:11px;color:var(--cream);font-family:inherit;font-size:16px;margin-bottom:10px}
#cd-app .wz textarea.txt{min-height:84px;resize:vertical}
#cd-app .wz label.fld{display:block;font-size:10px;letter-spacing:.05em;color:var(--muted);margin:2px 0 5px;text-transform:uppercase}
#cd-app .wz .nav{display:flex;gap:10px;margin-top:16px}
#cd-app .wz .nav button{all:unset;cursor:pointer;flex:1;text-align:center;font-family:'CDMichroma',sans-serif;font-size:10.5px;
  letter-spacing:.03em;padding:13px;border-radius:12px}
#cd-app .wz .nav .prev{border:1px solid var(--line);color:var(--muted)}
#cd-app .wz .nav .next{background:var(--amber);color:var(--navy)}
#cd-app .wz .nav .next[disabled]{opacity:.4;pointer-events:none}
#cd-app .wz .hp{position:absolute!important;left:-9999px}
#cd-app .wz .done{text-align:center;padding:36px 10px}
#cd-app .wz .done .ic{width:52px;height:52px;border-radius:50%;border:2px solid var(--amber);color:var(--amber);
  display:flex;align-items:center;justify-content:center;margin:0 auto 15px;font-size:22px}
#cd-app .wz .done h2{font-family:'CDMichroma',sans-serif;font-size:15px;color:var(--cream);margin:0 0 8px}
#cd-app .wz .done p{font-size:12px;color:var(--muted);line-height:1.6;max-width:34ch;margin:0 auto}
#cd-app .menu{position:absolute;inset:0;z-index:70;background:rgba(9,23,32,.9);backdrop-filter:blur(12px);
  visibility:hidden;opacity:0;transition:opacity .3s ease;display:flex;flex-direction:column;padding:56px 28px 24px;overflow-y:auto}
#cd-app .menu.on{visibility:visible;opacity:1}
#cd-app .menu::-webkit-scrollbar{display:none}
#cd-app .menu button.x{align-self:flex-end;margin-bottom:12px}
#cd-app .menu .grp{font-family:'CDMichroma',sans-serif;font-size:8.5px;letter-spacing:.14em;color:var(--muted);
  text-transform:uppercase;margin:16px 0 2px}
#cd-app .menu a{font-family:'CDMichroma',sans-serif;font-size:13.5px;color:#fff;padding:13px 0;border-bottom:1px solid var(--line);
  text-decoration:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
#cd-app .menu .lang{display:flex;gap:8px;margin-top:18px}
#cd-app .menu .lang button{all:unset;cursor:pointer;font-family:'CDMichroma',sans-serif;font-size:10px;letter-spacing:.08em;
  padding:8px 14px;border:1px solid var(--line);border-radius:20px;color:var(--muted)}
#cd-app .menu .lang button.on{background:var(--amber);color:var(--navy);border-color:var(--amber)}
#cd-app .menu a span{color:var(--amber);font-size:13px}
#cd-app .toast{position:absolute;left:16px;right:16px;bottom:16px;background:var(--amber);color:var(--navy);
  font-size:12px;font-weight:500;padding:12px 14px;border-radius:10px;transform:translateY(160%);
  transition:transform .5s cubic-bezier(.22,1,.36,1);z-index:95;text-align:center}
#cd-app .toast.show{transform:none}
#cd-app .cd3dembed{position:relative;width:100%;height:56vh;min-height:330px;margin:22px 0 6px;
  border:1px solid var(--line);border-radius:18px;overflow:hidden;
  background:radial-gradient(ellipse at 50% 38%,#123143,#08161f 76%)}
#cd-app .cd3dembed-stage{position:absolute;inset:0}
#cd-app .cd3dembed-stage three-d-stage{position:absolute;inset:0;display:block;width:100%;height:100%;background:transparent}
#cd-app .cd3dembed-gate{all:unset;position:absolute;inset:0;z-index:3;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:8px;text-align:center;padding:0 30px;cursor:pointer;color:var(--cream)}
#cd-app .cd3dembed-gate svg{width:34px;height:34px;color:var(--cyan);animation:m3dspin 16s linear infinite}
@keyframes m3dspin{to{transform:rotate(360deg)}}
#cd-app .cd3dembed-gate span{font-family:'CDMichroma',sans-serif;font-size:12px;letter-spacing:.06em}
#cd-app .cd3dembed-gate em{font-style:normal;font-size:11px;color:var(--muted)}
#cd-app .cd3dembed-load{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:4;
  font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan)}
#cd-app .cd3dembed-bar{position:absolute;left:0;right:0;bottom:0;z-index:4;display:flex;align-items:center;gap:8px;
  padding:10px 12px;background:linear-gradient(to top,rgba(6,20,28,.92),transparent)}
#cd-app .cd3dembed-pick{display:flex;gap:8px;flex:1}
#cd-app .cd3dembed-pick button{all:unset;cursor:pointer;padding:8px 14px;border-radius:999px;border:1px solid var(--line);
  background:rgba(9,23,32,.5);color:var(--muted);font-size:10px;letter-spacing:.12em;text-transform:uppercase}
#cd-app .cd3dembed-pick button.on{background:var(--amber);color:#04222E;border-color:transparent}
#cd-app .cd3dembed-full{all:unset;cursor:pointer;width:34px;height:34px;border-radius:9px;border:1px solid var(--line);
  background:rgba(9,23,32,.5);color:var(--cream);display:flex;align-items:center;justify-content:center}
#cd-app .cd3dembed-full svg{width:16px;height:16px}
#cd-app .cd3d{position:absolute;inset:0;z-index:82;
  background:radial-gradient(ellipse at 50% 38%,#0C2637,#050F17 68%,#02080D)}
#cd-app .cd3d-stagewrap{position:absolute;inset:0}
#cd-app .cd3d::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;z-index:4;pointer-events:none;
  background:linear-gradient(to top,#050F17 8%,rgba(5,15,23,.55) 55%,transparent)}
#cd-app .cd3d-stagewrap three-d-stage{position:absolute;inset:0;display:block;width:100%;height:100%;background:transparent}
#cd-app .cd3d-close{all:unset;position:absolute;top:14px;right:14px;z-index:6;width:40px;height:40px;border-radius:50%;
  border:1px solid var(--line);background:rgba(9,23,32,.6);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  color:var(--cream);display:flex;align-items:center;justify-content:center;cursor:pointer}
#cd-app .cd3d-load{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;
  font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);text-align:center}
#cd-app .cd3d-pick{position:absolute;left:0;right:0;bottom:50px;z-index:6;display:flex;gap:10px;justify-content:center}
#cd-app .cd3d-pick button{all:unset;cursor:pointer;padding:9px 22px;border-radius:999px;border:1px solid var(--line);
  background:rgba(9,23,32,.55);color:var(--muted);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase}
#cd-app .cd3d-pick button.on{background:var(--amber);color:#04222E;border-color:transparent}
#cd-app .cd3d-hint{position:absolute;left:0;right:0;bottom:20px;z-index:6;text-align:center;
  font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
@media (prefers-reduced-motion:reduce){
  #cd-app *{transition:none!important;animation:none!important}
}
@media (min-width:721px){#cd-app{display:none!important}}
html.cd-locked,body.cd-locked{overflow:hidden!important}
#cd-app [hidden]{display:none!important}
