:root{--bg: #f4faff;--surface: #ffffff;--border: #e3eef7;--bubble-border: #cde9ff;--ink: #23445c;--ink-2: #5e7e96;--muted: #8fa9bc;--brand: #2e9be6;--brand-deep: #1b7ec6;--track: #dcebf6;--gold: #d98f00;--star: #f2b01e;--rate-again: #e4514e;--rate-hard: #e08a1e;--rate-good: #2fa163;--rate-easy: #2e9be6;--pill-review-bg: #dff3e8;--pill-review-ink: #1e7a4c;--pill-new-bg: #e1f1ff;--pill-new-ink: #16679f;--pill-done-bg: #fff3d6;--pill-done-ink: #a66e00;--pill-miss-bg: #fce3e2;--pill-miss-ink: #b23230}*{box-sizing:border-box}html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:"M PLUS Rounded 1c",Hiragino Maru Gothic ProN,Yu Gothic UI,system-ui,sans-serif;line-height:1.6}#root{max-width:560px;margin:0 auto;min-height:100dvh;display:flex;flex-direction:column}button{font-family:inherit;border:none;cursor:pointer;background:none;color:inherit;padding:0}input,textarea,select{font-family:inherit;font-size:15px;color:var(--ink);background:var(--surface);border:1.5px solid var(--border);border-radius:12px;padding:10px 12px;width:100%}textarea{min-height:84px;resize:vertical}.screen{flex:1 1 auto;display:flex;flex-direction:column;gap:14px;padding:20px 20px calc(84px + env(safe-area-inset-bottom))}.screen.no-nav{padding-bottom:24px}.card{background:var(--surface);border:1px solid var(--border);border-radius:16px;box-shadow:0 2px 8px #23445c0f}.app-title{font-size:22px;font-weight:800;color:var(--brand-deep);letter-spacing:.02em}.date-label{font-size:12px;font-weight:700;color:var(--muted)}.row{display:flex;align-items:center;gap:8px}.spread{display:flex;justify-content:space-between;align-items:center}.bubble{position:relative;background:var(--surface);border:2px solid var(--bubble-border);border-radius:16px;padding:12px 14px;font-size:13.5px;font-weight:500;flex:1 1 auto}.bubble .tail{position:absolute;width:12px;height:12px;background:var(--surface);transform:rotate(45deg)}.bubble .tail.right{right:-8px;top:40px;border-right:2px solid var(--bubble-border);border-top:2px solid var(--bubble-border)}.bubble .tail.left{left:-8px;bottom:14px;border-left:2px solid var(--bubble-border);border-bottom:2px solid var(--bubble-border)}.bubble .tail.up{left:50%;top:-8px;border-left:2px solid var(--bubble-border);border-top:2px solid var(--bubble-border)}.cta{height:56px;background:var(--brand);border-radius:16px;display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;font-size:17px;font-weight:800;box-shadow:0 4px 12px #2e9be659;width:100%}.cta:disabled{background:var(--muted);box-shadow:none}.cta.secondary{background:var(--surface);color:var(--brand-deep);border:2px solid var(--bubble-border);box-shadow:none}.text-btn{display:inline-flex;align-items:center;gap:4px;color:var(--brand-deep);font-size:13px;font-weight:700;min-height:44px}.danger-btn{color:var(--pill-miss-ink);font-size:13px;font-weight:700;min-height:44px}.pill{font-size:11.5px;font-weight:800;border-radius:999px;padding:4px 9px;white-space:nowrap}.pill.review{background:var(--pill-review-bg);color:var(--pill-review-ink)}.pill.new{background:var(--pill-new-bg);color:var(--pill-new-ink)}.pill.done{background:var(--pill-done-bg);color:var(--pill-done-ink)}.pill.miss{background:var(--pill-miss-bg);color:var(--pill-miss-ink)}.bottom-nav{position:fixed;bottom:0;left:0;right:0;margin:0 auto;max-width:560px;display:flex;background:var(--surface);border-top:1px solid var(--border);padding:0 8px calc(8px + env(safe-area-inset-bottom));z-index:10}.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;flex:1 1 0;height:64px;color:var(--muted);font-size:11px;font-weight:700}.nav-item.active{color:var(--brand-deep)}.progress-track{height:6px;background:var(--track);border-radius:999px;overflow:hidden}.progress-fill{height:6px;background:var(--brand);border-radius:999px;transition:width .25s ease}.study-card{background:var(--surface);border:1px solid var(--border);border-radius:24px;box-shadow:0 4px 16px #23445c14;padding:32px 24px;display:flex;flex-direction:column;align-items:center;gap:14px}.q-main{font-size:32px;font-weight:800;text-align:center;overflow-wrap:anywhere;white-space:pre-wrap}.q-main.long{font-size:22px}.a-main{font-size:24px;font-weight:800;color:var(--brand-deep);text-align:center;overflow-wrap:anywhere;white-space:pre-wrap}.a-sub{background:var(--bg);border-radius:14px;padding:12px 14px;font-size:13.5px;font-weight:500;width:100%;overflow-wrap:anywhere;white-space:pre-wrap}.divider{height:1px;background:var(--border);width:100%}.rate-row{display:flex;gap:8px}.rate{flex:1 1 0;height:64px;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#fff}.rate .label{font-size:13.5px;font-weight:800}.rate .interval{font-size:10.5px;font-weight:700;opacity:.92}.rate.again{background:var(--rate-again)}.rate.hard{background:var(--rate-hard)}.rate.good{background:var(--rate-good)}.rate.easy{background:var(--rate-easy)}.tile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.tile-label{font-size:11px;font-weight:700;color:var(--ink-2)}.tile-value{font-size:24px;font-weight:800;color:var(--brand-deep)}.tile-unit{font-size:12px;font-weight:700;color:var(--ink-2)}.hm{display:grid;grid-template-rows:repeat(7,15px);grid-auto-flow:column;grid-auto-columns:15px;gap:3px;overflow-x:auto}.hm div{border-radius:4px}.l0{background:#eaf2f9}.l1{background:#c9e7fb}.l2{background:#8fcdf5}.l3{background:#4aa7e9}.l4{background:#1b7ec6}.lg{width:12px;height:12px;border-radius:3px}.bar-chart{display:flex;align-items:flex-end;gap:10px;height:78px;border-bottom:2px solid var(--border)}.bar-col{flex:1 1 0;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px}.bar-val{font-size:10px;font-weight:700;color:var(--ink-2)}.bar{width:100%;max-width:24px;background:#4aa7e9;border-radius:4px 4px 0 0}.bar-day{flex:1 1 0;text-align:center;font-size:11px;font-weight:700;color:var(--ink-2)}.section-title{font-size:16px;font-weight:800}.field-label{font-size:12.5px;font-weight:700;color:var(--ink-2);margin-bottom:4px}.hint{font-size:11.5px;font-weight:500;color:var(--muted)}.list-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px;width:100%;text-align:left}.top-bar{display:flex;align-items:center;gap:8px}.icon-btn{width:44px;height:44px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}.credit{font-size:11px;font-weight:500;color:var(--muted);line-height:1.7}.credit a{color:var(--brand-deep)}
