:root{--ink: #0b1424;--card: #15203a;--edge: #2a3a5c;--paper: #f1e8d3;--paper-2: #e8ddc2;--pale: #f3ede1;--jade: #0f7f5c;--jade-dim: #0c6a4d;--amber: #e8a020;--amber-lift: #f0b64a;--coral: #e2563c;--slate: #51607a;}*{box-sizing: border-box;}html{scroll-behavior: smooth;}body.page{margin: 0;background: var(--paper);color: var(--ink);font-family: "Lexend",system-ui,sans-serif;font-size: clamp(15px,3.6vw,17px);line-height: 1.55;overflow-x: clip;}.band{padding-left: 18px;padding-right: 18px;}@supports (padding: env(safe-area-inset-left)){.band{padding-left: max(18px,env(safe-area-inset-left));padding-right: max(18px,env(safe-area-inset-right));}}.wrap{width: 100%;max-width: 1060px;margin-left: auto;margin-right: auto;}.disp{font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;letter-spacing: -0.015em;}.page a{color: inherit;}:focus-visible{outline: 3px solid var(--amber);outline-offset: 3px;border-radius: 4px;}.hero{padding-top: 20px;padding-bottom: 8px;}.logo{width: 72px;height: 72px;display: block;}.page h1{font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;letter-spacing: -0.02em;font-size: clamp(31px,8.4vw,60px);line-height: 1.04;margin: 14px 0 0;max-width: 19ch;}.page h1 .lift{color: var(--jade);}.lead{margin: 12px 0 0;font-size: clamp(15px,3.9vw,19px);color: #2c3850;max-width: 48ch;}.page .cta{display: inline-block;background: var(--jade);color: #fcfaf6;font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;font-size: clamp(17px,4.4vw,20px);text-decoration: none;padding: 15px 30px;min-height: 52px;border-radius: 999px;border: 2px solid var(--ink);}.cta:active{background: var(--jade-dim);}.under{margin: 10px 0 0;font-size: clamp(13px,3.3vw,14px);color: #3c4860;}.story{position: relative;}.stage{position: sticky;top: 10px;z-index: 2;width: 100%;height: clamp(176px,34dvh,252px);background: var(--card);border: 2px solid var(--ink);border-radius: 20px;overflow: hidden;}.stage svg{display: block;width: 100%;height: 100%;}.stage g,.stage .chip{transition: transform 520ms ease,opacity 520ms ease;}.chip{position: absolute;font-size: clamp(11.5px,2.9vw,13px);line-height: 1.2;white-space: nowrap;padding: 5px 9px;border-radius: 8px;border: 2px solid var(--ink);}.chip-real{left: 5%;top: 68%;background: var(--coral);color: #190d09;}.chip-shown{right: 5%;top: 8%;background: var(--amber);color: var(--ink);}#real{transform-origin: 90px 136px;}#pin{transform-origin: 232px 96px;}#cursor,#ok{transform-origin: center;}.stage[data-step="1"] #pin{opacity: 0;transform: translateY(-26px);}.stage[data-step="1"] #cursor,.stage[data-step="1"] #ok{opacity: 0;}.stage[data-step="1"] .chip-shown{opacity: 0;transform: translateY(-14px);}.stage[data-step="2"] #cursor{opacity: 1;transform: translate(-6px,8px);}.stage[data-step="2"] #ok{opacity: 0;}.stage[data-step="2"] .chip-shown{opacity: 0.6;}.stage[data-step="3"] #real{opacity: 0.42;transform: scale(0.62);}.stage[data-step="3"] #cursor,.stage[data-step="3"] #ok{opacity: 0;}.stage[data-step="3"] .chip-real{opacity: 0.5;}.stage[data-step="4"] #real{opacity: 0.22;transform: scale(0.5);}.stage[data-step="4"] #pin{transform: scale(1.06);}.stage[data-step="4"] #cursor{opacity: 0;}.stage[data-step="4"] .chip-real{opacity: 0.3;}.steps{background: var(--ink);color: var(--pale);border-radius: 24px 24px 0 0;margin-top: 18px;padding: 26px 18px 34px;}.step{min-height: 62dvh;display: flex;align-items: center;}.step p{margin: 0;font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;font-size: clamp(22px,6.2vw,34px);line-height: 1.32;letter-spacing: -0.015em;max-width: 24ch;}.step .mark{display: block;width: 46px;height: 6px;border-radius: 3px;background: var(--amber);margin-bottom: 14px;}.step:nth-child(2) .mark{background: var(--coral);}.step:nth-child(3) .mark{background: var(--amber-lift);}.step:nth-child(4) .mark{background: #6fd3ae;}.board{background: var(--amber);color: var(--ink);padding-top: 30px;padding-bottom: 58px;}.board h2{font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;font-size: clamp(25px,6.6vw,38px);line-height: 1.08;margin: 0 0 4px;letter-spacing: -0.02em;}.board .sub{margin: 0 0 18px;font-size: clamp(14px,3.5vw,16px);color: #3a2c08;max-width: 46ch;}.day{font-size: 12px;letter-spacing: 0.14em;text-transform: uppercase;color: #4a3708;margin: 0 0 6px;}.chips + .day{margin-top: 22px;}.cell{background: var(--paper);border: 2px solid var(--ink);border-radius: 14px;padding: 14px;}.cell h3{font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;font-size: clamp(17px,4.4vw,20px);margin: 10px 0 4px;}.cell p{margin: 0;font-size: clamp(14px,3.5vw,15px);color: #2c3850;}.cell .ico{width: 38px;height: 38px;display: block;}.rule{height: 2px;background: var(--ink);opacity: 0.28;margin: 28px 0 24px;}.chips{display: flex;flex-wrap: wrap;gap: 8px;margin: 10px 0 0;padding: 0;list-style: none;}.theme{font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;font-size: clamp(16px,4vw,19px);color: var(--ink);margin: 0 0 6px;}.q{font: inherit;font-size: clamp(13.5px,3.5vw,15px);background: var(--paper);color: var(--ink);border: 2px solid var(--ink);border-radius: 999px;padding: 10px 16px;min-height: 44px;cursor: pointer;}.q:active{background: var(--paper-2);}.pop{display: none;max-width: min(330px,86vw);background: var(--paper);color: var(--ink);border: 2px solid var(--ink);border-radius: 14px;padding: 14px 16px;font-size: clamp(14px,3.5vw,15px);}.pop strong{display: block;font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;margin-bottom: 5px;}.plain{margin: 16px 0 0;padding: 0;list-style: none;}.plain li{background: var(--paper);border: 2px solid var(--ink);border-radius: 14px;padding: 12px 14px;margin-bottom: 8px;font-size: clamp(14px,3.5vw,15px);}.plain b{display: block;font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;}@supports selector(:popover-open){.plain{display: none;}.pop:popover-open{display: block;position: fixed;inset: auto;bottom: 13vh;left: 50%;transform: translateX(-50%);}}.note{background: var(--paper);border: 2px solid var(--ink);border-radius: 6px;padding: 22px 20px 20px;max-width: 420px;transform: rotate(-2.4deg);margin: 34px auto 0;text-align: center;}.note p{font-family: "Caveat","Lexend",cursive;font-weight: 600;font-size: clamp(24px,6.4vw,32px);line-height: 1.2;margin: 0 0 16px;}.bar{position: fixed;left: 0;right: 0;bottom: 0;z-index: 40;background: var(--ink);border-top: 2px solid var(--amber);padding: 10px max(14px,env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom));transform: translateY(115%);transition: transform 260ms ease;}.bar.on{transform: translateY(0);}.page .bar a{display: block;text-align: center;background: var(--amber);color: var(--ink);font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;font-size: 17px;text-decoration: none;padding: 13px 18px;min-height: 48px;border-radius: 999px;}footer{background: var(--ink);color: var(--pale);padding: 30px 18px calc(86px + env(safe-area-inset-bottom));text-align: center;}.seal{width: 48px;height: 48px;border: 2px solid var(--amber);border-radius: 999px;display: flex;align-items: center;justify-content: center;margin: 0 auto 12px;font-family: "Bricolage Grotesque","Lexend",system-ui,sans-serif;font-weight: 700;font-size: 21px;color: var(--amber);}.fl{display: flex;flex-wrap: wrap;gap: 14px;justify-content: center;margin: 0 0 12px;padding: 0;list-style: none;font-size: 14px;}.fl a{text-decoration: none;border-bottom: 1px solid #5b6a86;padding-bottom: 2px;}footer .note-lang{margin: 0;font-size: 13px;color: #9aa6bb;}@media (hover: hover) and (pointer: fine){.cta:hover{background: var(--jade-dim);}.q:hover{background: var(--paper-2);}.bar a:hover{background: var(--amber-lift);}.fl a:hover{border-bottom-color: var(--amber);}}@media (min-width: 900px){.logo{width: 88px;height: 88px;}.story{display: grid;grid-template-columns: 1.02fr 1fr;grid-template-rows: auto auto;gap: 0 40px;align-items: start;}.story .copy{grid-column: 1;grid-row: 1;padding-top: 26px;}.story .steps{grid-column: 1;grid-row: 2;}.stage{grid-column: 2;grid-row: 1 / span 2;align-self: start;top: 11vh;height: min(58dvh,420px);}.steps{border-radius: 24px;margin-top: 26px;padding: 30px 30px 40px;}.step{min-height: 58dvh;}.board .week{grid-template-columns: repeat(7,1fr);gap: 14px;}.week .slot{grid-column: span 2;}}@media (prefers-reduced-motion: reduce){html{scroll-behavior: auto;}.stage g,.stage .chip,.bar{transition: none;}}