:root{color-scheme:dark;--hue:0deg}*{box-sizing:border-box}body{margin:0;color:#fcf8e8;font-family:system-ui,-apple-system,Segoe UI,sans-serif;background:#102e3d;min-height:100vh}body:before{content:'';position:fixed;inset:0;background:linear-gradient(90deg,#092737bd,#11293b50),url('/kelime-gezmece-scene.svg?v=276') center/cover;filter:hue-rotate(var(--hue));z-index:-1}.header{display:flex;justify-content:space-between;align-items:center;padding:17px 4vw;border-bottom:1px solid #d4efdc33;background:#0c263d8a}.header a{color:#e7f7ee;text-decoration:none;font-size:13px}.header .brand{font-size:23px;font-weight:850;letter-spacing:-1px}.brand span{color:#d9b77c}main{max-width:1100px;margin:auto;padding:22px 18px 40px}.intro{text-align:center}.intro p{color:#e4dfbd;font-size:10px;letter-spacing:3px;font-weight:700;margin:0 0 8px}.intro h1{font-size:clamp(32px,5vw,53px);letter-spacing:-2px;margin:0;text-shadow:0 4px 0 #173749,0 12px 25px #0007}.intro h2{font-size:14px;font-weight:500;color:#d7e4da;margin:9px 0 20px}.game{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:24px;background:#0c253cd9;border:1px solid #d8eed14d;border-radius:26px;padding:24px;box-shadow:0 30px 70px #001a2d99,inset 0 1px #fff2;backdrop-filter:blur(12px)}.hud{grid-column:1/-1;display:flex;justify-content:space-around;border-bottom:1px solid #b6d3c32e;padding-bottom:15px}.hud span{font-size:9px;letter-spacing:2px;color:#aac4bf}.hud b{display:block;text-align:center;color:#fff3d6;font-size:20px;letter-spacing:0;margin-top:3px}.puzzle{align-self:center}#words{display:flex;flex-direction:column;gap:14px;align-items:center;perspective:900px}.word{display:flex;gap:7px;transform:rotateX(8deg)}.tile{display:grid;place-items:center;width:42px;height:44px;border-radius:8px;background:linear-gradient(135deg,#3d6073,#253f57);box-shadow:0 6px 0 #142e41,0 10px 15px #0004,inset 0 1px #aec1b67a;color:#fff9dd;font-size:22px;font-weight:800;border:1px solid #718f9669}.solved .tile{background:linear-gradient(135deg,#f9e2a3,#d5ad65);color:#2e4857;box-shadow:0 6px 0 #907048,0 10px 15px #0004,inset 0 1px #fff;animation:reveal .3s ease-out}.controls-panel{text-align:center;min-width:0}.entry{height:43px;font-size:25px;letter-spacing:6px;font-weight:800;color:#ffe8ad;text-shadow:0 3px #092838}#wheel{width:min(100%,330px);aspect-ratio:1;margin:8px auto 20px;position:relative;touch-action:none;border-radius:50%;background:radial-gradient(ellipse at 40% 25%,#617c85,#284354 65%);border:10px solid #6d888a;box-shadow:0 15px 0 #172e42,0 23px 32px #0006,inset 0 5px 12px #071a32aa;perspective:700px}#letters{position:absolute;inset:0}.letter{position:absolute;transform:translate(-50%,-50%) rotateX(12deg);width:59px;height:59px;border:1px solid #fff7d6;border-radius:16px;background:linear-gradient(140deg,#fff3d2,#d9b876);color:#244151;font-size:30px;font-weight:850;box-shadow:0 7px 0 #9c7e4e,0 12px 15px #00172c77;cursor:pointer;touch-action:none;user-select:none;-webkit-user-select:none}.letter.selected{background:linear-gradient(140deg,#aef5d3,#55bfa8);border-color:#d0ffe8;box-shadow:0 7px 0 #2b807c,0 10px 20px #00172c77}.letter:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:4px}svg.thread{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}.thread polyline{fill:none;stroke:#6de0bc;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}.actions{display:flex;justify-content:center;gap:9px;flex-wrap:wrap}button.action{padding:11px 15px;border:1px solid #accdc47a;background:#34566b;color:#f3f8e9;border-radius:10px;font-size:12px;font-weight:700;cursor:pointer}button.primary{background:linear-gradient(135deg,#ffe4a6,#ddb26c);color:#173e50;border-color:#ffeac1;box-shadow:0 4px 0 #92764d}button:disabled{opacity:.4;cursor:default}#status{min-height:38px;color:#f4d3b5;font-size:12px;margin:15px 0 0}#status.good{color:#96e9b9}.tools{margin-top:10px}.overlay{position:absolute;inset:0;border-radius:25px;background:#0a2339f2;display:grid;place-items:center;z-index:5;padding:25px;text-align:center}.overlay[hidden]{display:none}.overlay img{width:180px;height:140px;object-fit:cover;border-radius:18px;box-shadow:0 10px 0 #17394a;border:1px solid #badcc6}.overlay h2{font-size:30px;letter-spacing:-1px;margin:25px 0 10px}.overlay p{max-width:390px;font-size:14px;line-height:1.6;color:#c9dcd5}.overlay button{margin-top:10px;padding:15px 24px}.help{display:flex;gap:25px;justify-content:center;color:#d3e2dc;font-size:12px;line-height:1.7;margin:22px auto 0;max-width:850px}.help p{flex:1;margin:0}.help b{display:block;color:#ffe3a6}.restart{background:none;border:0;color:#dce4ce;font-size:11px;text-decoration:underline;cursor:pointer;margin-top:20px}@keyframes reveal{from{transform:translateY(-8px) rotateX(30deg)}to{transform:none}}@media(max-width:650px){main{padding:18px 10px 30px}.game{grid-template-columns:1fr;padding:17px 10px;gap:20px}.hud{padding-bottom:12px}.intro h1{font-size:34px}.tile{width:36px;height:36px;font-size:19px}.word{gap:6px}#words{gap:11px}#wheel{width:270px;margin-bottom:18px}.letter{width:50px;height:50px;font-size:25px;border-radius:13px}.help{display:block;padding:0 10px}.help p{margin-bottom:10px}.overlay img{width:160px;height:150px}.overlay h2{font-size:27px}.entry{font-size:22px;height:33px}}@media(prefers-reduced-motion:reduce){.solved .tile{animation:none}}
