html{color-scheme:dark;background:#000;color:#eee;font:16px system-ui,sans-serif}body{display:grid;min-height:100vh;min-height:100dvh;margin:0;place-items:center}#game{position:relative;display:grid;width:min(100vw,133.333333vh);width:min(100vw,133.333333dvh);aspect-ratio:4 / 3;place-items:center}#stage{position:absolute;inset:0;width:100%;height:100%}#status,noscript{z-index:1;max-width:80%;text-align:center}[hidden]{display:none}#stage:focus{outline:none}#stage:focus-visible:not(.pointer-focus){outline:1px solid #eee;outline-offset:-1px}@font-face{font-family:Trajan49;src:url(./assets/fonts/49_Trajan\ Pro.woff2) format("woff2")}@font-face{font-family:FangSong61;src:url(./assets/fonts/61_FangSong.woff2) format("woff2")}@font-face{font-family:Kai65;src:url(./assets/fonts/65_DFKai-SB.woff2) format("woff2")}@font-face{font-family:Ming70;src:url(./assets/fonts/70_MingLiU.woff2) format("woff2")}@font-face{font-family:SimSun72;src:url(./assets/fonts/72_NSimSun.woff2) format("woff2")}@font-face{font-family:Trajan765;src:url(./assets/fonts/765_Trajan\ Pro.woff2) format("woff2")}@font-face{font-family:Script768;src:url(./assets/fonts/768_AdineKirnberg-Script.woff2) format("woff2")}:root{--net-ink: #120c03;--net-wood: #8a6c2e;--net-wood-light: #a3843f;--net-wood-dark: #5e4718;--net-slot: #33260b;--net-gold: #ffcc00;--net-gold-soft: #ffe48a;--net-text: #fff1c4;--net-muted: #f1dca0;--net-fire: #ff6a1f;--net-water: #3fc4ff;--net-danger: #ff9b84;--net-font: "STFangsong", "FangSong", "FangSong_GB2312", "\4eff\5b8b", "Songti SC", "STSong", "SimSun", serif;--net-title-font: "Songti SC", "STSong", "SimSun", "\5b8b\4f53", "Noto Serif CJK SC", serif;--net-glow: 0 0 1px var(--net-ink), 0 0 2px var(--net-ink), 0 0 4px rgba(0, 0, 0, .85)}#game{container-type:inline-size}#net-ui{position:absolute;inset:0;z-index:2;pointer-events:none;font-family:var(--net-font);font-size:clamp(11px,2.3cqw,17px);font-weight:600;color:var(--net-text);text-shadow:var(--net-glow)}#net-ui [hidden]{display:none!important}#net-ui.panel-open{pointer-events:auto;background:radial-gradient(ellipse at center,#00000040,#0009)}#net-ui button,#net-ui input{font:inherit;color:inherit;text-shadow:inherit}#net-ui button{cursor:pointer;border:2px solid var(--net-ink);border-radius:.3em .55em .35em .6em/.55em .3em .6em .35em;background:repeating-linear-gradient(176deg,rgba(255,230,150,.07) 0 .18em,transparent .18em .5em),linear-gradient(var(--net-wood-light),var(--net-wood) 55%,var(--net-wood-dark));box-shadow:inset 0 2px #ffe8a059,inset 0 -3px #00000047,0 2px #00000073;color:var(--net-gold);padding:.35em .9em;letter-spacing:.12em;transition:filter .12s,transform .08s,text-shadow .12s}#net-ui button:hover:not(:disabled){filter:brightness(1.08);text-shadow:0 0 2px var(--net-ink),0 0 6px #fff,0 0 12px rgba(255,255,255,.7)}#net-ui button:active:not(:disabled){transform:translateY(1px) scale(.98)}#net-ui button:disabled{cursor:default;filter:grayscale(.6) brightness(.8);opacity:.7}#net-ui button:focus-visible,#net-ui input:focus-visible{outline:2px solid var(--net-gold-soft);outline-offset:2px}#net-ui input{min-width:0;border:2px solid var(--net-ink);border-radius:.35em;background:linear-gradient(rgba(0,0,0,.25),transparent 40%),var(--net-slot);box-shadow:inset 0 3px 4px #0009,0 1px #ffe8a04d;color:var(--net-gold-soft);padding:.35em .6em;caret-color:var(--net-gold)}#net-ui input::placeholder{color:#f1dca073;text-shadow:none}.net-panel{position:absolute;top:50%;left:50%;width:min(27em,90%);max-height:94%;overflow:auto;scrollbar-width:none;transform:translate(-50%,-50%);box-sizing:border-box;padding:.6em 1.1em .8em;border:solid transparent;border-width:2.2em 2.3em 2.1em;border-image:url(./assets/ui/board.png) 70 72 66 fill / 2.2em 2.3em 2.1em stretch;filter:drop-shadow(0 .6em 1.2em rgba(0,0,0,.7));pointer-events:auto;text-align:center;animation:net-drop .22s ease-out}@keyframes net-drop{0%{opacity:0;transform:translate(-50%,-56%) scale(.96)}}.net-panel h2{margin:0 0 .35em;font-family:var(--net-title-font);color:var(--net-gold);font-size:1.7em;letter-spacing:.35em;text-indent:.35em;text-shadow:0 1px 0 #fff2a8,0 0 2px var(--net-ink),0 0 3px var(--net-ink),0 0 8px rgba(0,0,0,.9)}#net-ui .net-close{position:absolute;top:0;right:0;width:1.7em;height:1.7em;padding:0;border-radius:50%;font-size:1.15em;line-height:1;letter-spacing:0}.net-note{margin:0 0 .5em;color:var(--net-muted);font-size:.85em;line-height:1.5}.net-lobby,.net-room{display:grid;gap:.55em}.net-field{display:grid;grid-template-columns:auto 1fr;gap:.6em;align-items:center;text-align:left;color:var(--net-gold)}#net-ui .net-primary{font-size:1.12em;padding:.4em .9em;letter-spacing:.3em}.net-divider{display:flex;align-items:center;gap:.6em;color:var(--net-muted);font-size:.8em}.net-divider:before,.net-divider:after{content:"";flex:1;height:2px;border-radius:1px;background:var(--net-ink);box-shadow:0 1px #ffe8a04d}.net-join-row{display:grid;grid-template-columns:1fr auto;gap:.5em}#net-code{text-align:center;letter-spacing:.4em;font-size:1.15em}.net-label{color:var(--net-muted);font-size:.85em;letter-spacing:.2em}.net-digits{justify-self:center;min-width:6.2em;padding:.05em .4em .1em .65em;border:2px solid var(--net-ink);border-radius:.3em;background:linear-gradient(rgba(0,0,0,.3),transparent 45%),var(--net-slot);box-shadow:inset 0 3px 5px #000000a6,0 1px #ffe8a04d;color:var(--net-gold);font-family:Georgia,"Times New Roman",var(--net-title-font);font-variant-numeric:lining-nums tabular-nums;font-size:2.5em;letter-spacing:.25em;line-height:1.15;text-shadow:0 0 2px var(--net-ink),0 0 10px rgba(255,204,0,.45)}.net-seats{display:grid;grid-template-columns:1fr 1fr;gap:.5em;margin:.15em 0;padding:0;list-style:none}.net-seat{display:grid;grid-template-rows:auto auto auto;justify-items:center;gap:.1em;padding:.4em .3em .45em;border:2px solid var(--net-ink);border-radius:.4em;background:#281c066b;box-shadow:inset 0 2px 4px #00000073;min-width:0}.net-head{width:2.6em;height:2.6em;background:center / contain no-repeat;filter:drop-shadow(0 2px 2px rgba(0,0,0,.5))}.net-seat.role-1 .net-head{background-image:url(./assets/ui/fire-head.png)}.net-seat.role-2 .net-head{background-image:url(./assets/ui/water-head.png)}.net-seat.empty .net-head{filter:grayscale(1) brightness(.45);opacity:.6}.net-seat.role-1.you{border-color:var(--net-fire)}.net-seat.role-2.you{border-color:var(--net-water)}.net-seat-role{font-size:1.05em;letter-spacing:.2em;text-indent:.2em}.net-seat-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--net-text);font-size:.85em}.net-seat.empty .net-seat-name{color:var(--net-muted);opacity:.8}.role-1{color:var(--net-fire)}.role-2{color:var(--net-water)}.net-seat.role-1,.net-seat.role-2{color:var(--net-text)}.net-seat.role-1 .net-seat-role{color:var(--net-fire)}.net-seat.role-2 .net-seat-role{color:var(--net-water)}.net-actions{display:grid;grid-template-columns:1fr 1fr;gap:.5em}.net-message{min-height:1.2em;margin:.5em 0 0;color:var(--net-muted);font-size:.85em}.net-message.error{color:var(--net-danger)}.net-message.notice{color:var(--net-gold)}.net-chat{position:absolute;right:1.2%;bottom:1.5%;width:min(36%,22em);display:grid;gap:.3em;pointer-events:none}#net-ui.touching .net-chat{bottom:25%}.net-log{max-height:8.5em;overflow-y:auto;margin:0;padding:0;list-style:none;font-size:.9em;line-height:1.4;scrollbar-width:none;text-shadow:0 0 1px #000,0 0 2px #000,0 0 3px #000,0 1px 3px #000}.net-log li{padding:.05em .3em;opacity:0;transition:opacity .6s;overflow-wrap:anywhere}.net-log li.fresh,.net-chat.open .net-log li,.net-chat:hover .net-log li{opacity:1}.net-chat.open .net-log,.net-chat:hover .net-log{pointer-events:auto}.net-log li.system{color:var(--net-gold)}.net-chat-form{display:grid;grid-template-columns:1fr auto;gap:.3em;pointer-events:auto;opacity:.55;transition:opacity .2s}.net-chat-form:hover,.net-chat.open .net-chat-form{opacity:1}#net-ui .net-chat-form input{font-size:.85em}#net-ui .net-chat-form button{font-size:.85em;padding:.2em .7em}.net-touch{position:absolute;inset:auto 0 2%;height:22%;pointer-events:none}#net-ui .net-pad{position:absolute;bottom:0;width:15%;aspect-ratio:1;padding:0;border-width:3px;border-radius:50%;opacity:.8;font-size:1.6em;letter-spacing:0;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none}#net-ui .net-pad.down{opacity:1;filter:brightness(1.25);transform:scale(.94)}.net-pad-left{left:2%}.net-pad-right{left:19%}.net-pad-up{right:3%}@media(prefers-reduced-motion:reduce){.net-panel{animation:none}}