:root{--kinari:#f4efe4;--washi:#faf7ef;--sumi:#221d16;--sumi-soft:#4c463c;--muted:#77705f;--shu:#b53225;--shu-dark:#96281d;--line:#d9d1bd;--line-soft:#e8e1cf;--serif:"Yu Mincho", "Hiragino Mincho ProN", "Noto Serif JP", "BIZ UDMincho", serif;letter-spacing:.02em;line-break:strict;overflow-wrap:break-word;color:var(--sumi);background:var(--kinari);font-family:Hiragino Sans,Yu Gothic UI,Yu Gothic Medium,Noto Sans JP,Meiryo,system-ui,sans-serif;line-height:1.6}*{box-sizing:border-box}body{margin:0}main{max-width:760px;margin:0 auto;padding:16px}h1{font-family:var(--serif);letter-spacing:.1em;font-size:1.45rem;font-weight:500}h1 .subtitle{color:var(--muted);letter-spacing:.06em;font-size:.85rem;font-weight:400}h2,h3{font-family:var(--serif);letter-spacing:.06em;font-weight:500}h2{font-size:1.15rem}h3{font-size:1rem}a{color:var(--shu)}button{border:1px solid var(--shu);background:var(--shu);color:#faf7ef;letter-spacing:.04em;cursor:pointer;white-space:nowrap;border-radius:2px;padding:8px 18px;font-size:.95rem}button:hover{background:var(--shu-dark)}button:disabled{opacity:.45;cursor:default}button.ghost{background:var(--washi);color:var(--sumi);border:1px solid var(--line)}button.ghost:hover{background:#f1ebdc}textarea{border:1px solid var(--line);background:var(--washi);width:100%;color:var(--sumi);border-radius:2px;padding:8px;font-family:ui-monospace,monospace;font-size:.85rem}input[type=text]{border:1px solid var(--line);background:var(--washi);color:var(--sumi);border-radius:2px;padding:6px 8px}input[type=checkbox],input[type=radio]{accent-color:var(--shu)}table{border-collapse:collapse;background:var(--washi);border:1px solid var(--line);width:100%;margin-top:12px;font-size:.9rem}th,td{border-bottom:1px solid var(--line-soft);text-align:left;padding:6px 10px}th{background:#efe9da;font-weight:600}.row{flex-wrap:wrap;align-items:center;gap:8px;margin:10px 0;display:flex}nav.row{-webkit-overflow-scrolling:touch;border-bottom:1px solid var(--line);flex-wrap:nowrap;padding-bottom:10px;overflow-x:auto}nav.row button{white-space:nowrap;flex-shrink:0;padding:8px 12px}.note{color:var(--muted);overflow-wrap:anywhere;font-size:.85rem}.error{color:var(--shu);font-weight:600}.badge{color:#fff;white-space:nowrap;border-radius:2px;padding:2px 8px;font-size:.8rem}.loss{color:var(--shu)}.mono{font-family:ui-monospace,monospace}.chart{background:var(--washi);border:1px solid var(--line);border-radius:2px;width:100%;height:120px}progress{width:100%;height:10px;accent-color:var(--shu)}footer{border-top:1px solid var(--line);margin-top:32px;padding-top:12px}.board{-webkit-user-select:none;user-select:none;width:100%;max-width:420px;display:block}.correct{color:#2f6c43;font-weight:600}.done-title{font-family:var(--serif);letter-spacing:.08em;color:#2f6c43;font-size:1.3rem;font-weight:500}.result-banner{text-align:center;border-radius:2px;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:12px;margin:10px 0;padding:12px;font-size:1.5rem;font-weight:700;animation:.35s cubic-bezier(.2,1.6,.4,1) pop-in;display:flex}@keyframes pop-in{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}.xp-gain{font-size:1rem;animation:.8s ease-out float-up}.combo{color:#a8631a;font-size:1rem}@keyframes float-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.status-strip{background:var(--washi);border:1px solid var(--line);border-radius:2px;align-items:center;gap:10px;margin:8px 0;padding:8px 12px;font-size:.9rem;display:flex}.rank-badge{background:var(--sumi);color:#d9a94f;font-family:var(--serif);letter-spacing:.08em;white-space:nowrap;border-radius:2px;padding:2px 10px;font-weight:600}.xp-track{background:var(--line-soft);border-radius:4px;flex:1;min-width:60px;height:8px;display:inline-block;overflow:hidden}.xp-fill{background:linear-gradient(90deg, var(--shu), #d9a94f);border-radius:4px;height:100%;transition:width .5s;display:block}.rank-card{background:var(--washi);border:1px solid var(--line);border-radius:2px;margin:10px 0;padding:14px 18px}.rank-title{font-family:var(--serif);letter-spacing:.12em;color:var(--sumi);font-size:2rem;font-weight:500}.achievements{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:8px;display:grid}.achievement{background:var(--washi);border:1px solid var(--line);border-radius:2px;align-items:center;gap:10px;padding:8px 12px;font-size:.85rem;display:flex}.achievement.locked{opacity:.55;filter:grayscale()}.achievement-emoji{font-size:1.5rem}.secret-tag{font-family:var(--serif);color:#faf7ef;background:var(--shu);letter-spacing:.1em;vertical-align:1px;border-radius:2px;margin-left:6px;padding:1px 6px;font-size:.7rem}.nudge{background:#f5edd8;border:1px solid #dfd0a6;border-radius:2px;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 14px;font-size:.9rem;display:flex}.result-banner.ok{color:#2f6c43;background:#e4eede}.result-banner.ng{color:var(--shu);background:#f3ded6}.pv-player{margin:12px 0}.kifu-review{margin-top:12px}.wr-graph{border:1px solid var(--line);background:var(--washi);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;border-radius:2px;width:100%;height:auto;display:block}.review-main{flex-wrap:wrap;align-items:flex-start;gap:16px;margin-top:12px;display:flex}.review-board{flex:340px;min-width:300px}.review-side{flex:260px;min-width:240px}.review-nav{margin:6px 0}.ply-indicator{text-align:center;min-width:120px;font-weight:600}.pv-head{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;display:flex}.move-detail{background:var(--washi);border:1px solid var(--line);border-radius:2px;margin-bottom:10px;padding:10px 14px}.move-list{border:1px solid var(--line);background:var(--washi);border-radius:2px;max-height:380px;overflow-y:auto}.move-row{width:100%;color:var(--sumi);border:none;border-bottom:1px solid var(--line-soft);text-align:left;cursor:pointer;background:0 0;border-radius:0;align-items:center;gap:8px;padding:6px 10px;font-size:.9rem;display:flex}.move-row:hover{background:#f1ebdc}.move-row.active{background:#ece3cd;font-weight:700}.move-no{color:var(--muted);text-align:right;font-variant-numeric:tabular-nums;min-width:2.2em}.move-text{flex:1}.move-wr{color:var(--muted);font-variant-numeric:tabular-nums;font-size:.8rem}
