:root{--ink:#292725;--muted:#817b73;--paper:#fbfaf7;--card:#fff;--line:#ebe6de;--accent:#e9784d;--accent-dark:#b9502b;--green:#3c9b76;--shadow:0 10px 28px rgba(67,54,42,.07)}
*{box-sizing:border-box;margin:0;padding:0}html,body{min-height:100%;background:var(--paper)}body{padding:calc(14px + var(--safe-area-inset-top,env(safe-area-inset-top,0px))) 14px calc(22px + var(--safe-area-inset-bottom,env(safe-area-inset-bottom,0px)));color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}button,input{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{cursor:not-allowed}
.app-shell{width:min(100%,620px);margin:auto}.topbar{height:48px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:800}.brand-mark{width:28px;height:28px;display:grid;place-items:center;border-radius:9px;color:white;background:var(--accent);font-size:20px;font-weight:900}.help-button{width:28px;height:28px;border:1px solid #d9d2c9;border-radius:50%;color:var(--muted);background:transparent;font-weight:800}
.calendar-card,.equation-card,.controls-card{border:1px solid var(--line);border-radius:17px;background:var(--card);box-shadow:var(--shadow)}.calendar-card{padding:18px 16px 15px}.calendar-heading{display:flex;align-items:center;justify-content:space-between}.mini-label{color:#aaa097;font-size:10px;letter-spacing:.15em}.calendar-heading h1{margin-top:5px;font-size:22px;letter-spacing:-.04em}.month-actions{display:flex;gap:5px}.month-actions button{width:30px;height:30px;border:1px solid var(--line);border-radius:8px;color:#91877c;background:#fff;font-size:21px;line-height:20px}.calendar-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:14px}.date-jump-button{border:1px solid #f1cbbd;border-radius:8px;padding:7px 10px;color:var(--accent-dark);background:#fff8f4;font-size:11px;font-weight:800}.mode-switch{display:flex;padding:3px;border:1px solid var(--line);border-radius:9px;background:#faf7f1}.mode-switch button{border:0;border-radius:6px;padding:5px 8px;color:#aaa097;background:transparent;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px}.mode-switch button.active{color:var(--accent-dark);background:#fff;box-shadow:0 2px 6px rgba(67,54,42,.08);font-weight:800}.date-picker-popover{margin-top:9px;padding:10px;border:1px solid #f0e4db;border-radius:11px;background:#fffaf6}.date-picker-popover label{display:block;margin-bottom:7px;color:#8f877e;font-size:11px;font-weight:800}.date-picker-row{display:flex;align-items:center;gap:6px}.date-picker-row input{min-width:0;flex:1;height:32px;padding:0 7px;border:1px solid #e6ddd4;border-radius:7px;color:var(--ink);background:#fff;font-size:12px}.date-picker-row button{height:32px;border:1px solid #ead8cc;border-radius:7px;padding:0 8px;color:#958d84;background:#fff;font-size:10px;font-weight:800}.date-picker-row .confirm-button{border-color:var(--accent);color:#fff;background:var(--accent-dark)}
.week-row,.days-grid{display:grid;grid-template-columns:repeat(7,1fr)}.week-row{margin-top:19px;color:#b7aea4;font-size:10px;text-align:center}.days-grid{gap:5px 3px;margin-top:8px}.day-cell{position:relative;display:grid;place-items:center;min-height:36px;border:1px solid transparent;border-radius:9px;color:#686159;background:transparent;font-size:13px}.day-cell:active{background:#f8f1ec}.day-cell.today span{color:var(--accent);font-weight:900}.day-cell.selected{border-color:#efb39c;color:var(--accent-dark);background:#fff5ef;font-weight:900}.day-cell i{position:absolute;bottom:3px;width:4px;height:4px;border-radius:50%;background:var(--green)}.day-cell.selected i{background:var(--accent)}.day-cell.empty{pointer-events:none}.day-cell.has-sticker{overflow:visible}.day-sticker{position:absolute;right:-4px;top:-10px;width:28px;height:28px;object-fit:contain;transform:rotate(7deg);filter:drop-shadow(0 2px 2px rgba(67,54,42,.12));pointer-events:none}.day-cell.selected .day-sticker{width:32px;height:32px;right:-5px;top:-12px}.calendar-legend{display:flex;gap:13px;margin-top:13px;padding-top:11px;border-top:1px solid #f1eee9;color:#aaa097;font-size:10px}.calendar-legend span{display:flex;align-items:center;gap:5px}.legend-dot{width:5px;height:5px;display:inline-block;border-radius:50%;background:var(--accent)}.legend-dot.done{background:var(--green)}
.game-column{margin-top:20px}.eyebrow{color:var(--accent-dark);font-size:11px;letter-spacing:.12em;font-weight:800}.eyebrow-dot{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:var(--accent)}.intro-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin:10px 0 14px}.intro-row h2{font-size:clamp(27px,8vw,36px);letter-spacing:-.07em;line-height:1.05}.intro-row p{margin-top:7px;color:var(--muted);font-size:11px;line-height:1.5}.date-digits{display:block;margin-top:4px;color:var(--accent);font-weight:800;letter-spacing:.1em}.mode-badge{margin-top:4px;padding:7px 9px;border:1px solid #f1c4b4;border-radius:8px;color:var(--accent-dark);background:#fff8f4;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10px;font-weight:800;white-space:nowrap}
.equation-card{position:relative;padding:17px 14px 13px}.equation-label,.section-title{display:flex;align-items:center;justify-content:space-between;color:var(--muted);font-size:11px;font-weight:800;letter-spacing:.04em}.used-count{color:#b6aea4;font-weight:500;letter-spacing:0}.equation-builder{display:block;min-height:72px;margin:16px 0 10px;padding:14px 11px;border:1.5px dashed #d9d1c7;border-radius:11px;background:#fdfcf9;overflow:auto;text-align:left;word-break:break-word}.equation-builder.correct{border-color:#9bdbc2;background:#f4fcf8}.token{display:inline-block;margin:0 2px;font-size:25px;font-weight:850;line-height:1.2}.token-operator,.token-paren{color:var(--accent)}.token-equals{margin:0 7px;color:#8e8378}.placeholder{color:#b9b1a8;font-size:12px}.live-results{display:flex;align-items:center;gap:8px;min-height:20px;margin:-1px 0 9px;color:#aaa097;font-size:10px}.live-results>span:first-child{color:#c2b9af;margin-right:auto}.live-results b{color:#777067;font-size:11px}.feedback{display:flex;align-items:center;gap:8px;min-height:23px;color:var(--muted);font-size:11px}.feedback-icon{display:grid;flex:0 0 auto;place-items:center;width:17px;height:17px;border-radius:50%;color:#9e968d;background:#f0ece6;font-size:10px;font-weight:900}.feedback-success{color:var(--green)}.feedback-success .feedback-icon{color:#fff;background:var(--green)}.memory-sticker{position:absolute;top:6px;right:10px;display:flex;align-items:center;gap:3px;padding:2px 3px 2px 4px;border:1px solid #f0e7db;border-radius:11px;background:#fffdf9;box-shadow:0 5px 14px rgba(67,54,42,.08);transform:rotate(3deg)}.memory-sticker img{width:40px;height:40px;object-fit:contain}.memory-sticker button{border:0;border-radius:6px;padding:4px;color:#aa6a50;background:#fff4ed;font-size:9px}
.controls-card{margin-top:11px;padding:17px 14px 15px}.number-grid,.operator-grid{display:flex;flex-wrap:wrap;gap:7px;margin-top:11px}.key{border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink)}.number-key{position:relative;width:43px;height:39px;font-size:18px;font-weight:800}.number-key small{position:absolute;right:4px;top:3px;color:#c2b9af;font-size:8px;font-weight:500}.number-key:disabled{color:#d0c9c1;background:#f7f4ef}.number-key.next{border-color:#e9977a;color:var(--accent-dark);background:#fff8f4;box-shadow:0 0 0 3px #fbece5}.number-key.used{color:#b3aaa0;background:#f4f1ec}.operator-key{width:41px;height:38px;color:var(--accent-dark);font-size:18px;font-weight:700}.equals-key{color:var(--ink);background:#f4f0e9}.action-row{display:flex;align-items:center;justify-content:flex-end;gap:4px;flex-wrap:wrap;margin-top:19px;padding-top:13px;border-top:1px solid #f1eee9}.text-button{border:0;padding:8px 6px;color:#958d84;background:none;font-size:11px}.export-button,.submit-button{border-radius:8px;padding:10px 11px;font-size:11px;font-weight:800}.export-button{border:1px solid #ead8cc;color:var(--accent-dark);background:#fff8f4}.export-button:disabled{color:#c8bdb2;background:#f7f4ef}.submit-button{display:flex;align-items:center;gap:12px;border:0;color:#fff;background:var(--ink)}.submit-button span{font-size:16px;line-height:10px}.tip{margin:11px 2px;color:#a39a91;font-size:10px}.tip span{margin-right:6px;color:var(--accent-dark);font-weight:800}
.modal-backdrop{position:fixed;z-index:10;inset:0;display:grid;place-items:center;padding:15px;background:rgba(41,39,37,.33);backdrop-filter:blur(4px)}.modal{position:relative;width:min(100%,540px);max-height:calc(100vh - 30px);overflow:auto;padding:25px 16px 17px;border:1px solid #eee6dc;border-radius:19px;background:#fffdf9;box-shadow:0 24px 70px rgba(52,41,32,.2)}.modal-close{position:absolute;top:11px;right:12px;width:29px;height:29px;border:0;border-radius:50%;color:#9b9188;background:#f5f0e9;font-size:20px;line-height:1}.modal-kicker{color:var(--accent-dark);font-size:10px;font-weight:900;letter-spacing:.16em}.modal h2{margin:7px 0 6px;font-size:21px;letter-spacing:-.04em}.modal p{color:#8f877e;font-size:11px;line-height:1.65}.sticker-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:16px 0;padding:9px;border:1px solid #f0ebe4;border-radius:13px;background:#faf7f1}.sticker-option{display:grid;place-items:center;aspect-ratio:1;border:1px solid transparent;border-radius:9px;background:rgba(255,255,255,.56)}.sticker-option.chosen{border-color:var(--accent);background:#fff3eb;box-shadow:0 0 0 3px #fbe6dc}.sticker-option img{width:82%;height:82%;object-fit:contain}.modal-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding-top:12px;border-top:1px solid #f1eee9}.export-preview{width:min(100%,330px);margin:15px auto 14px;overflow:hidden;border:1px solid #e9e1d7;border-radius:12px;background:#efe8dc;box-shadow:0 10px 28px rgba(67,54,42,.12)}.export-preview img{display:block;width:100%;height:auto}.hidden{display:none!important}
@media (min-width:580px){body{padding-left:24px;padding-right:24px}.calendar-card{padding-left:22px;padding-right:22px}.equation-card,.controls-card{padding-left:22px;padding-right:22px}.number-key{width:47px}.operator-key{width:45px}}
