@font-face{font-family:Proza;src:url(/proza-regular.woff2) format("woff2");font-weight:400 900;font-style:normal;font-display:swap}*{box-sizing:border-box}:root{color-scheme:dark;--bg: #0b2c4f;--panel: #123c66;--panel-2: #16466f;--line: #315b7d;--text: #eff8ff;--text-on-dark: #eff8ff;--muted: #a9c1d3;--accent: #245f89;--accent-2: #8dbbd4;--danger: #a84a3e;--ok: #2f8052;--cell: #505d70;--cell-line: rgba(230, 236, 244, .34);--board-rim: #0b2c4f;--board-rim-2: #123c66;--board-label: #d7e6ef;--board-shadow: rgba(19, 42, 66, .26);--control: #173e62;--ray-red: #de2e35;--ray-blue: #2b70ad;--ray-yellow: #f2bd43;--ray-white: #fbfaf7;--ray-green: #70b952;--ray-purple: #81378a;--ray-orange: #ec7334;--ray-pink: #ec878e;--ray-sky-blue: #86c6df;--ray-lemon: #f3df9d;--ray-light-purple: #9f5d9a;--ray-light-green: #c8da67;--ray-light-orange: #f0a071;--ray-gray: #585958;--ray-black: #17211d;--ray-clear: #b8b0a9;--ray-transparent: #8bc9bf;--ray-absorbed: #141714;font-family:Proza,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}html,body,#app{min-height:100%}html{background:var(--panel);-webkit-text-size-adjust:100%;text-size-adjust:100%;touch-action:manipulation}body{margin:0;background:var(--panel);color:var(--text);-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}button,input,select{font:inherit}input,textarea{-webkit-touch-callout:default;-webkit-user-select:text;user-select:text}button{border:0}.app{min-height:100vh;padding:18px}.topbar{align-items:center;display:flex;gap:12px;justify-content:space-between;margin:0 auto 14px;max-width:1180px}.brand{display:grid;gap:2px}.brand h1{font-size:clamp(1.25rem,2.4vw,1.8rem);line-height:1;margin:0}.brand span{color:var(--muted);font-size:.88rem}.top-actions{align-items:center;display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.new-game-dialog{background:transparent;border:0;color:var(--text);padding:0;width:min(420px,calc(100vw - 32px))}.new-game-dialog::backdrop{background:#07131ea3}.dialog-panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 22px 60px #07131e61;padding:16px}.dialog-header{align-items:center;display:flex;gap:12px;justify-content:space-between;margin-bottom:12px}.dialog-header h2{font-size:1rem;line-height:1.2;margin:0}.dialog-close{background:var(--control);border-radius:7px;color:var(--text-on-dark);cursor:pointer;display:grid;flex:0 0 36px;font-size:1.35rem;height:36px;line-height:1;padding:0;place-items:center;width:36px}.variant-grid{display:grid;gap:8px;grid-template-columns:1fr}.variant-button{background:var(--control);border:1px solid var(--line);border-radius:7px;color:var(--text-on-dark);cursor:pointer;font-weight:700;line-height:1.2;min-height:42px;padding:6px 12px}.variant-button:hover,.variant-button:focus-visible,.dialog-close:hover,.dialog-close:focus-visible{background:var(--accent)}.button,.segmented button,.tool-button,.piece-tool,.log-row,.edge-button,.tab-button{border-radius:7px;cursor:pointer}.button,.tool-button,.piece-tool{background:var(--control);color:var(--text-on-dark);min-height:42px;padding:0 14px}.button.primary,.tool-button.active,.tab-button.active{background:var(--accent);color:var(--text-on-dark);font-weight:700}.button.danger{background:var(--danger);color:#fff}.button:disabled{cursor:not-allowed;opacity:.55}.game-layout{display:grid;gap:16px;grid-template-columns:minmax(0,1fr) 340px;margin:0 auto;max-width:1180px}.app-footer{color:var(--muted);font-size:.78rem;margin:12px auto 0;max-width:1180px;text-align:right}.side-panel{background:var(--panel);border:1px solid var(--line);border-radius:8px;min-width:0;overflow:hidden}.panel-scroll{min-width:0}.tabs{display:none}.panel-section{border-bottom:1px solid var(--line);padding:16px}.panel-section:last-child{border-bottom:0}.panel-section h2{font-size:.95rem;margin:0 0 12px}.segmented{background:var(--panel-2);border:1px solid var(--line);border-radius:8px;display:inline-grid;grid-template-columns:repeat(2,1fr);padding:3px}.segmented button{background:transparent;color:var(--muted);min-height:36px;padding:0 12px}.segmented button.active{background:var(--accent);color:#07131e;font-weight:700}.control-grid,.piece-actions{display:grid;gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.piece-tools-wrap{position:relative}.piece-tools{align-items:center;display:flex;flex-wrap:wrap;gap:6px;overflow:visible;padding:2px}.piece-tool{display:grid;flex:0 0 var(--tool-width, 58px);height:42px;min-height:42px;padding:3px;place-items:center;width:var(--tool-width, 58px)}.piece-tool:disabled{cursor:not-allowed;opacity:.38}.piece-tool:disabled svg{filter:grayscale(1)}.piece-tool svg{height:var(--preview-height, 100%);max-height:100%;max-width:100%;width:var(--preview-width, 100%)}.piece-tool-separator{background:var(--line);flex:0 0 100%;height:1px;margin:2px 0}.mini-actions{margin-top:8px}.mini-actions .button{width:100%}.field-row{display:grid;gap:8px}.field-label{color:var(--muted);font-size:.86rem}.field-row input,.field-row select{background:#0d3156;border:1px solid var(--line);border-radius:7px;color:var(--text);min-height:42px;padding:0 10px}.field-row input{text-transform:uppercase;width:100%}.field-row select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 18px,calc(100% - 12px) 18px;background-repeat:no-repeat;background-size:6px 6px,6px 6px;width:100%}.toggle{align-items:center;display:flex;gap:10px;margin-top:12px}.toggle input{accent-color:var(--accent);height:20px;width:20px}.empty,.status{color:var(--muted);margin:0}.status.success{color:var(--ok)}.status.error{color:#b93f36}.swatch{background:var(--swatch, var(--ray-clear));border:1px solid rgba(23,33,29,.38);display:inline-block;height:18px;width:18px}[data-color=red]{--swatch: var(--ray-red)}[data-color=blue]{--swatch: var(--ray-blue)}[data-color=yellow]{--swatch: var(--ray-yellow)}[data-color=white]{--swatch: var(--ray-white)}[data-color=green]{--swatch: var(--ray-green)}[data-color=purple]{--swatch: var(--ray-purple)}[data-color=orange]{--swatch: var(--ray-orange)}[data-color=pink]{--swatch: var(--ray-pink)}[data-color=sky-blue]{--swatch: var(--ray-sky-blue)}[data-color=lemon]{--swatch: var(--ray-lemon)}[data-color=light-purple]{--swatch: var(--ray-light-purple)}[data-color=light-green]{--swatch: var(--ray-light-green)}[data-color=light-orange]{--swatch: var(--ray-light-orange)}[data-color=gray]{--swatch: var(--ray-gray)}[data-color=black]{--swatch: var(--ray-black)}[data-color=clear]{--swatch: var(--ray-clear)}[data-color=transparent]{--swatch: var(--ray-transparent)}[data-color=blackbody],[data-color=absorbed]{--swatch: var(--ray-absorbed)}@media(max-width:860px){html,body,#app{height:100%;min-height:0;overflow:hidden}body{overscroll-behavior:none}.app{display:grid;gap:10px;grid-template-rows:auto minmax(0,1fr) auto;height:100dvh;min-height:0;overflow:hidden;padding:calc(10px + env(safe-area-inset-top,0px)) calc(10px + env(safe-area-inset-right,0px)) calc(10px + env(safe-area-inset-bottom,0px)) calc(10px + env(safe-area-inset-left,0px))}.topbar{align-items:flex-start;margin:0 auto;width:100%}.game-layout{gap:10px;grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) clamp(150px,28vh,240px);height:100%;min-height:0;overflow:hidden;width:100%}.app-footer{margin:0 auto;text-align:center;width:100%}.side-panel{display:grid;grid-template-rows:auto minmax(0,1fr);min-height:0}.tabs{display:grid;grid-template-columns:repeat(3,1fr)}.tab-button{background:var(--panel-2);border-radius:0;color:var(--text);min-height:44px}.panel-scroll{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.panel-section{display:none}.panel-section.active{display:block}}.board-card{display:grid;gap:12px;justify-items:center;min-width:0;-webkit-touch-callout:none;-webkit-user-select:none;touch-action:none;user-select:none}.board-shell{--edge-size: clamp(32px, 7vw, 48px);aspect-ratio:var(--board-aspect);background:transparent;border:1px solid transparent;border-radius:4px;box-shadow:none;display:grid;grid-template-columns:var(--edge-size) repeat(var(--board-cols),1fr) var(--edge-size);grid-template-rows:var(--edge-size) repeat(var(--board-rows),1fr) var(--edge-size);max-height:calc(100vh - 120px);max-width:min(680px,100%);min-height:0;position:relative;-webkit-user-select:none;touch-action:none;user-select:none;width:min(74vh,100%)}.board-area{background:linear-gradient(180deg,#566477,var(--cell));border:1px solid rgba(231,237,244,.36);box-shadow:inset 0 0 0 1px #07182a29;display:grid;grid-column:2 / span var(--board-cols);grid-row:2 / span var(--board-rows);grid-template-columns:repeat(var(--board-cols),1fr);grid-template-rows:repeat(var(--board-rows),1fr);overflow:visible;position:relative;-webkit-user-select:none;touch-action:none;user-select:none}.cell{border-bottom:1px solid var(--cell-line);border-right:1px solid var(--cell-line);min-width:0}.edge-button{align-items:center;background:transparent;color:var(--board-label);display:flex;font-weight:700;justify-content:center;margin:1px;min-width:0;padding:0;position:relative;-webkit-user-select:none;touch-action:manipulation;user-select:none}.edge-button.used{background:transparent}.edge-button.used:after{background:var(--swatch, #aab4ad);content:"";position:absolute;z-index:1}.edge-button.used[data-match=match]:not(.selected):after{opacity:.12}.edge-button.top.used:after{height:4px;inset:auto 6px 0}.edge-button.right.used:after{inset:6px auto 6px 0;width:4px}.edge-button.bottom.used:after{height:4px;inset:0 6px auto}.edge-button.left.used:after{inset:6px 0 6px auto;width:4px}.edge-button.selected{background:var(--swatch, var(--accent-2));box-shadow:0 0 14px color-mix(in srgb,var(--swatch, var(--accent-2)) 42%,transparent);color:#07131e}.edge-button.selected[data-color=absorbed],.edge-button.selected[data-color=blue],.edge-button.selected[data-color=black],.edge-button.selected[data-color=blackbody],.edge-button.selected[data-color=purple]{color:var(--text-on-dark)}.trace-layer{inset:0;overflow:visible;pointer-events:none;position:absolute;z-index:3}.trace-line{fill:none;stroke:var(--swatch, var(--accent-2));stroke-dasharray:.48 .38;stroke-linecap:round;stroke-linejoin:round;stroke-width:.11}.trace-line-return{stroke-dasharray:none}.piece-layer{inset:0;pointer-events:none;position:absolute;z-index:4}.piece{background:transparent;border:0;cursor:grab;padding:0;pointer-events:none;position:absolute;-webkit-user-select:none;touch-action:none;user-select:none}.piece:active{cursor:grabbing}.piece svg{display:block;filter:drop-shadow(0 4px 8px rgba(0,0,0,.3));height:100%;overflow:visible;pointer-events:none;shape-rendering:geometricPrecision;width:100%}.piece polygon,.piece-tool polygon{stroke:#17211dd9;stroke-linejoin:round;stroke-width:.12}.piece .piece-fill,.piece-tool .piece-fill{stroke:none}.piece .piece-facets,.piece-tool .piece-facets{pointer-events:none}.piece .piece-facet,.piece-tool .piece-facet{stroke:none}.piece .piece-facet-0,.piece-tool .piece-facet-0{fill:var(--piece-tone-0)}.piece .piece-facet-1,.piece-tool .piece-facet-1{fill:var(--piece-tone-1)}.piece .piece-facet-2,.piece-tool .piece-facet-2{fill:var(--piece-tone-2)}.piece .piece-facet-3,.piece-tool .piece-facet-3{fill:var(--piece-tone-3)}.piece .piece-outline,.piece-tool .piece-outline{fill:none;shape-rendering:geometricPrecision;vector-effect:non-scaling-stroke}.piece .piece-outline{stroke-width:2px}.piece-tool .piece-outline{stroke-width:1.25px}.piece polygon{pointer-events:visiblePainted}.piece.selected svg{filter:drop-shadow(0 0 0 var(--accent-2)) drop-shadow(0 0 10px rgba(94,151,183,.72))}.piece-yellow polygon{fill:var(--ray-yellow)}.piece-red polygon{fill:var(--ray-red)}.piece-blue polygon{fill:var(--ray-blue)}.piece-white polygon,.piece-white-diamond polygon{fill:var(--ray-white)}.piece-diamond polygon{fill:#eef8ff29}.piece-blackbody polygon{fill:#292929}.piece-yellow{--piece-tone-0: color-mix(in srgb, var(--ray-yellow) 86%, #f7f1df);--piece-tone-1: var(--ray-yellow);--piece-tone-2: color-mix(in srgb, var(--ray-yellow) 76%, var(--ray-orange));--piece-tone-3: color-mix(in srgb, var(--ray-yellow) 82%, #07131e)}.piece-red{--piece-tone-0: color-mix(in srgb, var(--ray-red) 88%, #f7f1df);--piece-tone-1: var(--ray-red);--piece-tone-2: color-mix(in srgb, var(--ray-red) 84%, #07131e);--piece-tone-3: color-mix(in srgb, var(--ray-red) 72%, #07131e)}.piece-blue{--piece-tone-0: color-mix(in srgb, var(--ray-blue) 88%, #f7f1df);--piece-tone-1: var(--ray-blue);--piece-tone-2: color-mix(in srgb, var(--ray-blue) 84%, #07131e);--piece-tone-3: color-mix(in srgb, var(--ray-blue) 72%, #07131e)}.piece-white,.piece-white-diamond{--piece-tone-0: #fffdfa;--piece-tone-1: #f4f0e6;--piece-tone-2: #fffaf0;--piece-tone-3: #ebe5d8}.piece-diamond{--piece-tone-0: rgba(255, 255, 255, .42);--piece-tone-1: rgba(206, 224, 235, .22);--piece-tone-2: rgba(238, 248, 255, .3);--piece-tone-3: rgba(156, 183, 199, .16)}.piece-diamond .piece-outline,.piece-tool.piece-diamond .piece-outline{stroke:#eef8ffb8}.piece-blackbody{--piece-tone-0: #444444;--piece-tone-1: #303030;--piece-tone-2: #272727;--piece-tone-3: #1c1c1c}.piece.invalid svg{filter:drop-shadow(0 0 0 var(--danger)) drop-shadow(0 0 12px rgba(239,91,79,.82))}.piece.invalid .piece-outline{stroke:var(--danger);stroke-width:3px}.current-strip{background:var(--panel);border:1px solid var(--line);border-radius:8px;color:var(--text);max-width:min(680px,100%);min-height:42px;padding:10px 12px;text-align:center;width:100%}@media(max-width:860px){.board-card{grid-template-rows:minmax(0,1fr) auto;height:100%;min-height:0;overflow:hidden}.board-shell{align-self:center;height:min(100%,calc((100vw - 20px) * var(--board-height-ratio)),556px);justify-self:center;max-height:100%;max-width:100%;width:auto}.current-strip{font-size:.92rem;min-height:38px;padding:8px 10px}}.log-list{display:grid;gap:6px;max-height:min(38vh,360px);overflow:auto}.log-row{align-items:center;background:var(--panel-2);color:var(--text);display:flex;justify-content:space-between;min-height:42px;padding:0 10px;text-align:left}.log-row.active{background:var(--accent);color:#07131e;font-weight:700}.color-result{align-items:center;display:inline-flex;gap:8px}@media(max-width:860px){.log-list{max-height:none;overflow:visible}}
