:root{--bg:#0d2234;--panel:#16364a;--card:#1d4355;--edge:rgba(175,231,247,.16);--text:#e9f9ff;--muted:#a2c6d7;--mint:#b4f4dc;--mint2:#83d8cb;--orange:#ffdb99}
.ambient-one{background:rgba(74,169,225,.16)}.ambient-two{background:rgba(54,126,160,.12)}
.brand,.brand .brand-light{color:#a6e6fa}.bridge-logo{font:900 30px Outfit;display:inline-block;margin-right:6px;color:#93e3e9}
.eyebrow,.card-eyebrow{color:#8ee3e4}.eyebrow-line,.live-dot{background:#91e5ed}
.hero h1 em{color:#a7ebee}
.primary-button{background:#adeffc;border-color:#adeffc;color:#163849;box-shadow:0 10px 27px rgba(76,194,229,.13)}
.primary-button:hover{background:#d5f7ff}.arcade-link:hover,.footer a:hover{color:#b9eef2}
.chapter-tab.active,.chapter-tab:hover{background:#a8edf5;border-color:#a8edf5;color:#14364a}
.level-card{background:linear-gradient(140deg,#22506a,#19374e)}
.level-card.complete{background:linear-gradient(145deg,#27686d,#204c63);border-color:rgba(137,234,229,.4)}
.level-card-head strong{color:#b1eaf4}
.play-panel{background:linear-gradient(160deg,#20445f,#132e44)}
.info-card{background:rgba(29,70,92,.68)}.info-card.pale{background:rgba(71,157,198,.1)}
.game-stats .star-value,.level-card-bottom span{color:#f9d79d}
.match-track>div{background:linear-gradient(90deg,#76badf,#b6f2da)}
.visual-callout{background:#d5f7fb;color:#386880}.visual-callout strong{color:#22516a}
.info-card h3{color:#e8faff}.tip-sub{color:#93bfd2!important}
.bridge-preview{position:relative;z-index:1;width:min(315px,100%);padding:7px;border-radius:24px;background:#1d445a;border:1px solid rgba(174,238,246,.24);transform:rotate(-8deg);box-shadow:0 24px 55px rgba(0,0,0,.29)}
.bridge-preview svg{width:100%;display:block}
.bridge-board{max-width:590px;width:100%;margin:0 auto;aspect-ratio:1;position:relative;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.bridge-svg{width:100%;height:100%;display:block;overflow:visible;touch-action:manipulation;border-radius:16px;background:radial-gradient(circle at 36% 28%,#214e68,#102d46 78%);border:1px solid rgba(166,227,246,.22)}
.bridge-svg .sea-grid{stroke:rgba(157,221,240,.19);stroke-width:1.6;pointer-events:none}
.bridge-svg .sea-dot{fill:rgba(160,228,242,.24);pointer-events:none}

/* Guide tracks are quiet until a nearby island is selected. */
.bridge-svg .bridge-guide{
 stroke:rgba(152,224,244,.48);stroke-width:3;stroke-dasharray:3 10;stroke-linecap:round;
 pointer-events:none
}
.bridge-svg .edge-wrap.candidate .bridge-guide{stroke:#c5f7fb;stroke-width:4;stroke-dasharray:5 8;opacity:1}
.bridge-svg .bridge-guide.hinted{stroke:#ffe5a3;stroke-width:6;stroke-dasharray:8 7}
.bridge-svg .bridge-guide.connected{opacity:.35}
/* Each bridge uses a dark deck under a brightly lit rail. */
.bridge-svg .bridge-beam{
 stroke:#21475d;stroke-width:19;stroke-linecap:round;pointer-events:none;
 filter:drop-shadow(0 2px 2px rgba(0,7,20,.38))
}
.bridge-svg .bridge-rail{
 stroke:#a8edfb;stroke-width:10;stroke-linecap:round;pointer-events:none;
 filter:drop-shadow(0 0 3px rgba(178,239,255,.22))
}
.bridge-svg .bridge-beam.double{stroke-width:15}
.bridge-svg .bridge-rail.double{stroke:#edfaff;stroke-width:8}
.bridge-svg .edge-wrap:hover .bridge-guide,
.bridge-svg .edge-wrap:focus-visible .bridge-guide{stroke:#f8e9b5;stroke-width:5}
.bridge-svg .edge-wrap:focus-visible{outline:none}
.bridge-svg .bridge-hit{stroke:transparent;stroke-width:36;cursor:pointer;pointer-events:stroke}
.bridge-svg .bridge-build{animation:bridge-reach .24s cubic-bezier(.18,.7,.15,1) both}
@keyframes bridge-reach{
 from{stroke-dasharray:100;stroke-dashoffset:100;opacity:.35}
 to{stroke-dasharray:100;stroke-dashoffset:0;opacity:1}
}
.bridge-svg .island{cursor:pointer;outline:none}

.bridge-svg .island-halo{fill:rgba(2,28,48,.85);stroke:#7dc6df;stroke-width:5}
.bridge-svg .island .island-core{fill:#e0f5ff;stroke:#ffe09b;stroke-width:5}
.bridge-svg .island .island-digit{
 fill:#164460;font:900 38px Outfit,"Malgun Gothic",sans-serif;
 text-anchor:middle;dominant-baseline:central;pointer-events:none
}
.bridge-svg .island.matched .island-core{fill:#d3ffe9;stroke:#6bd9b6}
.bridge-svg .island.over .island-core{fill:#ffdde0;stroke:#fa949a}
.bridge-svg .island.selected .island-halo{stroke:#ffe7ac;stroke-width:8;filter:drop-shadow(0 0 6px rgba(255,235,173,.45))}
.bridge-svg .island.hinted .island-halo{stroke:#ffe6a7;stroke-width:8;stroke-dasharray:6 5}
.bridge-svg .island:hover .island-core,.bridge-svg .island:focus-visible .island-core{stroke:#fff0c2;stroke-width:6}
.bridge-svg .island-badge{cursor:pointer}
.bridge-svg .island-counter-outline{fill:#73cbe9;stroke:#245b77;stroke-width:2;pointer-events:all}
.bridge-svg .island-counter{fill:#133b56;pointer-events:all}
.bridge-svg .island-progress{
 fill:#f7ffff;font:900 17px Outfit,"Malgun Gothic",sans-serif;
 text-anchor:middle;dominant-baseline:central;pointer-events:none;
 letter-spacing:.1px
}
.bridge-svg .island.matched .island-counter-outline{fill:#7edabf}
.bridge-svg .island.matched .island-counter{fill:#1b655c}
.bridge-svg .island.over .island-counter-outline{fill:#ffa0a9}
.bridge-svg .island.over .island-counter{fill:#693d55}
.bridge-svg .island .island-touch{fill:transparent;pointer-events:all;cursor:pointer}
.bridge-status{position:static!important;width:auto!important;height:auto!important;margin:15px auto 0!important;color:#badbe6;line-height:1.7;font-size:12px;white-space:normal!important;clip:auto!important;overflow:visible!important}
.bridge-example{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 0;margin:12px 0;border-radius:14px;background:rgba(8,35,52,.25)}
.example-island{height:45px;width:45px;border-radius:50%;display:grid;place-items:center;background:#d3f6ff;color:#235271;font:900 24px Outfit;border:3px solid #93d5e5}
.example-lines{height:16px;width:76px;border-top:4px solid #a0e4f2;border-bottom:4px solid #a0e4f2}
@media(max-width:650px){.bridge-preview{width:240px}.bridge-board{max-width:100%}.bridge-svg{border-radius:10px}.game-stats strong{font-size:clamp(16px,4.6vw,25px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;animation:none!important}.bridge-svg .bridge-build{animation:none!important}}