:root{--yellow:#FFFC00;--ink:#111111;--paper:#FAFAD7;--white:#FFFFFF;--stone:#E5E4D8;--slate:#55544C;--butter:#FFF9A6;}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{font-family:"Red Hat Mono",ui-monospace,Menlo,Consolas,monospace;background:var(--paper);color:var(--ink);min-height:100dvh;display:flex;flex-direction:column;overflow-x:hidden;-webkit-font-smoothing:antialiased;}.edge{height:10px;background:var(--yellow);border-bottom:2px solid var(--ink);flex:none;}main{flex:1;width:100%;max-width:1160px;margin:0 auto;padding:12px max(14px,env(safe-area-inset-right)) 8px max(14px,env(safe-area-inset-left));display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"brand" "text" "art" "act";gap:10px;align-content:start;}.brand{grid-area:brand;display:flex;align-items:center;gap:12px}.brand img{width:clamp(52px,15vw,160px);height:auto;aspect-ratio:1 / 1;border-radius:22%;display:block;flex:none;}.brand-name{font-weight:700;font-size:clamp(1rem,0.9rem + 0.6vw,1.4rem);letter-spacing:-0.02em}.brand-tag{display:block;font-weight:400;font-size:clamp(0.68rem,0.64rem + 0.2vw,0.82rem);color:var(--slate);letter-spacing:0;margin-top:2px;}.text{grid-area:text}h1{font-weight:700;font-size:clamp(1.7rem,1.05rem + 3.1vw,3.3rem);line-height:1.08;letter-spacing:-0.045em;max-width:15ch;}h1 .hl{background:linear-gradient(transparent 58%,var(--yellow) 58%,var(--yellow) 94%,transparent 94%);}.lede{margin-top:8px;font-size:clamp(0.8rem,0.74rem + 0.32vw,1.02rem);line-height:1.45;color:var(--slate);max-width:46ch;}.lede strong{font-weight:600;color:var(--ink)}.art{grid-area:art;min-width:0}.flip{-webkit-tap-highlight-color:transparent;appearance:none;font:inherit;color:var(--ink);position:relative;display:grid;grid-template-columns:1fr 1fr;width:100%;min-height:44px;border:2px solid var(--ink);border-radius:999px;background:var(--white);cursor:pointer;overflow:hidden;}.flip-thumb{position:absolute;top:0;bottom:0;left:0;width:50%;background:var(--ink);border-radius:999px;transform:translateX(100%);transition:transform .32s cubic-bezier(.3,.9,.3,1);}.flip span.opt{position:relative;z-index:1;padding:11px 6px;font-weight:600;font-size:clamp(0.74rem,0.7rem + 0.2vw,0.9rem);text-align:center;white-space:nowrap;}.scene[data-state="after"] .opt-after,.scene[data-state="before"] .opt-before{color:var(--white)}.scene[data-state="before"] .flip-thumb{transform:translateX(0)}.flip:focus-visible,.half:focus-visible{outline:3px solid var(--ink);outline-offset:3px}.panel{position:relative;margin-top:8px;display:grid;grid-template-columns:1fr 1fr;border:2px solid var(--ink);border-radius:20px;overflow:hidden;background:var(--stone);}.ruler{position:absolute;left:0;right:0;top:0;height:9px;z-index:2;pointer-events:none;}.half{-webkit-tap-highlight-color:transparent;appearance:none;border:0;font:inherit;color:var(--ink);text-align:left;cursor:pointer;position:relative;display:flex;flex-direction:column;gap:6px;padding:18px 12px 12px;min-height:clamp(184px,26dvh,400px);min-width:0;}.half-before{background:var(--stone)}.half-after{background:var(--yellow);border-left:2px solid var(--ink)}.half-kicker{font-weight:700;font-size:clamp(0.66rem,0.62rem + 0.2vw,0.84rem);letter-spacing:.08em;text-transform:uppercase;display:flex;align-items:center;gap:6px;}.dot{width:8px;height:8px;border-radius:50%;background:var(--ink);opacity:.3;flex:none;transition:opacity .2s}.half svg{display:block;width:100%;flex:1;min-height:0;max-height:240px;transition:opacity .3s,transform .45s cubic-bezier(.3,.9,.3,1);}.half-status{font-size:clamp(0.7rem,0.66rem + 0.22vw,0.92rem);line-height:1.3;font-weight:600;}.half-status small{display:block;font-weight:400;font-size:.9em;color:var(--slate)}.half-after .half-status small{color:#3a3900}.frame{position:absolute;top:0;bottom:0;left:0;width:50%;border:4px solid var(--ink);border-radius:17px;pointer-events:none;z-index:3;transform:translateX(100%);transition:transform .36s cubic-bezier(.3,.9,.3,1);}.scene[data-state="before"] .frame{transform:translateX(0)}.scene[data-state="after"] .half-before svg{opacity:.42;transform:scale(.94)}.scene[data-state="before"] .half-after svg{opacity:.3;transform:scale(.94)}.scene[data-state="after"] .half-after .dot,.scene[data-state="before"] .half-before .dot{opacity:1}.plane{transition:transform .6s cubic-bezier(.2,.8,.2,1);transform-box:fill-box;transform-origin:center}.scene[data-state="before"] .plane{transform:translate(-46px,30px) rotate(-8deg)}.trail{transition:opacity .4s .1s}.scene[data-state="before"] .trail{opacity:0}.cross{transition:opacity .25s}.scene[data-state="after"] .cross{opacity:.55}.covers{margin-top:8px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;padding:8px 12px;border:2px solid var(--ink);border-radius:12px;background:var(--butter);font-size:clamp(0.68rem,0.64rem + 0.2vw,0.86rem);line-height:1.3;}.covers b{font-weight:700}.act{grid-area:act;padding-top:2px}.btn{-webkit-tap-highlight-color:transparent;display:flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:14px 20px;background:var(--ink);color:var(--white);font-weight:700;font-size:clamp(0.95rem,0.9rem + 0.3vw,1.15rem);letter-spacing:-0.01em;text-decoration:none;border-radius:14px;border:2px solid var(--ink);transition:transform .15s;}.btn svg{width:22px;height:22px;flex:none}.btn:active{transform:scale(.98)}.btn:focus-visible{outline:3px solid var(--ink);outline-offset:4px}@media (hover: hover){.btn:hover{transform:translateY(-2px)}}.worry{margin-top:8px;font-size:clamp(0.72rem,0.68rem + 0.2vw,0.88rem);line-height:1.4;color:var(--slate);}footer{flex:none;padding:8px 14px calc(8px + env(safe-area-inset-bottom));text-align:center;font-size:.7rem;color:var(--slate);border-top:2px solid var(--ink);background:var(--white);}@media (min-width: 900px){main{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);grid-template-areas:"brand art" "text art" "act art";grid-template-rows:auto auto 1fr;column-gap:56px;row-gap:18px;padding-top:28px;padding-bottom:28px;align-content:center;}.brand{gap:20px}.art{align-self:center}.act{max-width:460px}.half{padding:26px 22px 20px;min-height:400px;gap:12px}.panel{margin-top:14px;border-radius:26px}.frame{border-radius:23px}.covers{margin-top:14px;padding:12px 16px}.lede{margin-top:14px}.btn{min-height:62px}}@media (prefers-reduced-motion: reduce){*{transition:none !important;animation:none !important}}:is(html,body){max-width:100%;overflow-x:clip}@font-face{font-family: 'Red Hat Mono';font-style: normal;font-weight: 400;font-display: swap;src: url(f/redhatmono-9446500e.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family: 'Red Hat Mono';font-style: normal;font-weight: 400;font-display: swap;src: url(f/redhatmono-1e7e0f5f.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family: 'Red Hat Mono';font-style: normal;font-weight: 600;font-display: swap;src: url(f/redhatmono-9446500e.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family: 'Red Hat Mono';font-style: normal;font-weight: 600;font-display: swap;src: url(f/redhatmono-1e7e0f5f.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}@font-face{font-family: 'Red Hat Mono';font-style: normal;font-weight: 700;font-display: swap;src: url(f/redhatmono-9446500e.woff2) format('woff2');unicode-range: U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF;}@font-face{font-family: 'Red Hat Mono';font-style: normal;font-weight: 700;font-display: swap;src: url(f/redhatmono-1e7e0f5f.woff2) format('woff2');unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}