/* MICE CARD 뷰어 — 판 3. 테마 색은 페이지마다 <style> 의 --d-*·--l-*·--a-*·--s-* 로 들어온다(src/lib/render.ts themeCss).
   스크립트가 없어도 카드는 옆으로 밀어서 볼 수 있다(기본 data-mode="swipe" + scroll-snap). */
*,*::before,*::after{box-sizing:border-box}
html{height:100%;-webkit-text-size-adjust:100%}
body{margin:0;height:100%;overflow:hidden;background:#0b0f14;color:#fff;font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;font-size:15px;line-height:1.55;word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}
[hidden]{display:none!important}
img{max-width:100%}
button{font:inherit;color:inherit;cursor:pointer}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
:focus-visible{outline:3px solid #ffd27a;outline-offset:2px}
.ic{width:20px;height:20px;flex:none}

/* 무대 — 휴대폰은 화면 가득, PC 는 가운데 휴대폰 틀 */
.stage{height:100%;display:grid;place-items:center}
.device{--top:74px;--bottom:58px;position:relative;width:100%;height:100%;overflow:hidden;background:var(--d-bg);isolation:isolate}
html[data-demo="1"] .device{--bottom:104px}
@media (min-width:640px) and (min-height:600px){
  body{background:radial-gradient(60rem 40rem at 50% -10%,rgba(255,255,255,.07),transparent 70%),#0b0f14}
  .stage{padding:24px}
  .device{width:min(430px,100%);height:min(900px,100%);border-radius:30px;box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 90px -30px rgba(0,0,0,.8)}
}

/* 넘김 */
.track{position:absolute;inset:0;outline:none}
html[data-mode="swipe"] .track{display:flex;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;scrollbar-width:none}
html[data-mode="swipe"] .track::-webkit-scrollbar{display:none}
html[data-mode="swipe"] .card{flex:0 0 100%;scroll-snap-align:start;scroll-snap-stop:always}
.track.dragging{scroll-snap-type:none!important;cursor:grabbing;user-select:none;-webkit-user-select:none}
html[data-mode="story"] .track{overflow:hidden;touch-action:pan-y;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
html[data-mode="story"] .card{position:absolute;inset:0;opacity:0;visibility:hidden;transition:opacity .3s ease,visibility 0s linear .3s}
html[data-mode="story"] .card.cur{opacity:1;visibility:visible;transition:opacity .3s ease}
.track.nudge>.card{animation:nudge 1.25s cubic-bezier(.3,.7,.3,1) .7s 2}
@keyframes nudge{0%,100%{transform:none}38%{transform:translateX(-42px)}62%{transform:translateX(-34px)}}

/* 카드 공통 */
.card{position:relative;width:100%;height:100%;overflow:hidden;background:var(--bg);color:var(--ink);container-type:size}
.card[data-tone="dark"]{--bg:var(--d-bg);--ink:var(--d-ink);--sub:var(--d-sub);--line:var(--d-line);--btn:var(--d-btn);--btn-ink:var(--d-btn-ink);--hi:var(--d-hi);--panel:var(--d-panel)}
.card[data-tone="light"]{--bg:var(--l-bg);--ink:var(--l-ink);--sub:var(--l-sub);--line:var(--l-line);--btn:var(--l-btn);--btn-ink:var(--l-btn-ink);--hi:var(--l-hi);--panel:var(--l-panel)}
.card[data-tone="accent"]{--bg:var(--a-bg);--ink:var(--a-ink);--sub:var(--a-sub);--line:var(--a-line);--btn:var(--a-btn);--btn-ink:var(--a-btn-ink);--hi:var(--a-hi);--panel:var(--a-panel)}
.card[data-tone="soft"]{--bg:var(--s-bg);--ink:var(--s-ink);--sub:var(--s-sub);--line:var(--s-line);--btn:var(--s-btn);--btn-ink:var(--s-btn-ink);--hi:var(--s-hi);--panel:var(--s-panel)}
.card .in{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;gap:14px;overflow-x:hidden;overflow-y:auto;scrollbar-width:none;padding-top:calc(var(--top) + env(safe-area-inset-top,0px));padding-bottom:calc(var(--bottom) + env(safe-area-inset-bottom,0px));padding-left:max(24px,env(safe-area-inset-left,0px));padding-right:max(24px,env(safe-area-inset-right,0px))}
.card .in::-webkit-scrollbar{display:none}
.eb{font-size:12.5px;font-weight:700;letter-spacing:.08em;color:var(--hi)}
.display{font-family:var(--f-display);font-weight:var(--w-display);letter-spacing:var(--tr-display);font-size:clamp(32px,min(11.4cqw,7.4cqh),56px);line-height:1.08;text-wrap:balance}
.h2{font-family:var(--f-display);font-weight:var(--w-display);letter-spacing:var(--tr-display);font-size:clamp(26px,min(8.6cqw,5.8cqh),42px);line-height:1.15;text-wrap:balance}
.lead,.body{font-size:clamp(14.5px,4.2cqw,17px);line-height:1.62;color:var(--sub)}
.body{color:var(--ink);opacity:.92}
.small{font-size:12.5px;color:var(--sub)}
.pic{display:block;width:100%;max-height:34cqh;object-fit:cover;border-radius:16px}
.org{margin-top:auto;padding-top:14px;font-size:11.5px;line-height:1.55;color:var(--sub);text-align:center}
.org a{font-weight:700;text-decoration:none}

/* 단추 */
.btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:2px}
.btns.two{display:grid;grid-template-columns:1fr 1fr}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 18px;border:0;border-radius:14px;font-weight:700;font-size:15.5px;text-decoration:none;text-align:center;line-height:1.25;transition:transform .12s,filter .15s}
.btn:active{transform:scale(.98)}
.btn:hover{filter:brightness(1.06)}
.btn.block{display:flex;width:100%}
.btn.big{min-height:54px;font-size:16.5px}
.btn-main{background:var(--btn);color:var(--btn-ink)}
.btn-line{background:transparent;color:inherit;box-shadow:inset 0 0 0 1.5px currentColor}
.btns .btn{flex:1 1 auto}

/* 1 표지 */
.t-cover .in{justify-content:flex-start;gap:14px}
.cover-in{display:flex;flex-direction:column;gap:14px}
.t-cover .eb{color:var(--hi)}
.t-cover .lead{max-width:34ch}
.meta{display:grid;gap:6px;margin-top:2px;font-size:14px}
.meta div{display:flex;gap:12px}
.meta dt{flex:none;min-width:30px;color:var(--hi);font-weight:700}
.meta dd{font-weight:500}
.art{position:absolute;left:0;right:0;bottom:0;width:100%;height:56%;pointer-events:none;z-index:0}
/* 화면을 다 채우는 사진(표지 배경·사진 카드) — 휴대폰마다 화면 비율이 달라 맞춤을 고른다. auto 는 card-5.js 가 이 화면에서 fit-blur 를 붙이거나 뗀다 */.ph{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;background:var(--bg)}.ph img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.ph .blurbg{display:none;-webkit-filter:blur(22px) brightness(.72) saturate(1.1);filter:blur(22px) brightness(.72) saturate(1.1);-webkit-transform:scale(1.15);transform:scale(1.15)}.ph.fit-blur .blurbg{display:block}.ph.fit-blur .main,.ph.fit-contain .main{object-fit:contain}
.dim{position:absolute;inset:0;background:linear-gradient(180deg,#000 0%,rgba(0,0,0,.55) 45%,rgba(0,0,0,.85) 100%);z-index:0}
.on-photo{color:#fff;--ink:#fff;--sub:rgba(255,255,255,.82);--line:rgba(255,255,255,.22)}
.hint{position:absolute;left:0;right:0;bottom:calc(var(--bottom) + 10px + env(safe-area-inset-bottom,0px));z-index:2;display:flex;justify-content:center;pointer-events:none}
.hint span{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;background:rgba(8,14,20,.55);color:#fff;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);font-size:13px;font-weight:600}
.hint .ic{width:16px;height:16px}
html[data-mode="swipe"] .hint-story,html[data-mode="story"] .hint-swipe{display:none}

/* 2 숫자 */
.stats{margin-top:auto;display:grid;grid-template-columns:1fr 1fr}
.stats.n1{grid-template-columns:1fr}
.stats li{display:flex;flex-direction:column;gap:4px;padding:14px 0 16px;border-top:2px solid currentColor}
.stats li:nth-child(odd){padding-right:12px}
.stats b{font-family:var(--f-display);font-weight:var(--w-display);letter-spacing:var(--tr-display);font-size:clamp(42px,min(15cqw,9.5cqh),72px);line-height:1}
.stats b small{margin-left:2px;font-size:.42em}
.stats span{font-size:14px;font-weight:600;line-height:1.4}
.stats em{display:block;font-style:normal;font-weight:400;font-size:12.5px;opacity:.75}

/* 3 목록 */
.features{margin-top:auto;display:flex;flex-direction:column;gap:10px}
.features li{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;padding:14px;border-radius:18px;background:var(--panel)}
.ficon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:var(--btn);color:var(--btn-ink)}
.features h3{font-size:16px;font-weight:700;line-height:1.35}
.features p{margin-top:2px;font-size:13.5px;line-height:1.5;color:var(--sub)}

/* 4 일정 */
.days{margin-top:auto;display:flex;flex-direction:column}
.day{display:grid;grid-template-columns:74px 1fr;gap:12px;padding:13px 0;border-top:1px solid var(--line)}
.day:last-child{border-bottom:1px solid var(--line)}
.day h3{display:flex;flex-direction:column;font-size:13px;font-weight:600;color:var(--sub)}
.day h3 b{font-family:var(--f-display);font-weight:var(--w-display);font-size:22px;line-height:1.15;color:var(--hi)}
.day ul{display:flex;flex-direction:column;gap:6px}
.day li{display:grid;grid-template-columns:50px 1fr;gap:8px;font-size:14.5px;line-height:1.45}
.day time{font-variant-numeric:tabular-nums;font-weight:700;color:var(--sub)}

/* 5 혜택·티켓 */
.ticket{margin-top:auto;display:grid;grid-template-columns:46px 1fr;border-radius:16px;background:var(--panel);color:var(--ink);
  -webkit-mask:radial-gradient(circle 9px at 46px 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(circle 9px at 46px 100%,#0000 97%,#000) bottom/100% 51% no-repeat;
  mask:radial-gradient(circle 9px at 46px 0,#0000 97%,#000) top/100% 51% no-repeat,radial-gradient(circle 9px at 46px 100%,#0000 97%,#000) bottom/100% 51% no-repeat}
.stub{display:grid;place-items:center;border-right:2px dashed var(--line);writing-mode:vertical-rl;font-family:var(--f-display);font-weight:var(--w-display);font-size:15px;letter-spacing:.2em;color:var(--hi)}
.perks{display:flex;flex-direction:column;padding:4px 16px}
.perks li{display:flex;flex-direction:column;gap:2px;padding:12px 0;border-top:1px solid var(--line)}
.perks li:first-child{border-top:0}
.perks b{font-size:17px;font-weight:700}
.perks span{font-size:13.5px;color:var(--sub)}

/* 6 오시는 길 */
.addr{display:flex;gap:8px;align-items:flex-start;font-size:15px;font-weight:600}
.addr .ic{margin-top:2px;color:var(--hi)}
.ways{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.ways div{display:grid;grid-template-columns:56px 1fr;gap:10px;font-size:14.5px;line-height:1.45}
.ways dt{font-weight:700;color:var(--sub)}

/* 7 사진 */
.t-photo .in{padding:0}


.full{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.full.empty{background:linear-gradient(135deg,var(--line),transparent),var(--bg)}
.photo-cap{position:absolute;left:0;right:0;bottom:0;z-index:1;display:grid;gap:8px;padding:80px max(24px,env(safe-area-inset-left,0px)) calc(var(--bottom) + 18px + env(safe-area-inset-bottom,0px));background:linear-gradient(180deg,transparent,rgba(0,0,0,.78));color:#fff}
.photo-cap p{color:rgba(255,255,255,.85);font-size:15px;line-height:1.6}

/* 8 사진 모음 */
.gallery{margin-top:auto;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gallery.n1{grid-template-columns:1fr}
.gallery.n3 li:first-child,.gallery.n5 li:first-child{grid-column:1/-1}
.gallery li{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:1/1;background:var(--line)}
.gallery.n1 li,.gallery.n3 li:first-child,.gallery.n5 li:first-child{aspect-ratio:16/9}
.gallery img{width:100%;height:100%;object-fit:cover;display:block}
.gallery span{position:absolute;left:0;right:0;bottom:0;padding:18px 10px 7px;font-size:12px;font-weight:600;color:#fff;background:linear-gradient(180deg,transparent,rgba(0,0,0,.6))}

/* 9 사람 */
.people{margin-top:auto;display:flex;flex-direction:column;gap:10px}
.people li{display:grid;grid-template-columns:56px 1fr;gap:14px;align-items:center;padding:12px;border-radius:18px;background:var(--panel)}
.people img,.people .ini{width:56px;height:56px;border-radius:50%;object-fit:cover}
.people .ini{display:grid;place-items:center;background:var(--btn);color:var(--btn-ink);font-weight:800;font-size:20px}
.people b{display:block;font-size:16px}
.people span{display:block;font-size:13px;color:var(--sub)}
.people p{margin-top:3px;font-size:13.5px;line-height:1.45}

/* 10 질문 */
.faq{margin-top:auto;display:flex;flex-direction:column;gap:8px}
.faq details{border-radius:14px;background:var(--panel);padding:2px 14px}
.faq summary{list-style:none;cursor:pointer;padding:12px 0;font-weight:700;font-size:15px;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';color:var(--sub);font-weight:400}
.faq details[open] summary::after{content:'–'}
.faq p{padding:0 0 12px;font-size:14px;line-height:1.6;color:var(--sub)}

/* 11 인사말 */
.t-quote .in{justify-content:center}
.quote{font-family:var(--f-display);font-weight:var(--w-display);letter-spacing:var(--tr-display);font-size:clamp(20px,min(6.4cqw,4.2cqh),30px);line-height:1.45;padding-left:16px;border-left:4px solid var(--hi)}
.by{display:flex;align-items:center;gap:12px;margin-top:6px}
.by img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.by b{display:block}
.by em{display:block;font-style:normal;font-size:13px;color:var(--sub)}

/* 12 D-day */
.t-countdown .in{justify-content:center;text-align:center;align-items:center}
.dday{font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(64px,min(26cqw,16cqh),120px);line-height:1;letter-spacing:-.02em;color:var(--ink);font-variant-numeric:tabular-nums}
.dwhen{font-size:16px;font-weight:700;color:var(--sub)}

/* 13 영상 */
.video{position:relative;display:block;border-radius:16px;overflow:hidden;aspect-ratio:16/9;background:#000;text-decoration:none}
.video img{width:100%;height:100%;object-fit:cover;display:block;opacity:.88}
.video.empty{background:var(--line)}
.video .play{position:absolute;left:50%;top:50%;width:64px;height:64px;margin:-32px 0 0 -32px;border-radius:50%;display:grid;place-items:center;background:rgba(0,0,0,.6);color:#fff}
.video .play .ic{width:28px;height:28px;fill:#fff}
.video .vlabel{position:absolute;left:12px;bottom:10px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.6);color:#fff;font-size:12.5px;font-weight:700}

/* 14 쿠폰 */
.coupon{margin-top:auto;display:grid;gap:12px;padding:20px 18px;border-radius:18px;background:var(--panel);border:2px dashed var(--line);text-align:center}
.cben{font-family:var(--f-display);font-weight:var(--w-display);font-size:clamp(24px,8cqw,36px);line-height:1.2}
.ccode{display:grid;gap:8px;justify-items:center}
.ccode span{font-size:12.5px;color:var(--sub)}
.ccode b{font-size:22px;letter-spacing:.14em;font-variant-numeric:tabular-nums}
.cuntil{font-size:13px;color:var(--sub)}
.terms{white-space:normal}

/* 15 마지막 장 */
.t-end .in{gap:12px}
.end-actions{margin-top:auto;display:flex;flex-direction:column;gap:10px}
.quick{display:grid;grid-template-columns:repeat(var(--qn,3),1fr);gap:8px}
.quick.n1{--qn:1}.quick.n2{--qn:2}.quick.n3{--qn:3}.quick.n4{--qn:4}
.quick button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 4px;border:0;border-radius:14px;background:var(--panel);box-shadow:inset 0 0 0 1px var(--line);font-size:13px;font-weight:600}
.quick .ic{width:22px;height:22px}

/* 머리말 */
.vhead{position:absolute;inset:0 0 auto;z-index:5;padding-top:calc(10px + env(safe-area-inset-top,0px));padding-left:max(14px,env(safe-area-inset-left,0px));padding-right:max(14px,env(safe-area-inset-right,0px));color:#fff;pointer-events:none;transition:color .25s,opacity .2s}
.device[data-dark="0"] .vhead,.device[data-dark="0"] .dots{color:#14202a}
.bars{display:flex;gap:4px;margin-bottom:10px}
.bar{flex:1;height:3px;border-radius:3px;overflow:hidden;background:rgba(128,128,128,.32);background:color-mix(in srgb,currentColor 32%,transparent)}
.bar i{display:block;height:100%;background:currentColor;transform:scaleX(0);transform-origin:left center}
.bar.done i{transform:none}
.bar.run i{animation:fill var(--dur,7s) linear forwards}
.device.paused .bar.run i,.device.holding .bar.run i,.device.hidden-tab .bar.run i,.device.sheet-open .bar.run i{animation-play-state:paused}
@keyframes fill{to{transform:none}}
html[data-mode="story"]:not([data-autoplay="1"]) .bar.run i{animation:none;transform:none}
.vrow{display:flex;align-items:center;gap:10px}
.avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none}
.avatar.ini{display:grid;place-items:center;background:var(--d-btn);color:var(--d-btn-ink);font-weight:800;font-size:14px}
.sender{min-width:0;flex:1}
.sender b{display:block;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pill{pointer-events:auto;min-height:34px;padding:0 13px;border:0;border-radius:999px;background:var(--d-btn);color:var(--d-btn-ink);font-size:13px;font-weight:700;display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap}
.device[data-dark="0"] .pill{background:#14202a;color:#fff}
.counter{padding:4px 10px;border-radius:999px;font-size:12.5px;font-weight:700;font-variant-numeric:tabular-nums;background:rgba(128,128,128,.18);background:color-mix(in srgb,currentColor 16%,transparent)}
.iconbtn{pointer-events:auto;width:38px;height:38px;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(128,128,128,.18);background:color-mix(in srgb,currentColor 16%,transparent);color:inherit}
.iconbtn .ic{width:18px;height:18px}
.iconbtn .i-play{display:none;fill:currentColor}
.device.paused .iconbtn .i-play{display:block}
.device.paused .iconbtn .i-pause{display:none}
html[data-mode="swipe"] .bars,html[data-mode="swipe"] .iconbtn{display:none}
html[data-mode="story"] .dots,html[data-mode="story"] .counter{display:none}
html[data-mode="story"]:not([data-autoplay="1"]) .iconbtn{display:none}
.device.holding .vhead,.device.holding .nav,.device.holding .demobar{opacity:0}

.dots{position:absolute;left:0;right:0;bottom:calc(var(--bottom) - 44px + env(safe-area-inset-bottom,0px));z-index:5;display:flex;justify-content:center;color:#fff}
.dot{width:18px;height:24px;padding:0;border:0;background:none;display:grid;place-items:center}
.dot::before{content:'';width:7px;height:7px;border-radius:9px;background:currentColor;opacity:.38;transition:width .25s,opacity .25s}
.dot[aria-current="true"]::before{width:20px;opacity:1}
.nav{display:none}
@media (hover:hover) and (pointer:fine){
  .nav{position:absolute;top:50%;z-index:6;width:42px;height:42px;margin-top:-21px;border:0;border-radius:50%;display:grid;place-items:center;background:rgba(8,14,20,.42);color:#fff;transition:opacity .2s}
  .device[data-dark="0"] .nav{background:rgba(255,255,255,.8);color:#14202a}
  .nav.prev{left:10px}.nav.next{right:10px}
  .nav:disabled{opacity:0;pointer-events:none}
}
/* 시연 막대(소개 화면·템플릿 보기) */
.demobar{position:absolute;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:7;transform:translateX(-50%);display:flex;align-items:center;gap:4px;padding:4px;border-radius:999px;background:rgba(8,13,18,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);color:#fff;white-space:nowrap;box-shadow:0 8px 24px -10px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.08)}
.demobar .lbl{padding:0 6px 0 8px;font-size:11px;font-weight:700;letter-spacing:.06em;opacity:.6}
.demobar button{border:0;background:transparent;padding:7px 12px;border-radius:999px;font-size:13px;font-weight:700;color:rgba(255,255,255,.75)}
.demobar button[aria-pressed="true"]{background:#fff;color:#0e1a26}

/* 아래에서 올라오는 창 */
.sheet{position:absolute;inset:0;z-index:20;display:flex;align-items:flex-end;background:rgba(4,8,12,0);transition:background .22s}
.sheet.open{background:rgba(4,8,12,.58)}
.sheet:not(.open){pointer-events:none}
.sheet-panel{position:relative;width:100%;max-height:90%;overflow-y:auto;overscroll-behavior:contain;background:#f7f8f5;color:#14212b;border-radius:24px 24px 0 0;padding:10px max(20px,env(safe-area-inset-right,0px)) calc(24px + env(safe-area-inset-bottom,0px)) max(20px,env(safe-area-inset-left,0px));transform:translateY(100%);transition:transform .28s cubic-bezier(.2,.8,.2,1);color-scheme:light;--btn:#14212b;--btn-ink:#fff}
.sheet.open .sheet-panel{transform:none}
.grab{width:40px;height:4px;margin:0 auto 12px;border-radius:4px;background:#d2d8dc}
.sheet-x{position:absolute;top:10px;right:10px;width:40px;height:40px;border:0;border-radius:50%;background:transparent;display:grid;place-items:center;color:#5b666e}
.sheet-body{display:flex;flex-direction:column;gap:14px}
.sheet-body form{display:flex;flex-direction:column;gap:14px}
.sheet-title{padding-right:40px;font-size:20px;font-weight:800;letter-spacing:-.02em}
.sheet-note{font-size:13.5px;line-height:1.55;color:#5b666e}
.sheet-note.url{word-break:break-all}
.sheet-note.warn{color:#a15c00;font-weight:600}
.field{display:flex;flex-direction:column;gap:6px;font-size:13.5px;font-weight:700;color:#3b4750}
.field i{font-style:normal;font-weight:500;color:#8b95a1;font-size:12px}
.field i.req{color:#c2410c}
.field input,.field select,.field textarea{width:100%;min-height:50px;padding:0 14px;border:1.5px solid #cdd5da;border-radius:12px;background:#fff;font:inherit;font-size:16px;font-weight:500;color:#14212b}
.field textarea{padding:12px 14px;min-height:76px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:#14212b;box-shadow:0 0 0 3px rgba(20,33,43,.12)}
.seg3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;border:0;margin:0;padding:0}
.seg3 legend{padding:0;margin-bottom:6px;font-size:13.5px;font-weight:700;color:#3b4750}
.seg3 label{position:relative}
.seg3 input{position:absolute;inset:0;opacity:0;margin:0;cursor:pointer}
.seg3 span{display:grid;place-items:center;min-height:46px;border-radius:12px;background:#fff;box-shadow:inset 0 0 0 1.5px #cdd5da;font-weight:700}
.seg3 input:checked+span{background:#14212b;color:#fff;box-shadow:none}
.seg3 input:focus-visible+span{outline:3px solid #14212b;outline-offset:2px}
.check{display:grid;grid-template-columns:22px 1fr;gap:10px;align-items:start;font-size:14px;line-height:1.5}
.check input{width:20px;height:20px;margin:1px 0 0;accent-color:#14212b}
.consent details{margin:6px 0 0 32px;font-size:13px;color:#5b666e}
.consent summary{cursor:pointer;font-weight:700}
.consent p{margin-top:6px;line-height:1.6}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form-error{font-size:13.5px;font-weight:700;color:#b3261e}
.opts{display:flex;flex-direction:column;gap:8px}
.opt{display:flex;align-items:center;justify-content:space-between;min-height:52px;padding:0 16px;border:0;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1.5px #dde3e7;font-weight:700;font-size:15px;color:#14212b;text-decoration:none;text-align:left}
.opt::after{content:'›';font-size:20px;opacity:.4}
.addr-big{font-size:16px;font-weight:800;line-height:1.45}
.addr-big span{display:block;font-size:13.5px;font-weight:500;color:#5b666e}
.big-num{font-size:30px;font-weight:800;letter-spacing:.02em}
.done{display:grid;gap:12px;text-align:center}
.done .qr{display:grid;place-items:center;padding:14px;border-radius:18px;background:#fff;box-shadow:inset 0 0 0 1.5px #dde3e7}
.done .qr img{width:180px;height:180px}
.done .code{font-weight:800;letter-spacing:.16em}

.toast{position:absolute;left:50%;bottom:calc(var(--bottom) + 18px + env(safe-area-inset-bottom,0px));z-index:30;width:max-content;max-width:calc(100% - 40px);padding:11px 16px;border-radius:14px;background:rgba(14,22,30,.95);color:#fff;font-size:13.5px;line-height:1.45;text-align:center;opacity:0;pointer-events:none;transform:translate(-50%,10px);transition:opacity .2s,transform .2s;box-shadow:0 10px 30px -12px rgba(0,0,0,.6)}
.toast.show{opacity:1;transform:translate(-50%,0)}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .bar.run i{transform:none}
}