*{box-sizing:border-box}html,body{margin:0;padding:0}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100svh;font-family:Noto Serif SC,Songti SC,STSong,serif}#root{min-height:100svh}button{font-family:inherit}ul,ol{margin:0;padding:0;list-style:none}:root{--paper:#f2e8d3;--paper-deep:#e8dcbe;--paper-line:#d9caa4;--ink:#2b241c;--ink-soft:#57503f;--ink-faint:#9a917d;--vermillion:#b23b2c;--vermillion-deep:#8a2c20;--vermillion-pale:#eecfc4;--indigo:#2c4a63;--indigo-deep:#1c3247;--indigo-pale:#cddbe3;--gold:#b3873c;--shadow-ink:#2b241c47;color:var(--ink);font-family:Noto Serif SC,Songti SC,serif}.app{flex-direction:column;align-items:center;min-height:100svh;padding:20px 16px 48px;display:flex;position:relative;overflow-x:hidden}.scene-bg{z-index:0;pointer-events:none;background:radial-gradient(circle at 15% 8%, #fff6, transparent 40%), radial-gradient(circle at 88% 92%, #0000000d, transparent 45%), var(--paper);position:fixed;inset:0;overflow:hidden}.scene-bg__mountains-far{background:var(--ink-faint);opacity:.42;clip-path:polygon(0% 100%,0% 58%,6% 44%,13% 54%,22% 26%,30% 47%,40% 18%,50% 42%,58% 22%,68% 46%,77% 30%,86% 52%,94% 36%,100% 50%,100% 100%);height:44%;position:absolute;bottom:0;left:-8%;right:-8%}.scene-bg__mountains-near{background:var(--ink-soft);opacity:.28;clip-path:polygon(0% 100%,0% 68%,10% 52%,20% 64%,32% 38%,44% 60%,56% 32%,68% 57%,78% 40%,88% 62%,100% 46%,100% 100%);height:30%;position:absolute;bottom:0;left:-8%;right:-8%}.scene-bg__mist{background:linear-gradient(90deg, transparent, var(--paper) 30%, var(--paper) 70%, transparent);opacity:.55;filter:blur(20px);height:20%;animation:40s ease-in-out infinite alternate mist-drift;position:absolute;bottom:12%;left:-25%;right:-25%}.scene-bg__mist--2{opacity:.4;height:15%;animation-duration:55s;animation-direction:alternate-reverse;bottom:24%}@keyframes mist-drift{0%{transform:translate(-6%)}to{transform:translate(6%)}}.scene-bg__sun{background:radial-gradient(circle,#e6c8968c 0%,#e6c89647 45%,#0000 72%);border-radius:50%;width:140px;height:140px;position:absolute;top:8%;right:12%}.scene-bg__crane{width:64px;height:32px;color:var(--ink-soft);opacity:.4;animation:linear infinite crane-fly;position:absolute}.scene-bg__crane--1{animation-duration:70s;animation-delay:0s;top:16%}.scene-bg__crane--2{opacity:.3;width:44px;height:22px;animation-duration:95s;animation-delay:-30s;top:26%}@keyframes crane-fly{0%{transform:translate(-10vw)}50%{transform:translate(55vw,-18px)}to{transform:translate(120vw)}}.app__header{z-index:1;justify-content:center;width:100%;max-width:1080px;margin-bottom:20px;display:flex;position:relative}.brand{align-items:center;gap:14px;display:flex}.brand__seal{background:var(--vermillion);color:#f6ead9;width:52px;height:52px;box-shadow:0 3px 8px var(--shadow-ink);border:1.5px solid #f6ead980;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;font-family:Ma Shan Zheng,Noto Serif SC,serif;font-size:30px;display:flex;transform:rotate(-3deg)}.brand__title{letter-spacing:4px;color:var(--ink);margin:0;font-family:Ma Shan Zheng,Noto Serif SC,serif;font-size:34px;font-weight:400;line-height:1.1}.brand__subtitle{letter-spacing:1px;color:var(--ink-faint);margin:2px 0 0;font-size:12.5px}.app__main{z-index:1;justify-content:center;align-items:flex-start;gap:28px;width:100%;max-width:1080px;display:flex;position:relative}.app__board-col{flex-direction:column;flex:0 680px;align-items:center;gap:14px;display:flex}.app__side-col{flex-direction:column;flex:0 0 280px;gap:16px;display:flex}@media (width<=1000px){.app__main{flex-direction:column;align-items:center}.app__side-col{flex:none;width:100%;max-width:680px}}.statusbar{border:1px solid var(--paper-line);background:#fff6;border-radius:10px;justify-content:space-between;align-items:center;width:100%;padding:10px 16px;display:flex}.turn-badge{align-items:center;gap:8px;font-size:14.5px;font-weight:600;display:flex}.turn-badge__dot{border-radius:50%;width:10px;height:10px;box-shadow:0 0 0 3px #0000000f}.turn-badge--bottom .turn-badge__dot{background:var(--vermillion)}.turn-badge--top .turn-badge__dot{background:var(--indigo)}.turn-timer{color:var(--ink-soft);font-variant-numeric:tabular-nums;font-size:13px}.turn-timer__thinking{color:var(--vermillion-deep);animation:1.1s ease-in-out infinite pulse-fade}.statusbar--won{flex-direction:column;gap:8px;padding:18px 16px}.statusbar__reason{color:var(--ink-soft);margin:0;font-size:13.5px}.seal{width:92px;height:92px;box-shadow:0 4px 10px var(--shadow-ink);border:3px solid;border-radius:10px;justify-content:center;align-items:center;display:flex;transform:rotate(-2deg)}.seal--bottom{background:var(--vermillion-pale);color:var(--vermillion-deep)}.seal--top{background:var(--indigo-pale);color:var(--indigo-deep)}.seal--draw{background:var(--paper-deep);color:var(--ink-soft);border-color:var(--ink-faint)}.seal__text{letter-spacing:2px;font-family:Ma Shan Zheng,serif;font-size:22px}.board{aspect-ratio:7/9;background:var(--ink-faint);width:100%;max-width:680px;box-shadow:0 10px 32px var(--shadow-ink), inset 0 0 0 2px var(--gold);border:6px solid var(--ink);border-radius:8px;padding:10px;position:relative}.board__grid{background:var(--ink-soft);border-radius:2px;gap:2px;width:100%;height:100%;display:grid;position:relative;overflow:hidden}.board__pieces{pointer-events:none;position:absolute;inset:10px}.cell{background:var(--paper);cursor:pointer;justify-content:center;align-items:center;transition:background .15s;display:flex;position:relative}.cell--land{background:var(--paper)}.cell--river{background:repeating-linear-gradient(100deg,#ffffff2e 0 6px,#0000 6px 16px),linear-gradient(160deg,#7fa4b3,#5c8598)}.cell--trap{background:repeating-linear-gradient(45deg, #2b241c0f 0px, #2b241c0f 4px, transparent 4px, transparent 10px), var(--paper)}.cell--trap.cell--owner-bottom{background-color:var(--vermillion-pale)}.cell--trap.cell--owner-top{background-color:var(--indigo-pale)}.cell--den{background:var(--paper-deep)}.cell--den.cell--owner-bottom{background:radial-gradient(circle, var(--vermillion-pale) 0%, var(--paper-deep) 75%)}.cell--den.cell--owner-top{background:radial-gradient(circle, var(--indigo-pale) 0%, var(--paper-deep) 75%)}.cell__mark{color:var(--ink-faint);-webkit-user-select:none;user-select:none;font-size:13px;font-weight:600}.cell--owner-bottom .cell__mark{color:var(--vermillion-deep);opacity:.55}.cell--owner-top .cell__mark{color:var(--indigo-deep);opacity:.55}.cell__mark--den{font-family:Noto Serif SC,serif;font-size:15px}.cell__hint{background:#2b241c52;border-radius:50%;width:26%;height:26%;animation:1.3s ease-in-out infinite pulse-scale;position:absolute}.cell__hint--capture{background:0 0;border:3px solid #b23b2cbf;width:82%;height:82%;animation:1.1s ease-in-out infinite pulse-ring}.cell--legal{background-color:#b3873c29}.cell--last-move{box-shadow:inset 0 0 0 3px #b3873c80}.piece{aspect-ratio:.88;cursor:pointer;pointer-events:auto;width:11.2%;box-shadow:0 3px 7px var(--shadow-ink), inset 0 0 0 1px #ffffff40;border:none;border-radius:10px;flex-direction:column;align-items:stretch;padding:3px;font-family:Noto Serif SC,serif;transition:left .32s cubic-bezier(.34,1.1,.64,1),top .32s cubic-bezier(.34,1.1,.64,1),transform .16s,box-shadow .16s;display:flex;position:absolute;overflow:hidden;transform:translate(-50%,-50%)}.piece:hover{box-shadow:0 8px 14px var(--shadow-ink), inset 0 0 0 1px #ffffff4d;transform:translate(-50%,-50%)translateY(-3px)scale(1.05)}.piece--bottom{--card-face:var(--vermillion);background:linear-gradient(160deg, var(--vermillion), var(--vermillion-deep));color:var(--paper);border:1.5px solid var(--vermillion-deep)}.piece--top{--card-face:var(--indigo);background:linear-gradient(160deg, var(--indigo), var(--indigo-deep));color:var(--paper);border:1.5px solid var(--indigo-deep)}.piece__rank-badge{width:15px;height:15px;color:var(--paper);z-index:1;background:#00000038;border-radius:50%;justify-content:center;align-items:center;font-size:9px;font-weight:700;line-height:1;display:flex;position:absolute;top:3px;left:4px}.piece__art{flex:1;justify-content:center;align-items:center;min-height:0;padding:4px 2px 0;display:flex}.animal-art{width:100%;height:100%}.piece__name-plate{text-align:center;color:var(--paper);background:#00000029;border-radius:4px;flex-shrink:0;margin-top:2px;font-size:12px;font-weight:700;line-height:1.7}.piece--selected{box-shadow:0 0 0 3px var(--gold), 0 8px 16px var(--shadow-ink);transform:translate(-50%,-50%)translateY(-4px)scale(1.1)}.piece--trapped{animation:1s ease-in-out infinite pulse-warn}.piece--vanishing{pointer-events:none;animation:.42s forwards dissolve}@keyframes dissolve{to{opacity:0;transform:translate(-50%,-50%)scale(.2)rotate(20deg)}}@keyframes pulse-scale{0%,to{opacity:.7;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}@keyframes pulse-ring{0%,to{opacity:.6;transform:scale(.94)}50%{opacity:1;transform:scale(1.02)}}@keyframes pulse-warn{0%,to{box-shadow:0 0 #b23b2c80}50%{box-shadow:0 0 0 5px #b23b2c00}}@keyframes pulse-fade{0%,to{opacity:.55}50%{opacity:1}}.btn{border:1.5px solid var(--ink-soft);color:var(--ink);cursor:pointer;background:#ffffff80;border-radius:8px;padding:9px 14px;font-family:inherit;font-size:13.5px;transition:background .15s,transform .1s}.btn:hover:not(:disabled){background:#ffffffd9}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn--primary{background:var(--vermillion);border-color:var(--vermillion-deep);color:#fbeee6}.btn--primary:hover:not(:disabled){background:var(--vermillion-deep)}.btn--replay{letter-spacing:2px;width:100%;padding:11px;font-size:15px}.panel{border:1px solid var(--paper-line);background:#ffffff6b;border-radius:12px;padding:16px}.panel__title{letter-spacing:1px;color:var(--ink-soft);margin:0 0 10px;font-size:13.5px;font-weight:700}.panel__section+.panel__section{margin-top:14px}.panel__section--row{gap:10px;display:flex}.panel__section--row .btn{flex:1}.mode-switch{background:#0000000d;border-radius:8px;gap:3px;padding:3px;display:flex}.mode-switch__btn{color:var(--ink-soft);cursor:pointer;background:0 0;border:none;border-radius:6px;flex:1;padding:8px 6px;font-family:inherit;font-size:13px}.mode-switch__btn--active{background:var(--ink);color:var(--paper);font-weight:600}.history-panel{min-height:60px}.history-list__item{border-bottom:1px dashed var(--paper-line);color:var(--ink-soft);padding:6px 0;font-size:13px}.history-list__item:last-child{border-bottom:none}.history-list__item--bottom{color:var(--vermillion-deep)}.history-list__item--top{color:var(--indigo-deep)}.history-list__empty{color:var(--ink-faint);padding:6px 0;font-size:13px}.modal-backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:50;background:#14100a80;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal{background:var(--paper);border:2px solid var(--ink);border-radius:12px;width:100%;max-width:480px;max-height:82vh;overflow-y:auto;box-shadow:0 12px 32px #00000059}.modal__header{border-bottom:1px solid var(--paper-line);background:var(--paper);justify-content:space-between;align-items:center;padding:16px 20px;display:flex;position:sticky;top:0}.modal__header h2{letter-spacing:2px;margin:0;font-family:Ma Shan Zheng,serif;font-size:22px}.modal__close{cursor:pointer;color:var(--ink-soft);background:0 0;border:none;padding:4px 8px;font-size:16px}.modal__body{padding:18px 20px 24px}.rules-section{margin-bottom:20px}.rules-section h3{color:var(--vermillion-deep);margin:0 0 8px;font-size:14.5px}.rules-section p{color:var(--ink-soft);margin:6px 0;font-size:13.5px;line-height:1.7}.rules-section ul{margin:0;padding:0}.rules-section li{color:var(--ink-soft);margin-bottom:6px;padding-left:14px;font-size:13.5px;line-height:1.7;position:relative}.rules-section li:before{content:"·";color:var(--gold);font-weight:700;position:absolute;left:2px}.rank-list{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:10px;display:grid}.rank-list__item{border:1px solid var(--paper-line);background:#ffffff80;border-radius:8px;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;display:flex}.rank-list__char{font-size:16px;font-weight:700}.rank-list__num{color:var(--ink-faint);font-size:11px}