.web-rebuilt{--ink:#243447;--line:#c8d0df;--accent:#5145cd;max-width:780px;margin:auto}.web-tools{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0}.web-tools>.arcade-choice{min-width:44px}.web-tools .color-choice{color:var(--on-color,#fff);text-shadow:none;border:2px solid #fff;box-shadow:0 0 0 1px #bbc5d4}.web-tools .color-choice.active{outline:3px solid #222f44;outline-offset:2px}.web-grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));max-width:560px;width:100%;margin:14px auto;gap:0;background:#fff;border:1px solid #9aa8bc;border-radius:10px;overflow:visible;box-shadow:0 6px 22px #2434470b}.web-cell{position:relative;aspect-ratio:1;min-width:0;min-height:0;padding:1px;border:1px solid #d5dbe5;border-radius:0;background:#fff;color:#243447;box-shadow:none;font-size:clamp(12px,2.3vw,25px);font-weight:600;cursor:pointer;touch-action:manipulation;transition:background .12s,border-color .12s,box-shadow .12s}.web-cell:hover:not(:disabled){background:#edf0ff;box-shadow:inset 0 0 0 2px #b4b0ef;z-index:2}.web-cell.selected{box-shadow:inset 0 0 0 3px #5145cd;z-index:3;background:#edeaff}.web-cell:focus-visible{outline:3px solid #5145cd;outline-offset:-3px;z-index:4}.web-cell:disabled{opacity:1;cursor:default}.web-cell.given{background:#e9edf4;color:#26364c;font-weight:800}.web-cell.blue,.web-cell.path{background:#5145cd;color:#fff}.web-cell.black{background:#263447;color:#fff}.web-cell.white{background:#fff;color:#657186}.web-cell.unset{background:#e8edf4}.web-cell.hole{background:#e9edf4;border-color:#d5dbe5;color:#8b99ab}.web-cell.available{background:#f0efff;box-shadow:inset 0 0 0 2px #bbb5ef}.web-cell.color-tile{background:var(--cell-color);color:var(--on-color,#fff);text-shadow:none}.web-cell.region,.web-cell.joined{background:color-mix(in srgb,var(--cell-color) 24%,white);color:#253247;border-color:color-mix(in srgb,var(--cell-color) 40%,white)}.web-cell.region:hover,.web-cell.joined:hover{background:color-mix(in srgb,var(--cell-color) 36%,white)}.web-cell.lit{background:#fff2b4;color:#866317}.web-cell.conflict,.web-cell.mine{background:#ffe2e5;color:#a62644}.web-cell.current,.web-cell.atom,.web-cell.peg{background:#5145cd;color:#fff}.web-cell.tree{background:#d9efe5;color:#16735c}.web-cell.tent{background:#e9e4ff;color:#5145cd}.web-cell.gem{background:#dcefe7;color:#1c826a}.web-cell.painted{background:#cfc9ff;color:#5145cd}.web-cell.covered{background:linear-gradient(145deg,#f7f8fc,#dbe2ed);box-shadow:inset 0 -3px 0 #acbacd;border-color:#b4c0d2}.web-cell.revealed{background:#f5f7fc;color:#3b4f70}.web-cell-details,.web-cell-details *{pointer-events:none}.web-cage-label{position:absolute;top:2px;left:3px;font-size:clamp(8px,1.1vw,12px);font-weight:700;color:#4e5c70}.web-inequality{position:absolute;color:#5145cd;font-size:22px;z-index:3;line-height:16px;background:#fff8}.web-inequality.right{right:-8px;top:calc(50% - 8px)}.web-inequality.bottom{bottom:-8px;left:calc(50% - 8px)}.web-number-frame{display:grid;grid-template-columns:64px minmax(0,1fr) 36px;grid-template-rows:auto 1fr auto;max-width:660px;margin:16px auto}.web-number-frame>.web-grid{grid-column:2;grid-row:2;margin:0;max-width:none}.web-counts{font-size:clamp(9px,1.3vw,15px);font-weight:700;line-height:1.35;white-space:pre-line;color:#5145cd;display:grid;text-align:center;align-items:center;gap:0}.web-counts.top{grid-column:2;grid-row:1;grid-template-columns:repeat(var(--cols),1fr);padding-bottom:8px}.web-counts.left{grid-column:1;grid-row:2;grid-template-rows:repeat(var(--cols),1fr);padding-right:5px}.web-counts.right{grid-column:3;grid-row:2;grid-template-rows:repeat(var(--cols),1fr)}.web-counts.bottom{grid-column:2;grid-row:3;grid-template-columns:repeat(var(--cols),1fr);padding-top:8px}.web-shift-frame{display:grid;grid-template-columns:36px minmax(0,1fr) 36px;grid-template-rows:36px 1fr 36px;max-width:620px;margin:16px auto;gap:5px}.web-shift-frame>.web-grid{grid-column:2;grid-row:2;margin:0;max-width:none}.web-shift-top,.web-shift-bottom{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:4px}.web-shift-top{grid-column:2;grid-row:1}.web-shift-bottom{grid-column:2;grid-row:3}.web-shift-left,.web-shift-right{display:grid;grid-template-rows:repeat(var(--cols),1fr);gap:4px}.web-shift-left{grid-column:1;grid-row:2}.web-shift-right{grid-column:3;grid-row:2}.web-shift-frame .arcade-choice{min-height:30px;padding:2px;font-size:20px}.web-pipe{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.web-pipe line{stroke:#5145cd;stroke-width:12;stroke-linecap:round}.web-pipe circle{fill:#16816e}.web-cell.locked{background:#dcefe7}.web-lines{width:100%;max-height:570px;display:block;margin:12px auto;touch-action:none;overflow:visible}.web-board-bg,.web-slant-cell{fill:#fff;stroke:#d2d9e3;stroke-width:1}.web-line{stroke:#c4ccdb;stroke-width:2;pointer-events:none;stroke-linecap:round}.web-line.on{stroke:#5145cd;stroke-width:5}.web-dot{fill:#9ba8bd;pointer-events:none}.web-clue{fill:#33475e;font-size:19px;text-anchor:middle;pointer-events:none;font-weight:700}.web-edge-hit{cursor:pointer;stroke-linecap:butt;pointer-events:stroke}.web-edge-hit:hover{stroke:#5145cd26}.web-slant-clue{fill:#fff;stroke:#b6c1d2;pointer-events:none}.web-pearl{fill:#fff;stroke:#26364a;stroke-width:3;pointer-events:none}.web-pearl.black{fill:#26364a}.web-island{cursor:pointer}.web-island circle{fill:#fff;stroke:#5145cd;stroke-width:3}.web-island text{fill:#33475e;font-size:20px;font-weight:700;text-anchor:middle;pointer-events:none}.web-island.selected circle{fill:#dad5ff;stroke-width:5}.web-island.draggable{cursor:grab}.web-island.draggable:active{cursor:grabbing}.web-ports{display:grid;grid-template-columns:36px minmax(0,1fr) 36px;grid-template-rows:36px 1fr 36px;gap:4px;max-width:640px;margin:14px auto}.web-ports>.web-grid{grid-column:2;grid-row:2;margin:0;max-width:none}.web-port-row{display:grid;gap:3px}.web-port-row.top,.web-port-row.bottom{grid-template-columns:repeat(var(--cols),minmax(0,1fr));grid-column:2}.web-port-row.top{grid-row:1}.web-port-row.bottom{grid-row:3;direction:rtl}.web-port-row.left,.web-port-row.right{grid-template-rows:repeat(var(--cols),1fr);grid-row:2}.web-port-row.left{grid-column:1;display:flex;flex-direction:column-reverse}.web-port-row.left>*{flex:1}.web-port-row.right{grid-column:3}.web-port-row .arcade-choice{min-height:28px;padding:2px;font-size:13px;min-width:0}.web-port-row .revealed-port{background:#d9efe5;color:#17634f}.web-galaxy-wrap{position:relative;max-width:560px;margin:auto}.web-galaxy-centers{position:absolute;inset:0;pointer-events:none}.web-center{position:absolute;transform:translate(-50%,-50%);border:2px solid white;width:24px;height:24px;border-radius:50%;color:white;text-align:center;font:700 12px/20px system-ui;box-shadow:0 0 0 1px #33475e55}.web-face{padding:9px 13px;border:1px solid #c9d3e2;border-radius:8px;background:#fff;color:#637489}.web-face.painted{background:#5145cd;color:#fff;border-color:#5145cd}.web-guess-history{display:flex;flex-direction:column;gap:8px;max-width:560px;margin:10px auto}.web-guess-row{display:flex;gap:8px;align-items:center}.web-guess-dot{width:30px;height:30px;border-radius:50%;background:var(--cell-color);color:#fff;text-align:center;line-height:30px;font-size:13px}.web-guess-result{font-size:17px;letter-spacing:3px;color:#5145cd}
.triple-legend{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;font-size:12px;color:#526179;margin:10px 0}.triple-legend span{display:flex;align-items:center;gap:5px}.triple-legend svg{width:20px;height:24px}.triple-cards .arcade-choice{position:relative;background:#fff;border:1px solid #bac4d6;min-height:85px}.triple-cards .arcade-choice.active{background:#f0edff;border-color:#5145cd;outline-color:#5145cd}.triple-card-number{position:absolute;left:7px;top:4px;color:#657287;font-size:10px}.triple-cards svg{pointer-events:none}.triple-success{padding:12px;background:#ddefe6;border-radius:12px;color:#18634e;text-align:center}.graph-edge{vector-effect:non-scaling-stroke}.edge-arrow{pointer-events:none}.piece-board text,.geoboard text,.billiards-board text,.circle-board text,.defence-board text{pointer-events:none}.arcade-board{border:1px solid #e0e5ef}.arcade-choice:active:not(:disabled){box-shadow:inset 0 2px 5px #24344720}
@media(max-width:520px){.web-number-frame{grid-template-columns:43px minmax(0,1fr) 23px}.web-cell{font-size:16px}.web-tools{gap:6px}.web-tools .arcade-choice{padding:7px 9px;min-width:36px;font-size:12px}.web-counts{font-size:10px}.web-ports{grid-template-columns:29px minmax(0,1fr) 29px;grid-template-rows:29px 1fr 29px}.web-shift-frame{grid-template-columns:28px minmax(0,1fr) 28px;grid-template-rows:29px 1fr 29px}.web-center{width:20px;height:20px;font-size:10px;line-height:16px}.web-cage-label{font-size:9px}}
@media(prefers-reduced-motion:reduce){.web-cell{transition:none}}
.web-cell.color-tile:hover:not(:disabled){background:var(--cell-color);color:var(--on-color,#fff);box-shadow:inset 0 0 0 3px #ffffff88}.web-cell.blue:hover:not(:disabled),.web-cell.path:hover:not(:disabled),.web-cell.current:hover:not(:disabled),.web-cell.peg:hover:not(:disabled),.web-cell.atom:hover:not(:disabled){background:#4237ac;color:#fff}.web-cell.black:hover:not(:disabled){background:#30415a;color:#fff}.triple-cards .arcade-choice.active:disabled{opacity:1}