:root{color-scheme:light;font-family:LXGW WenKai,serif;color:#171411;background:#fbfaf6;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body{min-width:320px;min-height:100vh;margin:0;background:#fbfaf6}button{font:inherit}.paper{position:relative;display:grid;grid-template-rows:1fr auto auto 1fr;justify-items:center;min-height:100vh;padding:clamp(30px,7vw,74px) 20px;overflow:hidden}.player-panel{position:relative;grid-row:3;width:min(760px,100%);min-height:clamp(160px,24vh,230px);margin-top:clamp(8px,2vw,18px)}.rule-button{position:absolute;right:0;bottom:0;display:grid;place-items:center;width:58px;height:34px;border:1px solid #171411;padding:0;background:transparent;color:#171411;cursor:pointer}.rule-button span{font-size:14px;line-height:1}.rule-button[aria-expanded=true]{border-color:#b7342b;color:#b7342b}.streak{position:absolute;right:0;top:50%;min-width:1.4em;padding-left:14px;background:#fbfaf6;color:#277e48;font-size:clamp(28px,6vw,48px);font-weight:300;line-height:1;text-align:right;transform:translateY(-50%)}.streak.loss{color:#b7342b}.table{grid-row:2;display:grid;grid-template-rows:minmax(0,1fr) minmax(34px,.16fr) minmax(0,1fr);align-items:center;width:min(820px,100%);min-height:clamp(360px,56vh,620px)}.side{min-width:0;text-align:center}.move{position:relative;display:inline-grid;place-items:center;min-width:1.3em;margin:0;color:#171411;font-size:clamp(72px,16vw,178px);font-weight:300;line-height:.96;letter-spacing:-.06em;text-align:center;white-space:nowrap}.move.attack,.move.reflect{max-width:100%;min-width:0;font-size:clamp(72px,16vw,178px);letter-spacing:-.12em}.move.attack{--attack-animation: attack-iai;--attack-color: #b7342b;--attack-back-y: 10px;--attack-short-y: -30px;--attack-mid-y: -52px;--attack-far-y: -82px;--attack-long-y: -96px;--attack-long-back-y: 14px;--attack-return-y: -10px;--attack-duration: .56s}.side.opponent .move.attack{--attack-back-y: -10px;--attack-short-y: 30px;--attack-mid-y: 52px;--attack-far-y: 82px;--attack-long-y: 96px;--attack-long-back-y: -14px;--attack-return-y: 10px}.move.attack-level-1{--attack-animation: attack-iai;--attack-color: #a92d24;--attack-duration: .36s}.move.attack-level-2{--attack-animation: attack-two-finger;--attack-color: #b7342b;--attack-duration: .43s}.move.attack-level-3{--attack-animation: attack-three-worlds;--attack-color: #c13f25;--attack-duration: .56s}.move.attack-level-4{--attack-animation: attack-four-seal;--attack-color: #9a4a1b;--attack-duration: .58s}.move.attack-level-5{--attack-animation: attack-five-tigers;--attack-color: #c1531a;--attack-duration: .6s}.move.attack-level-6{--attack-animation: attack-six-veins;--attack-color: #c42f2f;--attack-duration: .54s}.move.attack-level-7{--attack-animation: attack-seven-stars;--attack-color: #bd2550;--attack-duration: .66s}.move.attack-level-8{--attack-animation: attack-eight-phases;--attack-color: #a92362;--attack-duration: .7s}.move.attack-level-9{--attack-animation: attack-nine-dragon;--attack-color: #922e78;--attack-duration: .7s}.move.attack-level-10{--attack-animation: attack-cross;--attack-color: #7d3a86;--attack-duration: .64s}.move.attack-level-11{--attack-animation: attack-hundred-step;--attack-color: #68458f;--attack-duration: .62s}.move.attack-level-12{--attack-animation: attack-thousand-birds;--attack-color: #4a5594;--attack-duration: .62s}.move.attack-level-13{--attack-animation: attack-ten-thousand-swords;--attack-color: #b7342b;--attack-duration: .78s}.move.break{color:#b7342b}.net{position:relative;display:grid;place-items:center;width:100%;min-height:clamp(34px,6vh,58px)}.net:before{content:"";position:absolute;inset-inline:0;height:1px;background:#171411;opacity:.22}.table.did-clash .net:before{animation:clash-color .52s ease-out}.side.gain .move{animation:gain-color .56s ease-out}.side.block .move{animation:block-color .56s ease-out}.side.counter .move{animation:counter-color .62s ease-out}.side.missed .move{animation:miss-color .52s ease-out}.side.did-attack .move.attack{animation:var(--attack-animation) var(--attack-duration) cubic-bezier(.12,.86,.18,1) both}.side.hit .move.attack{animation-duration:calc(var(--attack-duration) + 80ms)}.side.stopped .move.attack{animation-duration:calc(var(--attack-duration) - 60ms)}.controls{display:grid;grid-template-areas:". attack side" ". gap side" ". charge side";grid-template-columns:1fr minmax(96px,150px) 1fr;grid-template-rows:auto clamp(26px,7vw,54px) auto;align-items:center;width:min(640px,100%);min-height:clamp(160px,24vh,230px);margin:0 auto}.side-actions{grid-area:side;display:grid;gap:clamp(18px,4vw,32px);justify-self:start}.action,.stamp{border:0;padding:0;background:transparent;color:#171411}.action{display:grid;justify-items:center;line-height:1;cursor:pointer;transition:opacity .1s ease,transform .1s ease}.action.attack{grid-area:attack}.action.charge{grid-area:charge}.controls.is-finished{grid-template-areas:". restart .";grid-template-columns:1fr minmax(120px,180px) 1fr;grid-template-rows:1fr}.action.restart{grid-area:restart;align-self:center}.action span{font-size:clamp(38px,8vw,64px);font-weight:300;letter-spacing:-.05em}.action.defend span,.action.reflect span{font-size:clamp(24px,4.8vw,38px)}.action:after{content:"";width:0;height:1px;margin-top:7px;background:#171411;transition:width .1s ease}.action:hover:not(:disabled),.action:focus-visible:not(:disabled){transform:translateY(-1px);outline:none}.stamp:focus-visible{outline:1px solid currentColor;outline-offset:8px}.action:hover:not(:disabled):after,.action:focus-visible:not(:disabled):after{width:2.2em}.action:disabled{cursor:default;opacity:.16}.stamp{position:fixed;left:50%;top:50%;z-index:6;display:grid;place-items:center;width:clamp(126px,25vw,210px);height:clamp(126px,25vw,210px);border:3px solid currentColor;border-radius:50%;color:#171411;font-size:clamp(70px,15vw,132px);font-weight:400;line-height:1;opacity:0;pointer-events:none;transform:translate(-50%,-50%) rotate(-12deg) scale(.72)}.stamp.is-visible{opacity:.92;animation:stamp .22s cubic-bezier(.18,.9,.25,1.2)}.stamp.ai{color:#b7342b}.stamp:before,.stamp:after{content:"";position:absolute;inset:8px;border:1px solid currentColor;border-radius:50%}.stamp:after{inset:17px;opacity:.5}.rulebook{position:fixed;left:50%;bottom:clamp(24px,6vh,58px);z-index:7;width:min(720px,calc(100% - 28px));padding:clamp(14px,3vw,24px);border:1px solid #171411;background:#fbfaf6f7;box-shadow:0 18px 80px #1714111a;transform:translate(-50%)}.rule-list{display:grid;gap:8px}.rule{display:grid;grid-template-columns:minmax(5em,.78fr) minmax(0,1fr);align-items:center;min-height:clamp(46px,7vw,62px);padding:0 clamp(16px,3vw,28px);border-bottom:1px solid rgba(23,20,17,.16);color:#171411}.rule b,.rule span{font-size:clamp(22px,4vw,34px);font-weight:300;line-height:1.05;white-space:nowrap}.rule span{justify-self:end;color:#5f574f}.rule.break span,.rule.danger span{color:#b7342b}.resolving-screen .table{grid-row:2}@keyframes stamp{0%{opacity:0;transform:translate(-50%,-50%) rotate(-12deg) scale(1.35)}to{opacity:.92;transform:translate(-50%,-50%) rotate(-12deg) scale(.72)}}@keyframes attack-iai{0%,to{color:#171411;transform:translate(0)}12%{color:#171411;transform:translateY(var(--attack-back-y))}28%,38%{color:var(--attack-color);transform:translateY(var(--attack-far-y))}58%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-two-finger{0%,to{color:#171411;transform:translate(0)}16%{color:#171411;transform:translate(-3px,var(--attack-back-y))}30%{color:var(--attack-color);transform:translate(2px,var(--attack-short-y))}40%{color:var(--attack-color);transform:translate(-1px,var(--attack-short-y))}62%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-three-worlds{0%,to{color:#171411;transform:translate(0)}14%{color:#171411;transform:translateY(var(--attack-back-y))}28%{color:var(--attack-color);transform:translate(-16px,var(--attack-short-y))}42%{color:var(--attack-color);transform:translate(16px,var(--attack-mid-y))}56%{color:var(--attack-color);transform:translateY(var(--attack-far-y))}72%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-four-seal{0%,to{color:#171411;transform:translate(0)}18%{color:#171411;transform:translateY(var(--attack-back-y))}36%,58%{color:var(--attack-color);transform:translateY(var(--attack-mid-y))}74%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-five-tigers{0%,to{color:#171411;transform:translate(0)}14%{color:#171411;transform:translateY(var(--attack-back-y))}28%{color:var(--attack-color);transform:translate(-18px,var(--attack-short-y))}42%{color:var(--attack-color);transform:translate(12px,var(--attack-mid-y))}56%{color:var(--attack-color);transform:translate(-6px,var(--attack-far-y))}72%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-six-veins{0%,to{color:#171411;transform:translate(0)}12%{color:#171411;transform:translateY(var(--attack-back-y))}24%{color:var(--attack-color);transform:translate(-6px,var(--attack-short-y))}34%,48%{color:var(--attack-color);transform:translateY(var(--attack-far-y))}64%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-seven-stars{0%,to{color:#171411;transform:translate(0)}12%{color:#171411;transform:translateY(var(--attack-back-y))}24%{color:var(--attack-color);transform:translate(-18px,var(--attack-short-y))}34%{color:var(--attack-color);transform:translate(-8px,var(--attack-mid-y))}44%{color:var(--attack-color);transform:translate(8px,var(--attack-mid-y))}54%{color:var(--attack-color);transform:translate(18px,var(--attack-far-y))}70%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-eight-phases{0%,to{color:#171411;transform:translate(0)}12%{color:#171411;transform:translateY(var(--attack-back-y))}22%{color:var(--attack-color);transform:translate(14px,var(--attack-short-y))}32%{color:var(--attack-color);transform:translate(-14px,var(--attack-short-y))}42%{color:var(--attack-color);transform:translate(10px,var(--attack-mid-y))}52%{color:var(--attack-color);transform:translate(-10px,var(--attack-mid-y))}62%{color:var(--attack-color);transform:translateY(var(--attack-far-y))}78%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-nine-dragon{0%,to{color:#171411;transform:translate(0)}14%{color:#171411;transform:translateY(var(--attack-back-y))}26%{color:var(--attack-color);transform:translate(-20px,var(--attack-short-y))}40%{color:var(--attack-color);transform:translate(20px,var(--attack-mid-y))}54%{color:var(--attack-color);transform:translate(-10px,var(--attack-far-y))}68%{color:var(--attack-color);transform:translate(8px,var(--attack-return-y))}}@keyframes attack-cross{0%,to{color:#171411;transform:translate(0)}14%{color:#171411;transform:translateY(var(--attack-back-y))}30%{color:var(--attack-color);transform:translate(-22px,var(--attack-short-y))}46%{color:var(--attack-color);transform:translate(22px,var(--attack-short-y))}60%{color:var(--attack-color);transform:translateY(var(--attack-far-y))}76%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-hundred-step{0%,to{color:#171411;transform:translate(0)}18%{color:#171411;transform:translateY(var(--attack-long-back-y))}36%,52%{color:var(--attack-color);transform:translateY(var(--attack-long-y))}70%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-thousand-birds{0%,to{color:#171411;transform:translate(0)}12%{color:#171411;transform:translateY(var(--attack-back-y))}22%{color:var(--attack-color);transform:translate(-6px,var(--attack-short-y))}30%{color:var(--attack-color);transform:translate(6px,var(--attack-mid-y))}38%{color:var(--attack-color);transform:translate(-4px,var(--attack-mid-y))}48%,60%{color:var(--attack-color);transform:translateY(var(--attack-long-y))}76%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes attack-ten-thousand-swords{0%,to{color:#171411;transform:translate(0)}14%{color:#171411;transform:translateY(var(--attack-back-y))}28%{color:var(--attack-color);transform:translate(-24px,var(--attack-short-y))}42%{color:var(--attack-color);transform:translate(24px,var(--attack-short-y))}56%,68%{color:var(--attack-color);transform:translateY(var(--attack-long-y))}84%{color:var(--attack-color);transform:translateY(var(--attack-return-y))}}@keyframes gain-color{0%,to{color:#171411}32%{color:#277e48}}@keyframes block-color{0%,to{color:#171411}34%{color:#305684}}@keyframes counter-color{0%,to{color:#171411}38%{color:#8a5a0a}}@keyframes miss-color{0%,to{color:#171411}30%{color:#b7342b}}@keyframes clash-color{0%,to{background:#171411;opacity:.22}35%{background:#b7342b;opacity:.7}}@media(max-width:680px){.paper{padding-inline:14px}.player-panel{width:min(520px,100%)}.rule-button{right:0;width:54px}.table{grid-template-rows:minmax(0,1fr) minmax(28px,.12fr) minmax(0,1fr);min-height:clamp(340px,56vh,520px)}.move{font-size:clamp(54px,22vw,116px)}.controls{grid-template-columns:1fr minmax(76px,112px) 1fr}.side-actions{gap:16px}.rule{grid-template-columns:1fr;gap:6px;justify-items:center;min-height:64px;padding:10px 14px}.rule span{justify-self:center}}
