html,body{margin:0;height:100%;background:#0e1a12;overflow:hidden}#game{width:100vw;height:100vh;height:100dvh}canvas{display:block;touch-action:none}.pc-menu{position:fixed;inset:0;z-index:10;display:flex;align-items:center;justify-content:center;background:#00000052;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);font-family:Segoe UI,system-ui,Arial,sans-serif;color:#eaf3ec;touch-action:auto;animation:pc-fade .22s ease both}.pc-menu.pc-hidden{display:none}@keyframes pc-fade{0%{opacity:0}to{opacity:1}}.pc-panel{--pad: clamp(14px, 2.6vmin, 24px);box-sizing:border-box;width:min(94vw,620px);max-height:92vh;display:flex;flex-direction:column;overflow:hidden;border-radius:clamp(16px,2.4vmin,26px);border:1px solid rgba(255,255,255,.12);background:linear-gradient(160deg,#12301f,#0d2417 55%,#0a1a11);box-shadow:0 24px 70px #0000008c,inset 0 1px #ffffff0f;animation:pc-pop .28s cubic-bezier(.2,.9,.3,1.2) both}.pc-panel-wide{width:min(94vw,1200px)}@keyframes pc-pop{0%{transform:scale(.94);opacity:0}to{transform:scale(1);opacity:1}}.pc-head{display:flex;align-items:center;gap:12px;padding:var(--pad) var(--pad) calc(var(--pad) * .5)}.pc-titles{flex:1;min-width:0;text-align:center}.pc-menu-flag{flex:none;width:clamp(38px,7vmin,52px);height:clamp(38px,7vmin,52px);border-radius:50%;object-fit:cover;box-shadow:0 2px 8px #00000073,inset 0 0 0 2px #ffffff24}.pc-flag-btn{flex:none;display:block;padding:0;border:none;background:none;border-radius:50%;cursor:pointer;line-height:0;transition:transform .08s ease,filter .15s ease}.pc-flag-btn:hover{transform:scale(1.08);filter:brightness(1.08)}.pc-flag-btn:active{transform:scale(.96)}.pc-flag-btn:focus-visible{outline:2px solid rgba(123,224,138,.7);outline-offset:3px}.pc-title{margin:0;font-size:clamp(26px,5.2vmin,52px);font-weight:900;letter-spacing:-.02em;line-height:1;background:linear-gradient(90deg,#ffe14d,#7be08a 60%,#5bc0ff);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 2px 10px rgba(0,0,0,.35)}.pc-tagline{margin:6px 0 0;font-size:clamp(11px,1.7vmin,15px);letter-spacing:.16em;text-transform:uppercase;color:#86a793}.pc-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:6px var(--pad);-webkit-overflow-scrolling:touch}.pc-body::-webkit-scrollbar{width:9px}.pc-body::-webkit-scrollbar-thumb{background:#ffffff29;border-radius:999px}.pc-body-2col{display:flex;gap:var(--pad);overflow:hidden}.pc-body-col{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.pc-col-game{flex:1 1 0}.pc-editor-col{flex:1.7 1 0}.pc-col-title{margin:0;text-align:center;font-weight:900;font-size:clamp(13px,1.9vmin,16px);letter-spacing:.12em;text-transform:uppercase;color:#9fdcb0}.pc-map-top{display:flex;align-items:stretch;gap:var(--pad)}.pc-map-top>.pc-map-controls{flex:0 1 260px}.pc-map-top>.pc-options{flex:1 1 0;min-width:0;margin:0}.pc-map-controls{display:flex;flex-direction:column;gap:8px}.pc-map-name-row{display:flex;flex:1}.pc-map-name{flex:1;min-width:0;height:100%;box-sizing:border-box;padding:8px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:#0a1a1299;color:#eafff0;font:inherit;font-size:clamp(15px,2.4vmin,20px);text-align:center}.pc-map-name:hover{border-color:#7be08a66}.pc-map-name:focus-visible{outline:2px solid #7be08a;outline-offset:1px}.pc-map-btns{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;flex:1;grid-auto-rows:1fr}.pc-map-btn{display:flex;align-items:center;justify-content:center;padding:9px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.18);background:#ffffff12;color:#dfeee4;font:inherit;font-weight:700;font-size:clamp(13px,1.8vmin,15px);cursor:pointer;transition:background .15s ease,transform .05s ease}.pc-map-btn:hover{background:#ffffff21}.pc-map-btn:active{transform:translateY(1px) scale(.99)}.pc-map-btn:focus-visible{outline:2px solid #7be08a;outline-offset:1px}.pc-maplist{display:flex;flex-direction:column;gap:8px;padding:6px 0 4px}.pc-maplist-item{padding:14px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.12);background:#ffffff0d;color:#eaf3ec;font:inherit;font-weight:700;font-size:clamp(15px,2.1vmin,18px);text-align:left;cursor:pointer;transition:background .12s ease,border-color .12s ease,transform .05s ease}.pc-maplist-item:hover{background:#7be08a1f;border-color:#7be08a80}.pc-maplist-item:active{transform:translateY(1px) scale(.995)}.pc-maplist-item:focus-visible{outline:none;border-color:#7be08a;box-shadow:inset 0 0 0 2px #7be08a}.pc-editor{display:flex;align-items:center;gap:10px}.pc-editor-svg{display:block;flex:1 1 0;min-width:0;height:auto;max-height:46vh;touch-action:none;overflow:visible}.pc-ed-ref{fill:#ffffff08;stroke:#ffffff2e;stroke-width:3;stroke-dasharray:14 12;vector-effect:non-scaling-stroke}.pc-ed-outline{fill:#39d35324;stroke:#7be08a;stroke-width:3;stroke-linejoin:round;vector-effect:non-scaling-stroke}.pc-ed-handle{fill:#fff;stroke:#17402a;stroke-width:2;vector-effect:non-scaling-stroke;cursor:grab}.pc-ed-handle:active{cursor:grabbing}.pc-ed-handle:hover{fill:#ffe14d}.pc-ed-corner{fill:#5bc0ff}.pc-ed-corner:hover{fill:#9ad8ff}.pc-ed-goal{fill:#ffb64d}.pc-ed-goal:hover{fill:#ffcd85}.pc-ed-readout{fill:#fff;font:900 90px system-ui,sans-serif;text-anchor:middle;dominant-baseline:central;paint-order:stroke;stroke:#0000008c;stroke-width:6;stroke-linejoin:round;pointer-events:none}.pc-ed-griddot{fill:#dce0eb66;pointer-events:none}.pc-ed-player{cursor:grab}.pc-ed-player:active{cursor:grabbing}.pc-ed-player-hit{fill:transparent}.pc-ed-player-flag{pointer-events:none}.pc-ed-ball{fill:#fff;stroke:#00000059;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}.pc-ed-player-ring{fill:none;stroke:#ffffffe6;stroke-width:1.5;vector-effect:non-scaling-stroke;pointer-events:none}.pc-ed-tree,.pc-ed-patch{cursor:grab}.pc-ed-tree:active,.pc-ed-patch:active{cursor:grabbing}.pc-ed-tree-hit,.pc-ed-patch-hit{fill:transparent}.pc-ed-palette{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;flex:none}.pc-ed-palette-item{width:50px;height:50px;flex:none;cursor:grab;touch-action:none}.pc-ed-palette-item:active{cursor:grabbing}@media (max-width: 1100px){.pc-map-top{flex-direction:column}.pc-map-top>.pc-map-controls{flex:none}.pc-editor-svg{max-height:36vh}}@media (max-width: 720px){.pc-body-2col{flex-direction:column;overflow-y:auto}.pc-body-col{overflow:visible}.pc-editor{min-height:220px}}.pc-options{max-width:680px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.8vmin,16px);padding:6px 0 2px}.pc-options-compact{max-width:none;gap:8px;padding:2px 0}.pc-options-1col{grid-template-columns:1fr}.pc-options-2col{grid-template-columns:repeat(2,1fr)}.pc-options-3col{grid-template-columns:repeat(3,1fr)}.pc-options-compact .pc-opt{padding:6px 9px;border-radius:10px}.pc-options-compact .pc-opt-top{gap:6px}.pc-options-compact .pc-opt-label{font-size:clamp(10px,1.35vmin,12px);white-space:nowrap;min-width:0;overflow:hidden;text-overflow:ellipsis}.pc-options-compact .pc-opt-value{font-size:clamp(10px,1.3vmin,12px);white-space:nowrap;flex:none}.pc-select{width:100%;padding:3px 8px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:#0a1a1299;color:#eafff0;font:inherit;font-size:clamp(12px,1.6vmin,14px);cursor:pointer}.pc-select:hover{border-color:#7be08a66}.pc-select:focus-visible{outline:2px solid #7be08a;outline-offset:1px}.pc-options-compact .pc-range{height:18px}@media (max-width: 480px){.pc-options{grid-template-columns:1fr}}.pc-opt{background:#ffffff0b;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:9px 12px}.pc-opt-disabled{opacity:.4}.pc-opt-disabled .pc-range{pointer-events:none}.pc-opt-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:2px}.pc-opt-label{font-weight:600;font-size:clamp(14px,2vmin,17px);color:#eaf3ec}.pc-opt-value{font-variant-numeric:tabular-nums;font-weight:700;font-size:clamp(13px,1.9vmin,16px);color:#ffe14d}.pc-range{-webkit-appearance:none;appearance:none;width:100%;height:22px;background:transparent;cursor:pointer;margin:0}.pc-range::-webkit-slider-runnable-track{height:8px;border-radius:999px;background:linear-gradient(90deg,#39d353,#2f6fe2);box-shadow:inset 0 1px 2px #00000059}.pc-range::-moz-range-track{height:8px;border-radius:999px;background:linear-gradient(90deg,#39d353,#2f6fe2)}.pc-range::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;margin-top:-7px;border-radius:50%;background:#fff;border:2px solid #17402a;box-shadow:0 2px 6px #0006;transition:transform .06s ease}.pc-range::-webkit-slider-thumb:active{transform:scale(1.12)}.pc-range::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid #17402a;box-shadow:0 2px 6px #0006}.pc-range:focus-visible{outline:none}.pc-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px #7be08a66}.pc-foot{padding:calc(var(--pad) * .6) var(--pad) var(--pad)}.pc-start{display:block;width:100%;max-width:560px;margin:0 auto;padding:clamp(12px,2.2vmin,18px);border:none;border-radius:14px;font:inherit;font-weight:800;font-size:clamp(16px,2.6vmin,22px);letter-spacing:.02em;color:#06210f;background:linear-gradient(180deg,#7be08a,#39d353);box-shadow:0 8px 20px #39d3534d,inset 0 1px #ffffff80;cursor:pointer;transition:filter .15s ease,transform .05s ease}.pc-start:hover{filter:brightness(1.06)}.pc-start:active{transform:translateY(1px) scale(.99)}.pc-start-ready{color:#fff;background:linear-gradient(180deg,#ff6b6b,#e03131);box-shadow:0 8px 20px #e0313161,inset 0 1px #fff6;animation:pc-start-ready-pulse 1.2s ease-in-out infinite}@keyframes pc-start-ready-pulse{0%,to{box-shadow:0 8px 20px #e0313161,inset 0 1px #fff6}50%{box-shadow:0 8px 30px #e03131bf,inset 0 1px #ffffff80}}@media (prefers-reduced-motion: reduce){.pc-start-ready{animation:none}}.pc-foot-row{display:flex;align-items:center;gap:12px}.pc-foot-row .pc-start{flex:1 1 auto;margin:0;max-width:none}.pc-about-btn{flex:none;width:clamp(42px,6vmin,52px);height:clamp(42px,6vmin,52px);border-radius:50%;border:1px solid rgba(255,255,255,.22);background:#ffffff12;color:#dfeee4;font-family:Georgia,Times New Roman,serif;font-style:italic;font-weight:700;font-size:clamp(20px,2.8vmin,26px);line-height:1;cursor:pointer;transition:background .15s ease,transform .05s ease}.pc-about-btn:hover{background:#ffffff24}.pc-about-btn:active{transform:translateY(1px) scale(.96)}.pc-about-btn:focus-visible{outline:2px solid #7be08a;outline-offset:2px}.pc-about-overlay{position:fixed;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:clamp(12px,3vw,32px);background:#00000080;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);animation:pc-fade .2s ease both}.pc-about-overlay.pc-hidden{display:none}.pc-about-panel{position:relative;width:min(96vw,820px);height:min(90vh,880px);border-radius:clamp(14px,2vmin,20px);overflow:hidden;border:1px solid rgba(255,255,255,.12);background:#0a1a11;box-shadow:0 24px 70px #0000008c;animation:pc-pop .26s cubic-bezier(.2,.9,.3,1.2) both}.pc-about-frame{display:block;width:100%;height:100%;border:0}.pc-about-close{position:absolute;top:16px;right:12px;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;border:1px solid rgba(255,255,255,.25);background:#0a1a12b8;color:#eaf3ec;font-size:20px;line-height:1;cursor:pointer;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);box-shadow:0 4px 14px #0006;transition:background .15s ease,transform .05s ease}.pc-about-close:hover{background:#ffffff29}.pc-about-close:active{transform:scale(.94)}.pc-about-close:focus-visible{outline:2px solid #7be08a;outline-offset:2px}.pc-panel-compact{width:min(90vw,380px)}.pc-foot-stack{display:flex;flex-direction:column;gap:12px}.pc-options-inline{max-width:none;padding:0}.pc-btn-quit{display:block;width:100%;max-width:560px;margin:0 auto;padding:clamp(12px,2.2vmin,18px);border:1px solid rgba(255,89,82,.35);border-radius:14px;font:inherit;font-weight:800;font-size:clamp(16px,2.6vmin,22px);letter-spacing:.02em;color:#ffd9d5;background:#ff3b3024;cursor:pointer;transition:background .15s ease,transform .05s ease}.pc-btn-quit:hover{background:#ff3b303d}.pc-btn-quit:active{transform:translateY(1px) scale(.99)}.pc-btn-neutral{display:block;width:100%;max-width:560px;margin:0 auto;padding:clamp(12px,2.2vmin,18px);border:1px solid rgba(255,255,255,.18);border-radius:14px;font:inherit;font-weight:800;font-size:clamp(16px,2.6vmin,22px);letter-spacing:.02em;color:#dfeee4;background:#ffffff12;cursor:pointer;transition:background .15s ease,transform .05s ease}.pc-btn-neutral:hover{background:#ffffff21}.pc-btn-neutral:active{transform:translateY(1px) scale(.99)}.pc-menu-top{z-index:20}.pc-flag-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:10px;padding:6px 0 4px}.pc-flag{aspect-ratio:1 / 1;padding:0;border:none;border-radius:50%;background:#ffffff0d;cursor:pointer;line-height:0;box-shadow:inset 0 0 0 2px #ffffff1a;transition:transform .08s ease,box-shadow .12s ease}.pc-flag img{width:100%;height:100%;border-radius:50%;object-fit:cover}.pc-flag:hover{transform:scale(1.1);box-shadow:inset 0 0 0 2px #ffffff59,0 3px 10px #00000080}.pc-flag:active{transform:scale(.97)}.pc-flag-sel{box-shadow:inset 0 0 0 3px #7be08a,0 0 0 2px #7be08a80}.pc-flag:focus-visible{outline:none;box-shadow:inset 0 0 0 3px #7be08a}.pc-net-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:8px 10px;margin-bottom:12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:#ffffff0a}.pc-net-seg{display:inline-flex;border:1px solid rgba(255,255,255,.16);border-radius:9px;overflow:hidden;flex:none}.pc-net-mode{appearance:none;border:none;padding:7px 14px;font:inherit;font-weight:700;color:#ffffffb3;background:transparent;cursor:pointer}.pc-net-mode+.pc-net-mode{border-left:1px solid rgba(255,255,255,.14)}.pc-net-mode:hover{background:#ffffff12}.pc-net-mode-on{color:#0a1a11;background:linear-gradient(90deg,#7be08a,#5bc0ff)}.pc-net-detail{display:flex;flex-wrap:wrap;align-items:center;gap:8px;flex:1 1 260px;min-width:0}.pc-net-input{flex:1 1 120px;min-width:90px;padding:7px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:#0a1a1299;color:#eaf5ee;font:inherit;font-size:.9em}.pc-net-room-input{flex:0 1 110px}.pc-net-input:focus-visible{outline:none;border-color:#7be08a99}.pc-net-btn{appearance:none;padding:7px 14px;border-radius:8px;border:1px solid rgba(255,255,255,.18);background:#ffffff14;color:#eaf5ee;font:inherit;font-weight:700;cursor:pointer;flex:none}.pc-net-btn:hover{background:#ffffff24}.pc-net-btn-go{background:linear-gradient(90deg,#39d353,#2f6fe2);border-color:transparent;color:#fff}.pc-net-btn-dc{border-color:#ff787880;color:#ffb0b0}.pc-net-info{display:flex;flex-direction:column;gap:2px;flex:1 1 auto;min-width:0}.pc-net-actions{display:flex;flex-wrap:wrap;gap:8px;flex:none}.pc-net-room{font-weight:800;letter-spacing:.04em;color:#eaf5ee}.pc-net-status{font-size:.85em;color:#ffffff9e}.pc-net-label{flex:none;font-weight:700;color:#eaf5ee;white-space:nowrap}.pc-net-error{flex:1 1 100%;font-size:.85em;font-weight:600;color:#ffb0b0}.pc-net-error:empty{display:none}.pc-net-input-bad{border-color:#ff7878b3!important}.pc-locked{opacity:.5;pointer-events:none;filter:saturate(.6)}.pc-net-banner{position:fixed;top:0;left:0;right:0;z-index:40;padding:5px 12px;font-family:system-ui,sans-serif;font-size:13px;font-weight:700;letter-spacing:.01em;text-align:center;color:#fff;background:linear-gradient(90deg,#b91c1c,#dc2626);box-shadow:0 2px 10px #0006}.pc-net-banner.pc-hidden{display:none}@keyframes pc-flag-breathe{0%,to{box-shadow:0 0 0 2px #7be08a8c,0 0 10px 2px #7be08a59;transform:scale(1)}50%{box-shadow:0 0 0 3px #7be08af2,0 0 18px 6px #7be08a99;transform:scale(1.06)}}.pc-flag-pulse{border-radius:50%;animation:pc-flag-breathe 1.6s ease-in-out infinite}.pc-flag-pulse:hover{animation-play-state:paused}@media (prefers-reduced-motion: reduce){.pc-flag-pulse{animation:none;box-shadow:0 0 0 2px #7be08ab3}}
