.kit-stamp{font:800 11px/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;border:2px solid var(--c);color:var(--t);background:color-mix(in srgb, var(--c) 14%, var(--card));border-radius:8px;padding:3px 8px;display:inline-block;transform:rotate(-2deg)}.kit-stamp--late{--c:var(--late-fill);--t:var(--late)}.kit-stamp--warn{--c:var(--warn-fill);--t:var(--warn)}.kit-stamp--ok{--c:var(--ok-fill);--t:var(--ok)}.kit-stamp--lent{--c:var(--lent-fill);--t:var(--lent)}@media (prefers-reduced-motion:no-preference){html.js [data-reveal].in .kit-stamp{animation:kit-thunk .28s var(--ease-out) both;animation-delay:var(--d,0s)}}@keyframes kit-thunk{0%{transform:rotate(0)scale(1.25)}}.kit-code{font:400 11px/1 var(--mono);letter-spacing:.04em;border:2px solid color-mix(in srgb, var(--outline) 40%, transparent);color:var(--ink);border-radius:7px;padding:4px 7px;display:inline-block}.btn.kit-pill--kraft{background:var(--kraft);color:var(--on-kraft)}.kit-stub{border:2px solid var(--outline);background:var(--card);max-width:100%;box-shadow:0 4px 0 var(--shadow);cursor:default;border-radius:14px;align-items:stretch;display:inline-flex}.kit-stub-tag{background:var(--kraft);color:var(--on-kraft);font:400 12px/1.2 var(--mono);letter-spacing:.08em;text-transform:uppercase;border-right:2px dashed var(--outline);border-radius:12px 0 0 12px;place-items:center;padding:0 14px;display:grid}.kit-stub-body{font:800 16px/1.3 var(--display);color:var(--ink);text-align:right;flex:1;padding:12px 16px}.kit-stub-body small{font:500 13px/1.3 var(--body);color:var(--ink-muted);display:block}.kit-phone{width:var(--phone-w,min(330px, 80vw));border:3px solid var(--outline);background:var(--sheet);box-shadow:0 6px 0 var(--shadow);transform:rotate(var(--tilt,-2deg));border-radius:46px;margin-inline:auto;padding:14px 12px;position:relative}.kit-phone-img{outline:2px solid color-mix(in srgb, var(--outline) 40%, transparent);outline-offset:0;border-radius:32px;width:100%;height:auto}@media (prefers-reduced-motion:no-preference){html.js .kit-phone--settle{animation:kit-settle .6s var(--ease-out) both}}@keyframes kit-settle{0%{opacity:0;transform:rotate(0)translateY(16px)}}.kit-luggage{width:150px;filter:drop-shadow(0 4px 0 var(--shadow)) drop-shadow(0 12px 14px color-mix(in srgb, var(--shadow) 30%, transparent));position:absolute;bottom:16%;right:max(4%,50% - 250px);transform:rotate(7deg)}.kit-luggage-tag{background:var(--kraft);color:var(--on-kraft);border:2px solid var(--outline);clip-path:polygon(22% 0,78% 0,100% 16%,100% 100%,0 100%,0 16%);border-radius:10px 10px 14px 14px;padding:14px 14px 16px}.kit-luggage-tag:before{content:"";border:2px solid var(--outline);background:var(--paper);border-radius:50%;width:14px;height:14px;margin:0 auto 10px;display:block}.kit-luggage .kit-code{background:var(--card);margin:0}.kit-luggage-title{font:800 16px/1.15 var(--display);margin:8px 0 6px;display:block}@media (width<=639px){.kit-luggage{transform-origin:100% 0;bottom:-40px;right:0;transform:rotate(7deg)scale(.8)}}.kit-perf{background:linear-gradient(90deg, color-mix(in srgb, var(--outline) 45%, transparent) 50%, transparent 0) 0 0 / 14px 2px;height:2px}.kit-step{background:var(--card);border:2px solid var(--outline);box-shadow:0 4px 0 var(--shadow);border-radius:22px;flex-direction:column;padding:24px;list-style:none;display:flex;position:relative}.kit-step-n{border:2px solid var(--outline);background:var(--orange);width:40px;height:40px;color:var(--on-orange);font:800 18px/1 var(--display);box-shadow:0 2px 0 var(--shadow);border-radius:50%;place-items:center;margin:-2px 0 16px;display:grid}.kit-step h3{margin:0 0 6px}.kit-step p{color:var(--ink-muted);margin:0 0 18px}.kit-frag{border:2px solid var(--outline);background:var(--sheet);border-radius:14px;flex-wrap:wrap;flex:1;align-content:center;align-items:center;gap:8px;min-height:92px;padding:14px;display:flex}@media (prefers-reduced-motion:no-preference){html.js [data-reveal]{transition:opacity .24s var(--ease-out), transform .24s var(--ease-out)}html.js [data-reveal]:not(.in){opacity:0;transform:translateY(12px)}}.kit-peek{--phone-w:min(330px, 80vw);width:100%;height:calc(var(--phone-w) * var(--peek,1.6));border-bottom:2px dashed color-mix(in srgb, var(--outline) 45%, transparent);padding:16px 24px 0;overflow:hidden}@media (prefers-reduced-motion:no-preference){html.js [data-reveal][data-stage]:not(.in){opacity:1;transform:none}html.js [data-stage] .band-copy,html.js [data-stage] .kit-peek .kit-phone,html.js [data-stage] .sms,html.js [data-stage] .sealed,html.js [data-stage] .item{transition:opacity .42s var(--ease-out), translate .52s var(--ease-out)}html.js [data-stage]:not(.in) .band-copy{opacity:0;translate:-28px}html.js [data-stage].band--flip:not(.in) .band-copy,html.js [data-stage].split--flip:not(.in) .band-copy{translate:28px}html.js [data-stage]:not(.in) .kit-peek .kit-phone{opacity:0;translate:0 56px}html.js [data-stage]:not(.in) .sms,html.js [data-stage]:not(.in) .sealed{opacity:0;translate:0 32px}html.js [data-stage] .kit-peek:nth-child(2) .kit-phone{transition-delay:.12s}html.js [data-stage] .band-shot .kit-phone,html.js [data-stage] .sms,html.js [data-stage] .sealed{transition-delay:80ms}html.js [data-stage]:not(.in) .item{opacity:0;translate:0 28px}html.js [data-stage] .item{transition-delay:var(--d,0s)}}.spy{z-index:4;flex-direction:column;display:none;position:fixed;top:50%;right:14px;translate:0 -50%}@media (width>=1280px){.spy{display:flex}}.spy a{place-items:center;width:28px;height:24px;display:grid;position:relative}.spy a:before{content:"";border:2px solid var(--outline);background:var(--card);width:12px;height:12px;transition:transform .15s var(--ease-out), background-color .15s var(--ease-out);border-radius:50%}.spy a[aria-current=true]:before{background:var(--orange);transform:scale(1.3)}.spy a:after{content:attr(data-label);border:2px solid var(--outline);background:var(--card);box-shadow:0 2px 0 var(--shadow);font:700 12px/1.2 var(--display);white-space:nowrap;color:var(--ink);opacity:0;pointer-events:none;transition:opacity .15s var(--ease-out), translate .15s var(--ease-out);border-radius:999px;margin-right:6px;padding:4px 10px;position:absolute;right:100%;translate:6px}.spy a[aria-current=true]:after,.spy a:focus-visible:after{opacity:1;translate:0}@media (hover:hover){.spy a:hover:after{opacity:1;translate:0}}.shot--night,:root[data-theme=dark] .shot--day{display:none}:root[data-theme=dark] .shot--night{display:block}@media (prefers-color-scheme:dark){:root:not([data-theme=light]) .shot--day{display:none}:root:not([data-theme=light]) .shot--night{display:block}}
