:root{--paper:#fbf7ef;--ink:#3a3226;--soft:#6f6250;--line:#ddd3bf;--card:#fff;color:var(--ink);font-family:ui-rounded,SF Pro Rounded,Arial Rounded MT Bold,system-ui,-apple-system,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:var(--paper);overscroll-behavior:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;touch-action:manipulation}button{font:inherit;color:inherit;cursor:pointer}.screen{height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);flex-direction:column;display:flex}.top-bar{flex:none;align-items:center;gap:12px;padding:8px 12px;display:flex}.round-btn,.round-btn-space{flex:none;width:64px;height:64px}.round-btn{border:3px solid var(--soft);background:var(--card);color:var(--soft);border-radius:50%;place-items:center;display:grid}.round-btn:active{transform:scale(.94)}.round-btn.big{width:96px;height:96px}.prompt-strip{text-align:left;border:1px solid var(--line);background:#f4eee1;border-radius:12px;flex:1;align-items:center;gap:10px;min-width:0;min-height:52px;padding:8px 14px;font-family:system-ui,-apple-system,sans-serif;font-size:17px;line-height:1.25;display:flex}.prompt-label{letter-spacing:.06em;text-transform:uppercase;color:var(--soft);flex:none;font-size:12px;font-weight:700}.prompt-text{flex:1;min-width:0}.prompt-note,.prompt-count{color:var(--soft);white-space:nowrap;flex:none;font-size:13px}.grownup-btn{border:1px solid var(--line);min-height:44px;color:var(--soft);background:0 0;border-radius:10px;flex:none;padding:0 12px;font-family:system-ui,-apple-system,sans-serif;font-size:14px}.setup-panel{border:1px solid var(--line);background:#f4eee1;border-radius:12px;flex-wrap:wrap;flex:none;align-items:center;gap:8px;margin:0 12px 4px;padding:8px 12px;font-family:system-ui,-apple-system,sans-serif;font-size:15px;display:flex}.setup-label{color:var(--soft);font-weight:600}.setup-gap{margin-left:16px}.setup-hint{color:var(--soft);margin-left:8px;font-size:13px}.stepper{border:1px solid var(--line);background:var(--card);border-radius:10px;align-items:center;display:inline-flex;overflow:hidden}.stepper button{background:0 0;border:0;width:44px;height:44px;font-size:22px}.stepper-value{text-align:center;font-variant-numeric:tabular-nums;min-width:28px;font-weight:700}.stage{flex:1;justify-content:center;min-height:0;padding:0 8px 8px;display:flex}.balance{touch-action:none;width:100%;height:100%;font-family:inherit}.ask{flex-direction:column;flex:1;justify-content:space-evenly;align-items:center;min-height:0;padding:8px 16px 24px;display:flex}.equation-text{white-space:nowrap;font-variant-numeric:tabular-nums;font-size:clamp(64px,13vw,150px);font-weight:700}.eq-op{color:#5b5346}.choices{gap:clamp(24px,8vw,96px);display:flex}.choice,.tile{border:4px solid var(--line);background:var(--card);box-shadow:0 6px 0 var(--line);border-radius:32px;place-items:center;display:grid}.choice{width:clamp(180px,28vw,280px);height:clamp(150px,26vh,220px)}.choice:active,.tile:active{box-shadow:0 2px 0 var(--line);transform:translateY(4px)}.home{flex-wrap:wrap;flex:1;justify-content:center;align-items:center;gap:clamp(20px,5vw,64px);min-height:0;padding:16px 24px 24px;display:flex}.home-tiles{grid-template-columns:repeat(2,clamp(150px,20vw,220px));grid-auto-rows:clamp(130px,24vh,190px);gap:clamp(14px,2.4vw,28px);display:grid}.tile{align-content:center;gap:6px;overflow:hidden}.tile.start{background:#ffd84d;border-color:#e0b100;width:clamp(220px,30vw,340px);height:clamp(220px,52vh,400px);box-shadow:0 6px #e0b100}.tile.start:active{box-shadow:0 2px #e0b100}.tile-pair{gap:8px;display:flex}.tile-symbol{color:var(--soft);font-size:44px;font-weight:700;line-height:1}.finish{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:32px;display:flex}.fill{flex:1;gap:12px;min-height:0;padding:0 12px 12px;display:flex}.fill-main{--u:30px;flex-direction:column;flex:1;justify-content:space-evenly;align-items:center;min-width:0;min-height:0;display:flex}.fill-main .equation-text{font-size:clamp(52px,10vw,120px)}.blank-box{text-align:center;vertical-align:middle;background:#fff;border:.06em dashed #b9ad96;border-radius:.18em;min-width:1.25em;height:1.25em;padding:0 .12em;line-height:1.17em;display:inline-block}.blank-box.filled{border-style:solid}.blank-box.small{min-width:1em;height:1em}.tile-blank{white-space:nowrap;font-size:clamp(26px,3.2vw,38px)}.show-me{width:150px;height:110px}.pad{flex:none;grid-template-columns:repeat(3,84px);grid-auto-rows:84px;place-content:center;gap:10px;display:grid}.pad.wide{grid-template-columns:repeat(5,62px);grid-auto-rows:62px;gap:8px}.pad button{border:3px solid var(--line);background:var(--card);box-shadow:0 4px 0 var(--line);font-variant-numeric:tabular-nums;border-radius:20px;font-size:36px;font-weight:700}.pad.wide button{border-radius:16px;font-size:28px}.pad button:active{box-shadow:0 1px 0 var(--line);transform:translateY(3px)}.pad button.picked{border-color:var(--soft);box-shadow:0 4px 0 var(--soft);background:#fff6d6}.pad button:disabled{opacity:.55}.pad button.picked:disabled{opacity:1}@media (orientation:portrait){.fill{flex-direction:column}.pad{grid-template-columns:repeat(6,84px)}.pad.wide{grid-template-columns:repeat(7,72px);grid-auto-rows:72px}}.bond-screen{--u:30px;flex-direction:column;flex:1;justify-content:space-evenly;align-items:center;gap:8px;min-height:0;padding:0 16px 12px;display:flex}.bond-top{flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(16px,5vw,64px);display:flex}.bond{border-radius:28px;flex:none;width:280px;height:210px;position:relative}.bond.pulse{background:#fff6d6;animation:1.4s ease-in-out 2 pulse;box-shadow:0 0 0 8px #ffd84d}@keyframes pulse{50%{box-shadow:0 0 0 16px #ffd84d}}.bond-lines{position:absolute;inset:0}.bond-spot{width:92px;height:92px;position:absolute;transform:translate(-50%,-50%)}.bond-spot.whole{top:52px;left:140px}.bond-spot.part0{top:158px;left:62px}.bond-spot.part1{top:158px;left:218px}.bond-empty{background:#fff;border:4px dashed #b9ad96;border-radius:50%;width:100%;height:100%}.tile-face{font-variant-numeric:tabular-nums;touch-action:none;border:4px solid;border-radius:22px;place-items:center;width:92px;height:92px;font-size:46px;font-weight:700;display:grid}.tile-face.round{border-radius:50%}.drag-ghost{z-index:10;pointer-events:none;filter:drop-shadow(0 8px 6px #0003);position:fixed;transform:translate(-50%,-50%)scale(1.12)}.frame-row{flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(16px,4vw,56px);display:flex}.frame{align-items:center;gap:14px;display:flex}.slot{background:#fff;border:4px dashed #b9ad96;border-radius:26px;place-items:center;width:108px;height:108px;display:grid}.slot.filled{border-style:solid;border-color:var(--line)}.frame-op,.frame-eq{color:#5b5346;text-align:center;border-radius:50%;width:64px;height:64px;font-size:64px;font-weight:700;line-height:60px}.frame-eq{color:#d3cab8}.frame-eq.lit{color:#3a3226;background:#ffd84d;box-shadow:0 0 0 3px #e0b100}.pick-row .tile-face{border-width:3px;border-radius:18px;width:68px;height:68px;font-size:32px}.pick-row{grid-template-columns:repeat(11,68px);justify-content:center;gap:10px;display:grid}.pick-row .tile-face.picked{outline:4px solid var(--soft);outline-offset:2px}.picture-row{align-items:center;min-height:118px;display:flex}.bars{min-width:calc(var(--u) * 10);flex-direction:column;gap:6px;display:flex}.bar-row{min-height:42px;display:flex}.bars.picture .bar-row{min-height:52px}.bar{display:flex}.cell{width:var(--u);flex:none;height:42px}.cell.dashed{border:2px dashed}.bar-row .bar:first-child .cell:first-child{border-radius:8px 0 0 8px}.bar-row .bar:last-child .cell:last-child{border-radius:0 8px 8px 0}.cell.taken{animation:.9s ease-in .6s forwards taken}@keyframes taken{to{opacity:.22;transform:translateY(10px)}}.cannot-take{position:relative}.reach{border:4px dashed #6f6250;border-radius:10px;height:52px;animation:1.6s ease-in-out .4s both reach;position:absolute;top:-5px;left:-3px}@keyframes reach{0%{opacity:0;transform:translateY(-16px)}25%{opacity:1;transform:translateY(0)}35%,55%,75%{transform:translateY(9px)}45%,65%{transform:translate(0)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.cell.taken,.reach,.bond.pulse{animation-duration:10ms;animation-delay:0s}}@media (orientation:portrait){.bond-screen{--u:28px}.pick-row{grid-template-columns:repeat(7,68px)}}.round-btn.hold{border-color:var(--line);color:#a3977f;touch-action:none;position:relative}.round-btn.hold:after{content:"";border:4px solid var(--soft);clip-path:inset(100% 0 0);border-radius:50%;position:absolute;inset:-3px}.round-btn.hold.holding:after{clip-path:inset(0);transition:clip-path var(--hold-ms) linear}.closing{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;padding:24px;font-family:system-ui,-apple-system,sans-serif;display:flex}.closing h1{margin:0;font-size:26px;font-weight:600}.closing-choices{flex-wrap:wrap;justify-content:center;gap:16px;display:flex}.closing-btn{border:2px solid var(--soft);background:var(--card);border-radius:14px;min-width:190px;min-height:72px;padding:0 24px;font-size:20px;font-weight:600}.closing-note{max-width:560px;color:var(--soft);margin:0;font-size:16px}.parent-view{-webkit-overflow-scrolling:touch;-webkit-user-select:text;user-select:text;background:#fff;height:100dvh;padding:20px clamp(16px,4vw,48px) 48px;font-family:system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.4;overflow-y:auto}.parent-view>*{max-width:900px;margin-left:auto;margin-right:auto}.pv-head{justify-content:space-between;align-items:center;display:flex}.pv-head h1{margin:0;font-size:24px}.parent-view h2{border-top:1px solid var(--line);margin:28px auto 8px;padding-top:16px;font-size:18px}.pv-btn,.parent-view select,.pv-seg button{min-height:44px;font:inherit;color:inherit;background:#fff;border:1px solid #b9ad96;border-radius:10px;padding:0 16px}.pv-btn.danger{color:#a33a2a;border-color:#a33a2a;font-weight:600}.pv-row{justify-content:space-between;align-items:center;gap:16px;padding:8px 0;display:flex}.pv-confirm{gap:8px;display:flex}.pv-seg{display:inline-flex}.pv-seg button{border-radius:0;min-width:64px}.pv-seg button:first-child{border-radius:10px 0 0 10px}.pv-seg button:last-child{border-left:0;border-radius:0 10px 10px 0}.pv-seg button.on{background:var(--ink);border-color:var(--ink);color:#fff;font-weight:600}.pv-note,.pv-empty{color:var(--soft);margin:6px auto;font-size:14px}.pv-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.pv-table.narrow{max-width:560px;margin-left:0}.pv-table th,.pv-table td{text-align:left;vertical-align:baseline;border-bottom:1px solid #ece5d6;padding:8px 10px}.pv-table th{color:var(--soft);font-size:13px;font-weight:600}.pv-table .num{text-align:right;white-space:nowrap}.pv-table tr.is-focus td{background:#fff9e3}.pv-eg{color:var(--soft);white-space:nowrap;margin-left:6px;font-size:14px}.pv-tag{background:var(--ink);color:#fff;border-radius:999px;margin-left:8px;padding:1px 8px;font-size:12px}.pv-chart{width:100%;max-width:640px;margin-left:0;display:block}.pv-closings{flex-wrap:wrap;gap:8px;margin:0 auto;padding:0;list-style:none;display:flex}.pv-closings li{border:1px solid #b9ad96;border-radius:999px;padding:6px 12px}.pv-closings li span{color:var(--soft);margin-right:4px;font-size:13px}.pv-closings li.closing-same-as{border-color:var(--ink);font-weight:600}.bar-row .bar:first-child:last-child .cell:first-child:last-child{border-radius:8px}