:root{color:#eaf7ff;font-synthesis:none;--cyan:#65e7ff;--red:#ff547a;--green:#54e087;--gold:#ffc857;background:#03091b;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{color:#eaf7ff;background:radial-gradient(circle at 50% -20%,#153467 0,#07152f 35%,#03091b 70%);min-width:320px;min-height:100vh;margin:0}button,a{font:inherit}button{touch-action:manipulation}a{color:inherit}.site-header{border-bottom:1px solid #75ddff26;justify-content:space-between;align-items:center;max-width:1180px;height:70px;margin:auto;padding:0 24px;display:flex}.brand{align-items:center;gap:12px;font-weight:800;text-decoration:none;display:flex}.brand__mark{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);filter:drop-shadow(0 0 9px #45dfff);background:linear-gradient(135deg,#c7f8ff,#38c9ff 50%,#2854bd);width:22px;height:22px}nav{gap:26px;display:flex}nav a{color:#a9bddc;font-size:14px;text-decoration:none}nav a:hover{color:#fff}main{overflow:hidden}.intro{max-width:1180px;margin:0 auto;padding:66px 24px 34px}.intro div{max-width:820px}.intro h1{letter-spacing:-.055em;margin:0 0 20px;font-size:clamp(42px,6vw,76px);line-height:.98}.intro p{color:#a9bddc;max-width:720px;margin:0;font-size:clamp(17px,2vw,21px);line-height:1.6}.game-stage{grid-template-columns:minmax(290px,390px) minmax(0,1fr);max-width:1180px;min-height:700px;margin:0 auto 90px;padding:0 24px;display:grid}.art-panel{background-image:linear-gradient(#0000 64%,#03091bd9),url(/fourfront-scene.jpg);background-position:50%;background-size:cover;border:1px solid #77dfff35;border-radius:26px 0 0 26px;min-height:700px;position:relative;overflow:hidden;box-shadow:0 30px 90px #0009}.art-panel span{letter-spacing:.16em;text-transform:uppercase;color:#bfefff;font-size:13px;position:absolute;bottom:26px;left:28px}.game-panel{background:#07152ff2;border:1px solid #77dfff35;border-left:0;border-radius:0 26px 26px 0;flex-direction:column;min-width:0;padding:24px;display:flex;box-shadow:0 30px 90px #0009}.game-panel__top{justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;display:flex}.game-panel__top>div{gap:3px;display:grid}.turn-label{letter-spacing:.18em;color:#7fdfff;font-size:11px}.game-panel__top strong{font-size:19px}.restart-link{color:#dff8ff;cursor:pointer;background:#0a2148;border:1px solid #8ae8ff4d;border-radius:10px;padding:10px 14px}.restart-link:hover{background:#123164}.score-rail{grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:15px;display:grid}.score{background:#030b1e99;border:1px solid #ffffff12;border-radius:11px;align-items:center;gap:8px;min-width:0;padding:9px;transition:all .2s;display:flex}.score.is-active{border-color:#fff5;transform:translateY(-2px)}.score__gem{clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);flex:none;width:12px;height:12px}.score--cyan .score__gem{background:var(--cyan);box-shadow:0 0 12px var(--cyan)}.score--red .score__gem{background:var(--red)}.score--green .score__gem{background:var(--green)}.score--gold .score__gem{background:var(--gold)}.score strong,.score small{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}.score strong{font-size:11px}.score small{color:#8fa8cd;margin-top:2px;font-size:9px}.board-wrap{width:min(100%,540px);margin:auto;position:relative}.board{aspect-ratio:1;clip-path:polygon(28.6% 0,71.4% 0,100% 28.6%,100% 71.4%,71.4% 100%,28.6% 100%,0 71.4%,0 28.6%);filter:drop-shadow(0 20px 24px #0008);background:linear-gradient(135deg,#102b57,#06142f);border:1px solid #78dfff50;grid-template-rows:repeat(14,1fr);grid-template-columns:repeat(14,1fr);gap:2px;padding:11px;display:grid}.board__void{visibility:hidden}.board__cell{cursor:pointer;background:#0b2347;border:1px solid #5d91c51f;border-radius:2px;place-items:center;min-width:0;padding:0;transition:all .12s;display:grid}.board__cell:nth-child(2n){background:#0d2850}.board__cell:disabled{cursor:default}.board__cell.is-center{background:#263760;border-color:#90eaff44}.board__cell.is-target{cursor:pointer;background:#235a72;box-shadow:inset 0 0 0 2px #8af3ff}.board__cell.is-target:after{content:"";background:#c4faff;border-radius:50%;width:28%;height:28%;box-shadow:0 0 8px #5de6ff}.board__cell.is-selected{box-shadow:inset 0 0 0 2px #fff}.piece{clip-path:polygon(50% 0,90% 22%,100% 75%,50% 100%,0 75%,10% 22%);filter:drop-shadow(0 0 5px);text-shadow:0 1px #fff9;border-radius:3px 3px 45% 45%;place-items:center;width:78%;height:78%;font-size:clamp(7px,1.15vw,13px);font-weight:950;line-height:1;display:grid;color:#031028!important}.piece--cyan{background:linear-gradient(135deg,#e2ffff,#53dfff 50%,#1479db)}.piece--red{background:linear-gradient(135deg,#ffd9e1,#ff547a 52%,#a80f3a)}.piece--green{background:linear-gradient(135deg,#d9ffe7,#54e087 52%,#087a3c)}.piece--gold{background:linear-gradient(135deg,#fff1bd,#ffc857 52%,#aa6411)}.game-overlay{text-align:center;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#030b1eea;border:1px solid #7ce8ff66;border-radius:20px;place-content:center;padding:22px;display:grid;position:absolute;inset:9%}.game-overlay h2{margin:0 0 9px;font-size:clamp(23px,4vw,36px)}.game-overlay p{color:#a9bddc;max-width:360px;margin:0 auto 20px;line-height:1.5}.game-overlay button{color:#041027;cursor:pointer;background:#63e6ff;border:0;border-radius:12px;justify-self:center;padding:13px 22px;font-weight:800;box-shadow:0 0 28px #45dfff55}.game-hint{text-align:center;color:#88a8d2;min-height:20px;margin:15px 0 0;font-size:13px}.rules,.faq,.content-band{max-width:1040px;margin:0 auto 100px;padding:0 24px}.rules{grid-template-columns:1fr 1.15fr;gap:70px;display:grid}.rules h2,.faq h2,.content-band h2{letter-spacing:-.04em;margin:0 0 18px;font-size:clamp(32px,4vw,52px);line-height:1.05}.rules p,.faq p,.content-band p{color:#9eb4d5;line-height:1.72}.rules ol{margin:0;padding:0;list-style:none}.rules li{color:#cfe2f7;border-bottom:1px solid #92dfff22;align-items:center;gap:17px;padding:17px 0;display:flex}.rules li span{color:#65e7ff;border:1px solid #64ddff66;place-items:center;width:30px;height:30px;font-size:11px;display:grid;transform:rotate(45deg)}.content-band{max-width:800px}.content-band p{font-size:17px}.content-band a{color:#65e7ff}.faq{max-width:800px}.faq details{border-top:1px solid #92dfff22;padding:20px 0}.faq details:last-child{border-bottom:1px solid #92dfff22}.faq summary{cursor:pointer;font-weight:700}.faq p{margin-bottom:0}footer{color:#7893b8;border-top:1px solid #75ddff26;justify-content:space-between;max-width:1180px;margin:auto;padding:28px 24px 38px;font-size:13px;display:flex}footer span:last-child{gap:18px;display:flex}footer a{text-decoration:none}@media (width<=800px){nav{display:none}.intro{padding-top:42px}.game-stage{grid-template-columns:1fr;margin-bottom:64px;padding:0 14px}.art-panel{background-position:0%;border-radius:22px 22px 0 0;min-height:210px}.game-panel{border-top:0;border-left:1px solid #77dfff35;border-radius:0 0 22px 22px;padding:15px}.score-rail{grid-template-columns:repeat(2,1fr)}.rules{grid-template-columns:1fr;gap:24px}.art-panel span{bottom:18px;left:20px}}@media (width<=430px){.site-header{height:60px;padding:0 17px}.intro{padding:34px 18px 24px}.intro h1{font-size:41px}.intro p{font-size:16px}.game-stage{padding:0 9px}.art-panel{min-height:176px}.game-panel__top{align-items:flex-start}.game-panel__top strong{font-size:16px}.restart-link{padding:8px 10px;font-size:12px}.board-wrap{overscroll-behavior-x:contain;touch-action:pan-x pinch-zoom;scrollbar-color:#62dff0 #06142f;scrollbar-width:thin;width:100%;overflow-x:auto}.board{gap:1px;width:500px;min-width:500px;padding:7px}.game-overlay{padding:15px;inset:7%}.game-overlay h2{font-size:24px}.rules,.faq,.content-band{margin-bottom:72px;padding:0 18px}.rules h2,.faq h2,.content-band h2{font-size:34px}footer{gap:12px;padding:24px 18px;display:grid}footer span:last-child{flex-wrap:wrap}}@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}