*{margin:0;padding:0;box-sizing:border-box}:root{--paper: #f2ebdc;--paper-deep: #e9dfc9;--card: #faf6eb;--ink: #2e2718;--ink-soft: #57503e;--muted: #8d8168;--line: #d9cdb0;--line-strong: #c3b391;--accent: #7d3b24;--gold: #a97e22;--gold-dim: #cbb98e;--success: #55702f;--error: #9c3a28;--sq-light: #ecdfc3;--sq-dark: #b18d63;--frame: #64492c;--serif: "Palatino", "Palatino Linotype", "Songti TC", "Noto Serif TC", "STSong", serif;--sans: "PingFang TC", "Noto Sans TC", "Microsoft JhengHei", system-ui, sans-serif}body{background:radial-gradient(1100px 500px at 50% -8%,rgba(255,253,246,.7),transparent 65%),var(--paper);color:var(--ink);font-family:var(--sans);min-height:100vh;-webkit-tap-highlight-color:transparent;overflow-x:hidden}.app-header{display:flex;align-items:baseline;gap:18px;padding:20px 28px 14px;border-bottom:4px double var(--line-strong);background:transparent}.app-header h1{flex:1;font-family:var(--serif);font-size:1.45rem;font-weight:600;letter-spacing:.08em;color:var(--ink)}.app-header .subtitle{font-family:var(--serif);font-size:.7rem;font-weight:400;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);margin-left:10px}.header-right{font-family:var(--serif);color:var(--gold);letter-spacing:.06em}button{font-family:var(--sans);font-size:.9rem;border:none;border-radius:3px;padding:9px 16px;cursor:pointer;transition:background .15s,border-color .15s,color .15s;letter-spacing:.04em;touch-action:manipulation}button:active{transform:translateY(1px)}button.primary{background:var(--ink);color:var(--paper);width:100%;letter-spacing:.12em}button.primary:hover{background:var(--accent)}button.ghost{background:transparent;color:var(--ink-soft);border:1px solid var(--line-strong)}button.ghost:hover{border-color:var(--ink-soft);color:var(--ink)}.hidden{display:none!important}#screen-menu{max-width:1020px;margin:0 auto;padding:34px 24px 60px}.menu-intro{font-family:var(--serif);color:var(--ink-soft);line-height:1.9;margin:0 auto 10px;max-width:640px;text-align:center}.menu-intro strong{color:var(--accent);font-weight:600}.menu-intro:after{content:"❦";display:block;text-align:center;color:var(--gold-dim);font-size:1.1rem;margin-top:18px}#screen-menu .menu-intro{margin-bottom:30px}.level-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:16px}.level-card{position:relative;overflow:hidden;background:var(--card);border:1px solid var(--line);border-radius:5px;padding:18px 18px 14px;text-align:left;color:var(--ink);display:flex;flex-direction:column;gap:7px;box-shadow:0 1px 2px #4632140f;transition:border-color .15s,transform .15s,box-shadow .15s}.level-card:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 6px 16px #4632141f}.card-glyph{position:absolute;right:-6px;bottom:-18px;font-size:5.2rem;line-height:1;color:#64492c17;pointer-events:none}.level-card-top{display:flex;justify-content:space-between;align-items:baseline}.level-num{font-family:var(--serif);color:var(--muted);font-size:.76rem;letter-spacing:.18em}.level-card-name{font-family:var(--serif);font-size:1.3rem;font-weight:600;letter-spacing:.04em}.level-card-en{font-family:var(--serif);font-style:italic;color:var(--muted);font-size:.8rem;margin-bottom:6px}.level-card-bottom{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding-top:9px;margin-top:2px}.stars{color:#cfc2a2;letter-spacing:3px;font-size:.85rem}.stars.earned{color:var(--gold)}.stars-pair{display:inline-flex;align-items:center;gap:6px}.side-icon{font-size:.95rem;color:var(--ink-soft)}.side-icon-b{color:var(--ink)}.tag{font-size:.72rem;letter-spacing:.14em;color:var(--muted)}.tag:before{content:"●";font-size:.55rem;margin-right:5px;vertical-align:1px}.tag.diff-1:before{color:#7d8f56}.tag.diff-2:before{color:#c1913a}.tag.diff-3:before{color:#a54b34}#screen-level{padding:26px 20px 60px}.level-layout{display:flex;gap:30px;justify-content:center;align-items:flex-start;max-width:1080px;margin:0 auto;flex-wrap:wrap}.board-wrap{flex:0 1 540px;min-width:300px;width:100%;max-width:540px}.board-topbar,.board-bottombar{display:flex;justify-content:space-between;align-items:center;padding:9px 2px}.player-label{font-family:var(--serif);color:var(--ink-soft);font-size:.92rem;letter-spacing:.05em}.turn-indicator{color:var(--accent);font-size:.85rem;letter-spacing:.05em}.mode-badge{font-size:.72rem;letter-spacing:.3em;padding:3px 9px 3px 12px;border:1px solid currentColor;border-radius:2px}.badge-demo{color:#5a6c86}.badge-practice{color:var(--success)}.badge-free{color:var(--accent)}.board{position:relative;width:100%;aspect-ratio:1;border:10px solid var(--frame);border-radius:4px;box-shadow:inset 0 0 0 1px #fff0d259,0 0 0 1px #4a3620,0 16px 34px #50371947;-webkit-user-select:none;user-select:none;background:var(--sq-light);touch-action:manipulation;container-type:inline-size}.squares-layer,.pieces-layer{position:absolute;top:0;right:0;bottom:0;left:0}.pieces-layer{pointer-events:none}.square{position:absolute;width:12.5%;height:12.5%}.square.light{background:var(--sq-light)}.square.dark{background:var(--sq-dark)}.square.last{box-shadow:inset 0 0 0 100px #c49c3c66}.square.selected{box-shadow:inset 0 0 0 100px #7d6e2d73}.square.check{box-shadow:inset 0 0 0 100px #be3c288c}.square.hint{box-shadow:inset 0 0 0 3px var(--gold),inset 0 0 0 100px #a97e222e}.square.flash-error{box-shadow:inset 0 0 0 100px #aa37238c}.square.target:after{content:"";position:absolute;top:36%;right:36%;bottom:36%;left:36%;border-radius:50%;background:#3c2a1247}.square.target-capture:after{content:"";position:absolute;top:5%;right:5%;bottom:5%;left:5%;border-radius:50%;border:3px solid rgba(60,42,18,.32)}.square.threat-hanging:after{content:"";position:absolute;top:11%;right:11%;bottom:11%;left:11%;border-radius:50%;box-shadow:inset 0 0 0 3px var(--error),0 0 4px #9c3a2859;pointer-events:none}.square.threat-attacked:after{content:"";position:absolute;top:15%;right:15%;bottom:15%;left:15%;border-radius:50%;box-shadow:inset 0 0 0 2px var(--gold);pointer-events:none}.coord{position:absolute;font-family:var(--serif);font-size:clamp(8px,1.5vw,11px);font-weight:600;opacity:.8}.square.light .coord{color:var(--sq-dark)}.square.dark .coord{color:var(--sq-light)}.coord-rank{top:2px;left:4px}.coord-file{bottom:1px;right:4px}.piece{position:absolute;width:12.5%;height:12.5%;display:flex;align-items:center;justify-content:center;font-size:clamp(24px,5.2vw,44px);line-height:1;z-index:2}@supports (width: 1cqw){.piece{font-size:9.2cqw}.coord{font-size:clamp(8px,2.2cqw,12px)}}.piece.pt-r,.piece.pt-b,.piece.pt-q{transform:scale(1.12)}.piece.pt-n{transform:scale(1.08)}.piece.pt-k{transform:scale(1.18)}.piece.w{color:#fdfaf2;text-shadow:0 1px 1px rgba(75,50,20,.7),0 0 1px #6b5a3e}.piece.b{color:#262019;text-shadow:0 1px 1px rgba(250,240,215,.3)}.piece.fading{opacity:0;transition:opacity .2s}.side-panel{flex:1 1 320px;max-width:400px;min-width:290px;background:var(--card);border:1px solid var(--line);border-radius:6px;padding:20px;display:flex;flex-direction:column;gap:14px;box-shadow:0 1px 2px #4632140f}.level-title-row{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--line);padding-bottom:12px}.level-title-row h2{font-family:var(--serif);font-size:1.12rem;font-weight:600;letter-spacing:.03em}.side-toggle{display:flex;border-radius:3px;overflow:hidden;border:1px solid var(--line-strong)}.side-btn{border-radius:0;padding:5px 12px;font-size:.8rem;background:transparent;color:var(--muted)}.side-btn.active{background:var(--ink);color:var(--paper)}.progress-row{display:flex;align-items:center;gap:10px}.progress-track{flex:1;height:5px;background:var(--paper-deep);border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:var(--gold);border-radius:3px;transition:width .3s}.progress-text{font-family:var(--serif);font-size:.78rem;color:var(--muted);white-space:nowrap}.line-name{font-family:var(--serif);font-size:.82rem;color:var(--accent);letter-spacing:.04em;min-height:1.1em}.comment-box{background:var(--paper-deep);border-left:3px solid var(--gold);border-radius:0 4px 4px 0;padding:13px 15px;line-height:1.75;font-size:.92rem;color:var(--ink-soft);min-height:76px}.comment-box.error{border-left-color:var(--error);color:var(--error)}.comment-box.success{border-left-color:var(--success)}.move-list{background:var(--paper-deep);border-radius:4px;padding:10px 14px;max-height:132px;overflow-y:auto;display:grid;grid-template-columns:auto 1fr 1fr;gap:3px 12px;font-family:var(--serif);font-size:.9rem;font-variant-numeric:tabular-nums}.move-num{color:var(--muted)}.move.played{color:var(--ink)}.move.next{color:var(--accent);font-weight:700}.move.future{color:#b3a888}.controls{display:flex;flex-direction:column;gap:10px}.controls-row{display:flex;gap:8px}.controls-row button{flex:1}.line-select-row{display:flex;align-items:center;gap:10px;font-size:.85rem;color:var(--muted);letter-spacing:.06em;white-space:nowrap}.line-select-row select{flex:1;font-family:var(--sans);font-size:.88rem;background:var(--card);color:var(--ink);border:1px solid var(--line-strong);border-radius:3px;padding:7px 10px}.complete-panel{background:var(--card);border:3px double var(--gold);border-radius:4px;padding:20px 18px;display:flex;flex-direction:column;gap:12px;text-align:center}.complete-title{font-family:var(--serif);font-size:1.15rem;font-weight:600;letter-spacing:.3em;color:var(--ink)}.complete-title:after{content:"❦";display:block;font-size:.85rem;color:var(--gold-dim);margin-top:6px;letter-spacing:0}.complete-stars{font-size:1.8rem;color:var(--gold);letter-spacing:10px;text-indent:10px}.complete-detail{color:var(--ink-soft);font-size:.87rem;line-height:1.7}.free-game-banner{display:block;width:100%;max-width:640px;margin:0 auto 30px;text-align:left;background:var(--card);border:1px solid var(--line);border-radius:5px;padding:16px 22px;box-shadow:0 1px 2px #4632140f;transition:border-color .15s,transform .15s,box-shadow .15s}.free-game-banner:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 6px 16px #4632141f}.free-game-banner .fg-title{font-family:var(--serif);font-size:1.24rem;font-weight:600;letter-spacing:.05em;color:var(--ink)}.free-game-banner .fg-sub{font-family:var(--serif);color:var(--muted);font-size:.85rem;margin-top:5px;line-height:1.6}.coach-panel{background:var(--card);border:1px solid var(--line);border-left:3px solid var(--error);border-radius:0 4px 4px 0;padding:13px 15px;display:flex;flex-direction:column;gap:10px}.coach-panel .coach-text{font-size:.9rem;line-height:1.7;color:var(--ink-soft)}.coach-settings{display:flex;flex-direction:column;gap:8px;padding:2px 0 4px}.coach-setting{display:flex;align-items:center;gap:8px;font-size:.86rem;letter-spacing:.04em;color:var(--ink-soft);cursor:pointer}.coach-setting input{accent-color:var(--accent);width:15px;height:15px;cursor:pointer}.review-list{background:var(--paper-deep);border-radius:4px;padding:12px 15px;font-size:.86rem;color:var(--ink-soft);line-height:1.7}.review-title{font-family:var(--serif);font-weight:600;letter-spacing:.1em;color:var(--ink);margin-bottom:8px}.review-list ul{list-style:none;display:flex;flex-direction:column;gap:5px}.review-list li{font-family:var(--serif);padding-left:12px;position:relative}.review-list li:before{content:"·";position:absolute;left:2px;color:var(--gold)}.review-empty{font-family:var(--serif);color:var(--success);letter-spacing:.03em}@media (max-width: 900px){.app-header{padding:16px 18px 12px}.level-layout{flex-direction:column;align-items:center;gap:18px}.board-wrap{flex-basis:auto;max-width:min(620px,100%)}.side-panel{max-width:min(620px,100%);width:100%}#screen-level{padding:20px 18px 48px}}@media (max-width: 600px){#screen-menu{padding:24px 14px 44px}.menu-intro{font-size:.92rem;line-height:1.8}.menu-intro:after{margin-top:12px}#screen-menu .menu-intro{margin-bottom:20px}.level-grid{gap:10px}.level-card{padding:15px 15px 12px}.free-game-banner{padding:14px 16px;margin-bottom:20px}.free-game-banner .fg-title{font-size:1.1rem}}@media (max-width: 480px){.app-header{gap:10px;align-items:center;padding:12px 14px 10px}.app-header h1{font-size:1.15rem;white-space:nowrap}.app-header .subtitle{display:none}.app-header #btn-back{padding:7px 10px;font-size:.82rem}.header-right{font-size:.9rem}#screen-level{padding:12px 8px 40px}.level-layout{gap:12px}.board{border-width:6px;border-radius:3px}.board-topbar,.board-bottombar{padding:7px 2px}.player-label{font-size:.85rem}.mode-badge{font-size:.66rem;letter-spacing:.2em}.side-panel{padding:14px 12px;min-width:0;border-radius:5px;gap:12px}.level-title-row{padding-bottom:10px}.level-title-row h2{font-size:1rem}.comment-box{font-size:.88rem;line-height:1.65;min-height:60px;padding:11px 12px}.move-list{max-height:104px;font-size:.85rem;padding:8px 10px}.controls-row{gap:6px}.controls-row button{padding:11px 6px;font-size:.85rem}button.primary{padding:12px 14px}.line-select-row{font-size:.82rem}.line-select-row select{padding:8px}.complete-panel{padding:16px 12px}.complete-stars{font-size:1.5rem;letter-spacing:8px;text-indent:8px}.complete-detail{font-size:.84rem}.coach-panel{padding:11px 12px}.review-list{font-size:.83rem;padding:10px 12px}}@media (max-height: 500px) and (max-width: 900px){.level-layout{flex-direction:row;align-items:flex-start}.board-wrap{max-width:min(78vh,100%)}#screen-level{padding:10px 12px 20px}}