:root{--yellow:#FFCB05;--navy:#172B78;--ink:#0E1430;--paper:#FFF8DC;--red:#D7300B;--blue:#3D7DCA;--pale:#DCE7F7;--ease:cubic-bezier(0.16,1,0.3,1);}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%}body{min-height:100dvh;background:var(--yellow);color:var(--ink);font-family:"Archivo",system-ui,sans-serif;font-weight:400;line-height:1.4;display:flex;flex-direction:column;padding:max(12px,env(safe-area-inset-top)) max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));overflow-x:hidden;}::selection{background:var(--navy);color:var(--yellow)}.sheet{flex:1;width:100%;max-width:1160px;margin:0 auto;display:grid;gap:2px;background:var(--navy);border:2px solid var(--navy);grid-template-columns:1fr;grid-template-areas:"head" "title" "fig" "act" "legend";}.cell{background:var(--yellow);padding:12px 14px;min-width:0}.head{grid-area:head;display:flex;align-items:center;gap:12px;padding:8px 12px}.head img{width:52px;height:52px;border-radius:12px;flex:none;display:block}.run{display:flex;flex-direction:column;flex:1;min-width:0;font-size:clamp(0.72rem,0.68rem + 0.2vw,0.85rem);color:var(--navy)}.run strong{font-weight:800;font-size:clamp(1rem,0.9rem + 0.4vw,1.25rem);color:var(--ink);letter-spacing:-0.01em}.pg{font-weight:800;font-size:clamp(0.75rem,0.7rem + 0.2vw,0.9rem);color:var(--navy);font-variant-numeric:tabular-nums;text-align:right;line-height:1.2}.title{grid-area:title;padding:14px 14px 14px}h1{font-weight:800;font-size:clamp(1.75rem,1.2rem + 2.6vw,3.6rem);line-height:1.02;letter-spacing:-0.025em;color:var(--ink)}h1 .hand{display:block;font-family:"Kalam",cursive;font-weight:400;color:var(--navy);letter-spacing:0;font-size:1.02em;line-height:1.05;margin-top:0.08em;transform:rotate(-2deg);transform-origin:left center}.support{margin-top:10px;font-size:clamp(0.92rem,0.86rem + 0.3vw,1.12rem);max-width:34em;color:var(--ink)}.fig{grid-area:fig;background:var(--paper);padding:10px 12px 12px;position:relative}.figcap{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:clamp(0.72rem,0.68rem + 0.2vw,0.86rem);color:var(--navy);margin-bottom:6px}.figcap b{font-weight:800}.figcap .hand{font-family:"Kalam",cursive;font-size:clamp(0.92rem,0.85rem + 0.3vw,1.1rem);color:var(--red)}.diagram{display:grid;grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr);gap:10px;align-items:center}.stick{position:relative;aspect-ratio:1/1;touch-action:none;cursor:grab;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}.stick:active{cursor:grabbing}.stick svg,.map svg{display:block;width:100%;height:100%}.knob{transition:transform 0.6s var(--ease)}.stick.held .knob{transition:none}.map{position:relative;aspect-ratio:1/1;border:2px solid var(--navy);border-radius:6px;overflow:hidden;background:#E9F0E2}.me{transition:none}.coords{display:flex;justify-content:space-between;margin-top:6px;font-size:clamp(0.7rem,0.66rem + 0.2vw,0.84rem);font-variant-numeric:tabular-nums;color:var(--navy);font-weight:800;letter-spacing:0.01em}.act{grid-area:act;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:14px}.cta{display:flex;align-items:center;justify-content:center;gap:10px;min-height:54px;background:var(--ink);color:#fff;text-decoration:none;font-weight:800;font-size:clamp(1.05rem,0.98rem + 0.4vw,1.3rem);border-radius:999px;padding:0 26px;-webkit-tap-highlight-color:transparent;transition:transform 0.3s var(--ease),background-color 0.3s var(--ease);}.cta svg{width:20px;height:20px;flex:none}.cta:active{transform:scale(0.98)}.cta:focus-visible{outline:3px solid var(--navy);outline-offset:3px;box-shadow:0 0 0 6px var(--paper)}@media (hover: hover) and (pointer: fine){.cta:hover{background:var(--navy)}}.worry{font-size:clamp(0.82rem,0.78rem + 0.2vw,0.95rem);color:var(--ink);text-align:center}.legend{grid-area:legend;padding:10px 14px}.legend ol{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:6px 14px;font-size:clamp(0.78rem,0.74rem + 0.2vw,0.92rem)}.legend li{display:flex;gap:8px;align-items:baseline}.legend .n{flex:none;width:20px;height:20px;border-radius:50%;background:var(--navy);color:var(--yellow);font-weight:800;font-size:0.72rem;display:inline-flex;align-items:center;justify-content:center;transform:translateY(3px);font-variant-numeric:tabular-nums}.legend li span:last-child{min-width:0}.legend b{font-weight:800}footer{max-width:1160px;width:100%;margin:8px auto 0;display:flex;justify-content:space-between;font-size:0.8rem;color:var(--navy);font-weight:800}footer span:last-child{font-weight:400;font-variant-numeric:tabular-nums}@media (min-width: 900px){body{padding:20px 28px}.sheet{grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);grid-template-rows:auto 1fr auto auto;grid-template-areas:"head fig" "title fig" "act fig" "act legend";}.head{padding:12px 18px}.head img{width:72px;height:72px;border-radius:16px}.title{padding:26px 26px 18px;display:flex;flex-direction:column;justify-content:center}.support{margin-top:16px}.act{padding:18px 26px 22px;align-items:flex-start}.worry{text-align:left}.fig{padding:16px 20px 18px;display:flex;flex-direction:column;justify-content:center}.diagram{gap:20px}.legend{padding:14px 20px}}@media (min-width: 900px) and (max-height: 820px){.head img{width:60px;height:60px}.title{padding:18px 26px 12px}h1{font-size:clamp(1.75rem,1rem + 2.6vw,3.2rem)}}@media (prefers-reduced-motion: reduce){.knob,.cta{transition:none}}html,body{max-width:100%;overflow-x:clip}