:root{color:#241a12;font-synthesis:none;text-rendering:optimizelegibility;background:#efe6d3;font-family:Inter,Noto Sans SC,Microsoft YaHei,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0}button,input,select,textarea{font:inherit}button{appearance:none}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-shell{background:linear-gradient(135deg,#1f545214,#0000 42%),linear-gradient(#f6efe2 0%,#e4d3b6 100%);grid-template-rows:auto 1fr;min-height:100vh;display:grid}.app-header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fffaf0db;border-bottom:1px solid #47311f38;justify-content:space-between;align-items:center;gap:18px;min-height:76px;padding:14px clamp(18px,4vw,44px);display:flex}.app-header h1{letter-spacing:0;margin:0;font-size:clamp(24px,3vw,34px);font-weight:800;line-height:1.05}.app-header p{color:#6a5139;margin:6px 0 0;font-size:14px;font-weight:600;line-height:1.4}.app-header__actions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:12px;display:flex}.app-nav{background:#fffdf6b8;border:1px solid #49322138;border-radius:8px;align-items:center;gap:4px;padding:4px;display:flex}.app-nav__link{color:#2c2118;border:1px solid #0000;border-radius:6px;place-items:center;min-height:36px;padding:7px 11px;font-size:14px;font-weight:800;line-height:1.2;text-decoration:none;display:inline-grid}.app-nav__link:hover,.app-nav__link:focus-visible{background:#fffcf2d1;border-color:#1a5c565c;outline:0;box-shadow:0 0 0 3px #1a5c5624}.app-nav__link--active{color:#fffaf0;background:#254f4c;border-color:#36261a33}.workspace{grid-template-columns:minmax(320px,840px) minmax(280px,380px);justify-content:center;align-items:start;gap:clamp(16px,2.6vw,28px);min-width:0;padding:clamp(12px,3vw,28px);display:grid;overflow:auto}.toolbar{align-items:center;display:flex}.segmented-control{background:#fffdf6b8;border:1px solid #49322138;border-radius:8px;grid-template-columns:repeat(2,minmax(64px,1fr));gap:4px;padding:4px;display:grid}.segmented-control__button,.tool-button{color:#2c2118;letter-spacing:0;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:6px;min-height:36px;font-size:14px;font-weight:700;line-height:1.2;transition:background-color .14s,border-color .14s,box-shadow .14s}.segmented-control__button:hover,.segmented-control__button:focus-visible,.tool-button:hover,.tool-button:focus-visible{background:#fffcf2d1;border-color:#1a5c565c;outline:0;box-shadow:0 0 0 3px #1a5c5624}.segmented-control__button--active{color:#fffaf0;background:#254f4c;border-color:#36261a33;box-shadow:0 1px 4px #261b1229}.setup-panel,.play-panel{background:#fffaf0e6;border:1px solid #47311f33;border-radius:8px;gap:14px;width:100%;padding:16px;display:grid;box-shadow:0 14px 32px #2b1e121f}.panel-heading,.play-panel h2,.play-panel h3{letter-spacing:0;margin:0;line-height:1.25}.panel-heading{gap:4px;display:grid}.panel-heading h2{margin:0;font-size:18px;line-height:1.2}.panel-heading p{color:#6a5139;margin:0;font-size:13px;font-weight:600;line-height:1.35}.play-panel h2{font-size:18px}.play-panel h3{color:#4b3928;font-size:14px;font-weight:800}.play-panel p{color:#6a5139;margin:0;font-size:14px;line-height:1.5}.play-stats{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;display:grid}.play-stats div{background:#fffdf7a3;border:1px solid #47311f29;border-radius:8px;gap:3px;min-width:0;padding:10px;display:grid}.play-stats dt{color:#69533d;font-size:12px;font-weight:800;line-height:1.2}.play-stats dd{color:#241a12;margin:0;font-size:16px;font-weight:800;line-height:1.25}.play-panel__section{gap:8px;display:grid}.turn-banner,.check-banner{background:#fffdf7c2;border:1px solid #47311f29;border-radius:8px;grid-template-columns:auto 1fr;align-items:center;gap:12px;min-height:54px;padding:12px;display:grid}.turn-banner span,.check-banner span{color:#6a5139;font-size:12px;font-weight:900;line-height:1.2}.turn-banner strong,.check-banner strong{color:#241a12;min-width:0;font-size:20px;font-weight:900;line-height:1.15}.turn-banner--white{background:linear-gradient(135deg,#fffcf2f2,#e8f2ebdb);box-shadow:inset 4px 0 #f8efdf}.turn-banner--black{background:linear-gradient(135deg,#221f1bf0,#2f4a46e6);box-shadow:inset 4px 0 #15120f}.turn-banner--black span,.turn-banner--black strong{color:#fff6e7}.check-banner--active{background:#ffebe0eb;border-color:#a8352d57}.check-banner--active strong{color:#8a2d24}.compact-list{color:#5b4531;gap:6px;margin:0;padding-left:18px;font-size:13px;line-height:1.45;display:grid}.compact-list--ordered{padding-left:22px}.muted{color:#76614b}.warning,.warning .compact-list{color:#7a2e21}.field{gap:7px;min-width:0;display:grid}.field__label{color:#5d4935;font-size:13px;font-weight:800;line-height:1.2}.field select,.field textarea{color:#241a12;background:#fffdf7eb;border:1px solid #47311f3d;border-radius:6px;width:100%;font-size:14px;line-height:1.4}.field select{min-height:38px;padding:7px 10px}.field textarea{resize:vertical;min-height:220px;padding:10px;font-family:SFMono-Regular,Consolas,Liberation Mono,ui-monospace,monospace}.field select:focus,.field textarea:focus{border-color:#1a5c5694;outline:0;box-shadow:0 0 0 3px #1a5c5629}.button-stack{gap:10px;display:grid}.button-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;display:grid}.tool-button{background:#fffdf7c7;border-color:#47311f3d;place-items:center;width:100%;padding:8px 12px;text-decoration:none;display:inline-grid}.tool-button--primary{color:#fffaf0;background:#254f4c;border-color:#254f4c}.tool-button--primary:hover,.tool-button--primary:focus-visible{background:#1c4542;border-color:#1c4542}.validation-status{border-radius:8px;gap:7px;padding:12px;font-size:13px;line-height:1.45;display:grid}.validation-status strong{font-size:14px;line-height:1.2}.validation-status span,.validation-status ul{margin:0}.validation-status ul{padding-left:18px}.validation-status--valid{color:#244534;background:#e1f3e6c2;border:1px solid #2a6f4f3d}.validation-status--error{color:#6c2f24;background:#ffece3d1;border:1px solid #9a40303d}.setup-boxes{gap:14px;display:grid}.piece-box-group{gap:8px;display:grid}.piece-box-group__title{color:#5d4935;justify-content:space-between;align-items:center;gap:10px;font-size:13px;line-height:1.2;display:flex}.piece-box-group__title strong{color:#2c2118;font-size:15px}.piece-box-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.piece-box{color:#2c2118;cursor:pointer;background:#fffdf7b8;border:1px solid #47311f33;border-radius:7px;grid-template-columns:34px minmax(0,1fr) auto;align-items:center;gap:8px;width:100%;min-height:48px;padding:7px 8px;transition:border-color .14s,background-color .14s,box-shadow .14s,transform .14s;display:grid;position:relative}.piece-box:hover,.piece-box:focus-visible{background:#fffcf2f2;border-color:#1a5c5666;outline:0;box-shadow:0 0 0 3px #1a5c5624}.piece-box:disabled{cursor:not-allowed;opacity:.5;box-shadow:none}.piece-box--selected{background:#deefe7e6;border-color:#254f4c;box-shadow:0 0 0 2px #254f4c2e,inset 0 0 0 1px #ffffff7a}.piece-box img{filter:drop-shadow(0 2px 3px #22140a38);width:34px;height:34px;display:block}.piece-box__text{text-align:left;gap:2px;min-width:0;display:grid}.piece-box__label{color:inherit;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:900;line-height:1.15;overflow:hidden}.piece-box__detail{color:#6a5139;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:800;line-height:1.1;overflow:hidden}.piece-box__count{color:#fffaf0;text-align:center;background:#254f4c;border-radius:999px;min-width:24px;padding:3px 6px;font-size:12px;font-weight:900;line-height:1.1}.board{--board-padding:clamp(10px, 2.2vmin, 18px);--cell-border:#22301a42;aspect-ratio:1;width:min(100%,82vmin,820px);min-width:min(320px,100vw - 32px);padding:var(--board-padding);isolation:isolate;background:linear-gradient(135deg,#ffecbb2e,#0000 38%,#2b4e2729 82%),radial-gradient(circle at 18% 18%,#d5c28933,#0000 26%),radial-gradient(circle at 82% 76%,#19493438,#0000 28%),repeating-linear-gradient(12deg,#557a3d 0,#5f8747 18px,#50743a 36px,#6b8f4d 54px);border:9px solid #5f4428;border-radius:8px;position:relative;box-shadow:0 22px 48px #1f2a1647,inset 0 0 0 1px #ffeec061,inset 0 0 34px #20371a57}.board:before{content:"";pointer-events:none;z-index:0;background:repeating-linear-gradient(4deg,#ffeec412 0 1px,#0000 2px 20px),linear-gradient(90deg,#4d331d33,#0000 18% 82%,#4d331d33),linear-gradient(#4d331d33,#0000 18% 82%,#4d331d33);border-radius:0;position:absolute;inset:0}.board-cells{z-index:1;grid-template-columns:repeat(var(--board-size), minmax(0, 1fr));grid-template-rows:repeat(var(--board-size), minmax(0, 1fr));border:2px solid #261f1470;border-radius:4px;width:100%;height:100%;display:grid;position:relative;overflow:hidden;box-shadow:0 0 0 1px #fff3cd3d,inset 0 0 22px #152b182e}.board-cell{z-index:1;border:1px solid var(--cell-border);color:#25180e;cursor:pointer;border-radius:0;place-items:center;min-width:0;min-height:0;padding:0;transition:background-color .14s,box-shadow .14s,filter .14s;display:grid;position:relative}.board-cell--light{background:linear-gradient(135deg,#fff2c41f,#0000 52%),#8baa62}.board-cell--dark{background:linear-gradient(135deg,#2544252e,#0000 58%),#668847}.board-cell:before{content:"";opacity:0;background:#222e1838;border-radius:50%;width:8px;height:8px;transition:background-color .14s,transform .14s,opacity .14s;position:absolute;transform:scale(1)}.board-cell--empty:hover:before,.board-cell--empty:focus-visible:before{opacity:.85}.board-cell:hover,.board-cell:focus-visible{filter:brightness(1.08);outline:0;box-shadow:inset 0 0 0 3px #fff4cc73}.board-cell:focus-visible{box-shadow:inset 0 0 0 3px #fff4ccc7,inset 0 0 0 6px #1e5b587a}.board-cell--occupied:before{opacity:0}.board-cell--selected{box-shadow:inset 0 0 0 3px #ffeb95eb,inset 0 0 0 6px #643a1757}.board-cell--target-move:before,.board-cell--target-wall:before{opacity:1;background:#1c695dbd;width:16px;height:16px;box-shadow:inset 0 0 0 3px #fff5d66b,0 2px 8px #13453d3d}.board-cell--target-wall:before{background:#254f4cc7;border-radius:5px;width:20px;height:20px}.board-cell--legal.board-cell--occupied{box-shadow:inset 0 0 0 4px #1c695d9e}.board-cell--target-cannon:after,.board-cell--remove-confirm:after{content:"";z-index:3;pointer-events:none;position:absolute}.board-cell--target-cannon:after{background:linear-gradient(#a62a21eb,#a62a21eb) 50%/2px 78% no-repeat,linear-gradient(90deg,#a62a21eb,#a62a21eb) 50%/78% 2px no-repeat;border:2px solid #a62a21eb;border-radius:50%;width:72%;height:72%;box-shadow:0 0 0 3px #fff1d2ad,0 2px 10px #601a1447}.board-cell--remove-confirm:after{background:linear-gradient(45deg,#0000 43%,#a62a21 44% 56%,#0000 57%),linear-gradient(-45deg,#0000 43%,#a62a21 44% 56%,#0000 57%),#fff3e0eb;border-radius:50%;width:56%;height:56%;box-shadow:0 0 0 2px #a62a21c2,0 3px 8px #441b0f3d}.piece{z-index:1;object-fit:contain;filter:drop-shadow(0 6px 8px #22140a57);-webkit-user-select:none;user-select:none;pointer-events:none;border-radius:50%;width:90%;max-width:64px;height:90%;max-height:64px;display:block;position:relative}.rulebook-page{width:min(100%,1040px);margin:0 auto;padding:clamp(18px,4vw,46px)}.rulebook{background:#fffaf0f0;border:1px solid #47311f2e;border-radius:8px;overflow:hidden;box-shadow:0 18px 44px #2b1e1224}.markdown-body{padding:clamp(20px,4vw,46px)}.markdown-body h1,.markdown-body h2,.markdown-body h3,.markdown-body h4{color:#241a12;letter-spacing:0;margin:0 0 14px;line-height:1.18}.markdown-body h1{font-size:clamp(30px,5vw,48px)}.markdown-body h2{border-top:1px solid #47311f29;margin-top:34px;padding-top:6px;font-size:clamp(22px,3vw,30px)}.markdown-body h3{margin-top:24px;font-size:20px}.markdown-body p,.markdown-body li,.markdown-body blockquote{color:#4f3d2c;font-size:16px;line-height:1.75}.markdown-body p{margin:0 0 16px}.markdown-body a{color:#1f5a55;font-weight:800}.markdown-body blockquote{background:#e1f3e6b8;border-left:4px solid #254f4c;border-radius:0 8px 8px 0;margin:18px 0;padding:14px 16px}.markdown-body ul,.markdown-body ol{margin:0 0 18px;padding-left:24px}.markdown-body img{vertical-align:middle;max-width:100%;height:auto}.markdown-body p>img:only-child{border-radius:8px;width:100%;margin:18px 0 26px;display:block;box-shadow:0 12px 26px #2b1e121f}.markdown-body p>img[src^="/rulebook/diagrams/"]:only-child{background:#6c4d31;width:min(100%,760px);margin-left:auto;margin-right:auto}.markdown-body p>img[src="/rulebook/diagrams/setup-crop.svg"]:only-child{width:100%}.markdown-body table{border-collapse:collapse;border:1px solid #47311f29;border-radius:8px;width:100%;margin:18px 0 26px;font-size:14px;overflow:hidden}.markdown-body th,.markdown-body td{text-align:left;vertical-align:middle;border:1px solid #47311f1f;padding:10px 12px}.markdown-body th{color:#241a12;background:#e1f3e6c2;font-weight:900}.markdown-body td{color:#4f3d2c;background:#fffdf7a3}.markdown-body td img{filter:drop-shadow(0 2px 4px #22140a33);width:42px;height:42px}.markdown-body code{background:#47311f14;border-radius:5px;padding:2px 5px;font-family:SFMono-Regular,Consolas,Liberation Mono,ui-monospace,monospace;font-size:.92em}.markdown-body pre{color:#fff8ea;background:#241a12;border-radius:8px;padding:14px;overflow:auto}.markdown-body pre code{color:inherit;background:0 0;padding:0}.rulebook-actions{grid-template-columns:repeat(2,minmax(0,180px));justify-content:end;gap:10px;padding:0 clamp(20px,4vw,46px) clamp(20px,4vw,34px);display:grid}@media (width<=760px){.app-header{flex-direction:column;align-items:stretch;min-height:68px}.toolbar{width:100%}.app-header__actions{justify-content:stretch}.app-nav{grid-template-columns:repeat(3,minmax(0,1fr));width:100%;display:grid}.segmented-control{width:100%}.workspace{grid-template-columns:minmax(0,1fr);padding:12px}.board{border-width:8px;width:min(92vmin,100vw - 24px);min-width:0}.panel-section,.button-row,.rulebook-actions{grid-template-columns:1fr}}