:root{--eco:#25d878;--lime:#b8f548;--ink:#031b17;--panel:#062d26;--mist:#dfffea}body{background:radial-gradient(circle at 50% -10%,#146d4f 0,#06372d 35%,#021714 78%);background-attachment:fixed}.page{padding-top:14px}.brand{padding:10px 12px;border:1px solid #ffffff18;border-radius:18px;background:#031f1aaa;box-shadow:0 12px 32px #0004;backdrop-filter:blur(14px)}.brand-mark{border:1px solid #9cffbe66;background:linear-gradient(145deg,#0c7b4c,#20c96e);box-shadow:inset 0 1px #ffffff55,0 7px 20px #00a95e38;font-size:24px}.brand strong{font-size:15px}.brand small{color:#a9eec3}.sound,.fullscreen{border-color:#a9ffc83b;background:#052d25cc;box-shadow:inset 0 1px #ffffff1c;transition:.18s}.sound:hover,.fullscreen:hover,.refresh:hover{border-color:#7dffa9;background:#0a4937}.game{border:1px solid #caffdd55;border-radius:26px;box-shadow:0 24px 70px #0009,0 0 0 6px #0a603d88,0 0 44px #1dd87525}.game:before{content:"";position:absolute;z-index:1;inset:0;pointer-events:none;border-radius:inherit;box-shadow:inset 0 0 70px #001d16aa,inset 0 1px #fff4}.hud{top:15px;gap:10px}.hud span{border-color:#caffdd33;background:#031f1ad9;box-shadow:0 8px 22px #0003;letter-spacing:.04em}.hud b{display:block;margin-top:2px;font-size:1.14em;color:#fff}.mission{top:78px;border:1px solid #b9ffd032;border-radius:14px;background:#03241ee8;box-shadow:0 10px 28px #0005}.mission b{color:var(--lime)}.mission i{height:5px;background:linear-gradient(90deg,#16c96c,#c7f54b);box-shadow:0 0 16px #41ec80}.card{width:min(570px,94%);padding:25px 27px 23px;border:1px solid #baffd03b;border-radius:26px;background:linear-gradient(155deg,#073b30f2,#021d18f5);box-shadow:0 24px 70px #0009,inset 0 1px #ffffff2b}.eco-badge{display:inline-flex;align-items:center;gap:7px;padding:6px 11px;border:1px solid #baffcc42;border-radius:999px;color:#bdfbd0;background:#0a513b99;font-size:11px;font-weight:900;letter-spacing:.12em}.eco-badge span{color:var(--lime)}.card .croc{margin:-2px 0 -8px;font-size:58px;filter:drop-shadow(0 10px 12px #0006)}.card h1{margin:2px 0 11px;font-size:clamp(27px,5vw,44px);line-height:.95;letter-spacing:-.025em;text-shadow:0 5px 25px #000}.card p{max-width:480px;margin-bottom:14px;color:#def8e7}.eco-legend{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:0 auto 16px}.eco-legend span{padding:8px 6px;border:1px solid #ffffff17;border-radius:10px;background:#001a158f;color:#cdebd8;font-size:10px;font-weight:900;letter-spacing:.035em}.player-name{border:1px solid #b9ffd044;background:#001914cc;box-shadow:inset 0 2px 8px #0004}.player-name:focus{border-color:#69f59a;box-shadow:0 0 0 3px #27da7550}.start{color:#032518;background:linear-gradient(135deg,#effff4,#aef453);box-shadow:0 7px 0 #469e54,0 12px 24px #0005;letter-spacing:.04em}.leaderboard{border-color:#9cffbd26;background:linear-gradient(160deg,#073229e6,#031e1ae6);box-shadow:0 20px 50px #0005,inset 0 1px #ffffff18}.board-head small{color:var(--lime);letter-spacing:.13em}.refresh{border-color:#a6ffc43b;background:#062c24}.board-tabs button.active{color:#022318;background:linear-gradient(135deg,#aef453,#62eb8d)}.score-list li{border-top-color:#c8ffdc13}.score-list li:before{background:linear-gradient(145deg,#0e8152,#18bd68);box-shadow:inset 0 1px #fff4}.score-list b{color:#caff7a}footer{color:#79aa92}@media(max-width:600px){.page{padding-top:8px}.brand{gap:8px;padding:8px}.brand strong{font-size:12px}.brand small{font-size:8px}.mission{top:61px;width:88%}.card{padding:18px 14px}.card .croc{font-size:46px}.card p{font-size:14px}.eco-legend{gap:4px}.eco-legend span{font-size:8px;padding:7px 3px}.start{font-size:15px}.hud span{font-size:11px}}
/* Bursasporluyuz start-screen branding */
.card .start-logo{display:flex;align-items:center;justify-content:center;min-height:82px;margin:4px auto 2px}
.card .start-logo img{display:block;width:min(270px,78%);height:auto;object-fit:contain;filter:drop-shadow(0 10px 14px #0008)}
@media(max-width:600px){.card .start-logo{min-height:62px;margin:2px auto 0}.card .start-logo img{width:min(220px,76%)}}
/* Pause control, safe-area positioning and high-resolution start branding */
.pause{margin-left:4px;border:1px solid #a9ffc83b;border-radius:999px;padding:9px 13px;color:#fff;background:#052d25cc;box-shadow:inset 0 1px #ffffff1c;font-weight:800;cursor:pointer;transition:.18s}
.pause:hover{border-color:#7dffa9;background:#0a4937}
.pause-screen{position:absolute;z-index:4;inset:0;display:none;place-content:center;gap:8px;padding:24px;text-align:center;background:#001b16c9;backdrop-filter:blur(5px)}
.pause-screen.show{display:grid}
.pause-screen strong{font-size:clamp(24px,5vw,44px);letter-spacing:.035em}
.pause-screen small{font-size:14px;color:#c8f6d8}
.game{scroll-margin-top:max(8px,env(safe-area-inset-top))}
body{padding-top:env(safe-area-inset-top)}
@media(max-width:600px){.pause{font-size:10px;padding:8px}}
/* Eco final celebration */
.game.final-celebration{animation:eco-final-glow .7s ease-in-out infinite alternate}
.game.final-celebration:after{content:"ARTIK HEM ŞEHİR, HEM ÜLKE DAHA TEMİZ!";position:absolute;z-index:3;left:50%;bottom:18%;transform:translateX(-50%);width:min(720px,88%);padding:10px 18px;border:1px solid #d9ffe8aa;border-radius:18px;color:#06351f;background:#dffff0e8;font-size:clamp(13px,2.6vw,20px);font-weight:1000;line-height:1.25;letter-spacing:.045em;text-align:center;box-shadow:0 0 36px #6dff9f}
@keyframes eco-final-glow{from{box-shadow:0 24px 70px #0009,0 0 0 6px #0a603d88,0 0 35px #1dd87555}to{box-shadow:0 24px 70px #0009,0 0 0 8px #d8ffebcc,0 0 80px #66ff9daa}}
/* Four-item start legend */
.eco-legend{grid-template-columns:repeat(4,1fr)}
@media(max-width:600px){.eco-legend{grid-template-columns:repeat(2,1fr)}}
/* Selectable mobile controls */
.control-choice{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:min(410px,100%);margin:0 auto 14px;padding:0;border:0}.control-choice legend{width:100%;margin-bottom:7px;color:#bde7d2;font-size:11px;font-weight:900;letter-spacing:.12em}.control-choice label{cursor:pointer}.control-choice input{position:absolute;opacity:0;pointer-events:none}.control-choice span{display:grid;grid-template-columns:auto 1fr;column-gap:7px;align-items:center;padding:9px 10px;border:1px solid #baffd02b;border-radius:12px;color:#dff8e8;background:#001a158f;text-align:left;font-size:15px;transition:.18s}.control-choice b{font-size:12px}.control-choice small{grid-column:2;margin:2px 0 0;color:#8fc7a5;font-size:9px}.control-choice input:checked+span{border-color:#91ffa9;color:#fff;background:#0c6546;box-shadow:0 0 0 2px #5af18b2e}.game.control-swipe .mobile-controls{display:none!important}.game.control-buttons .mobile-controls{display:flex}.mobile-controls{left:10px;right:10px;bottom:max(10px,env(safe-area-inset-bottom))}.mobile-controls button{width:68px;height:58px;border-color:#dffff080;background:#00271b94;backdrop-filter:blur(4px);box-shadow:0 7px 18px #0005}.pause-control-choice{display:flex;justify-content:center;gap:8px;margin:8px 0}.pause-control-choice button{padding:10px 12px;border:1px solid #baffd044;border-radius:999px;color:#dff8e8;background:#063a2e;font-size:11px;font-weight:900}.pause-control-choice button.active{border-color:#9affb3;color:#032518;background:#b8f548;box-shadow:0 0 18px #67f49955}@media(min-width:601px){.control-choice{display:none}.game.control-buttons .mobile-controls{display:none}}@media(max-width:600px){.control-choice span{padding:8px}.control-choice b{font-size:11px}.control-choice small{font-size:8px}}
/* Compact, scroll-safe start screen for phones and fullscreen */
.overlay{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
@media(max-width:600px){.overlay{display:block;padding:8px 10px}.overlay .card{width:100%;min-height:100%;margin:0 auto;padding:10px 12px 12px}.card .eco-badge{padding:4px 9px;font-size:9px}.card .start-logo{min-height:42px;margin:-2px auto -4px}.card .start-logo img{width:min(174px,58%)}.card h1{margin:1px 0 5px;font-size:24px;line-height:.92}.card p{display:none}.eco-legend{gap:3px;margin:3px auto 7px}.eco-legend span{padding:5px 2px;font-size:7px}.name-label{margin-bottom:7px;font-size:10px}.player-name{margin-top:3px;padding:8px 10px;font-size:14px}.control-choice{gap:5px;margin-bottom:8px}.control-choice legend{margin-bottom:4px;font-size:9px}.control-choice span{min-height:48px;padding:5px 7px;font-size:13px}.control-choice b{font-size:10px}.control-choice small{font-size:7px}.start{padding:10px 24px;font-size:14px}.card>.control-help{display:none}}
@media(max-height:700px){.overlay{display:block;padding:6px 10px}.overlay .card{width:min(620px,96%);margin:0 auto;padding:8px 14px 10px}.card .eco-badge{padding:3px 8px;font-size:8px}.card .start-logo{min-height:34px;margin:-4px auto -5px}.card .start-logo img{width:min(150px,40%)}.card h1{margin:0 0 3px;font-size:21px}.card p{display:none}.eco-legend{gap:3px;margin:2px auto 5px}.eco-legend span{padding:4px 2px;font-size:7px}.name-label{margin-bottom:5px;font-size:9px}.player-name{margin-top:2px;padding:7px 10px;font-size:13px}.control-choice{gap:5px;margin-bottom:6px}.control-choice legend{margin-bottom:3px;font-size:8px}.control-choice span{min-height:42px;padding:4px 7px}.control-choice b{font-size:9px}.control-choice small{font-size:7px}.start{padding:8px 22px;font-size:13px}.card>.control-help{display:none}}
@media(max-height:700px){.control-choice{display:grid}}
/* Breathing room between mission badge, brand logo and game title */
.card .eco-badge{margin-bottom:8px}.card .start-logo{margin:0 auto 10px}.card h1{margin-top:0}
@media(max-width:600px){.card .eco-badge{margin-bottom:5px}.card .start-logo{margin:0 auto 7px}.card h1{margin:0 0 5px}}
@media(max-height:700px){.card .eco-badge{margin-bottom:4px}.card .start-logo{margin:0 auto 5px}.card h1{margin:0 0 3px}}
/* Desktop reset: short browser windows must not inherit the phone layout */
@media(min-width:601px) and (pointer:fine){.overlay{display:grid;place-items:center;padding:20px}.overlay .card{width:min(570px,94%);min-height:0;margin:0;padding:25px 27px 23px}.card .eco-badge{padding:6px 11px;margin-bottom:18px;font-size:11px}.card .start-logo{min-height:82px;margin:0 auto 20px}.card .start-logo img{width:min(270px,78%)}.card h1{margin:0 0 11px;font-size:clamp(27px,5vw,44px);line-height:.95}.card p{display:block;margin:0 auto 14px;font-size:clamp(16px,2.3vw,18px)}.eco-legend{gap:7px;margin:0 auto 16px}.eco-legend span{padding:8px 6px;font-size:10px}.name-label{width:min(300px,100%);margin:0 auto 16px;font-size:12px}.player-name{margin-top:6px;padding:12px 14px;font-size:16px}.control-choice{display:none!important}.start{padding:13px 28px;font-size:17px}.card>.control-help{display:block}}
/* Clear row spacing on touch layouts without pushing the start button away */
@media(max-width:600px){.card .eco-badge{margin-bottom:8px}.card .start-logo{margin:0 auto 12px}.card h1{margin:0 0 7px}}
@media(max-height:700px) and (pointer:coarse){.card .eco-badge{margin-bottom:6px}.card .start-logo{margin:0 auto 8px}.card h1{margin:0 0 5px}}
/* Fullscreen controls and a softer, lower mission panel */
.mission{top:92px;background:#03241eb8;backdrop-filter:blur(5px)}
.game-tools{position:absolute;z-index:4;right:12px;top:126px;display:none;gap:6px}.game-tools button{padding:8px 10px;border:1px solid #baffd04d;border-radius:999px;color:#fff;background:#03271ec2;box-shadow:0 5px 16px #0005;font-size:10px;font-weight:900;white-space:nowrap;backdrop-filter:blur(5px)}
.game:fullscreen .game-tools{display:flex}.game:fullscreen .mission{top:72px;background:#03241eaa}.game:fullscreen .game-tools{top:116px}
@media(max-width:600px){.mission{top:72px;background:#03241eaa}.game-tools{right:7px;top:108px}.game-tools button{padding:7px 8px;font-size:9px}}
@media(max-height:700px){.game:fullscreen .game-tools{top:104px}.game:fullscreen .mission{top:62px}}
.game-tools{z-index:6}
/* Viewport-specific start-screen typography and row spacing */
@media(min-width:601px) and (pointer:fine){.overlay:not(.result-mode) .card h1{font-size:clamp(22px,4vw,35px)}}
@media(max-width:600px){.overlay:not(.result-mode) .card .eco-badge{margin-bottom:12px}.overlay:not(.result-mode) .card .start-logo{margin:0 auto 18px}.overlay:not(.result-mode) .card h1{margin:0 0 10px}}
@media(max-width:600px) and (max-height:700px){.overlay:not(.result-mode) .card .eco-badge{margin-bottom:9px}.overlay:not(.result-mode) .card .start-logo{margin:0 auto 13px}.overlay:not(.result-mode) .card h1{margin:0 0 8px}}
/* Focused game-over result card */
.result-mode{display:grid;place-items:center;padding:18px}.result-mode .card{width:min(480px,94%);min-height:0;padding:28px 30px 30px;border-color:#b8f54866;background:linear-gradient(160deg,#084433f5,#021d18f8);box-shadow:0 26px 80px #000a,0 0 0 1px #b8f54822,inset 0 1px #ffffff35}.result-mode .start-logo,.result-mode .eco-legend,.result-mode .name-label,.result-mode .control-choice,.result-mode .control-help{display:none!important}.result-mode .eco-badge{margin:0 0 18px}.result-mode .card h1{margin:0 0 20px;font-size:clamp(32px,6vw,52px);line-height:1;color:#effff4;letter-spacing:.015em}.result-mode .card p{display:block;max-width:none;margin:0 0 22px}.result-kicker{display:block;margin-bottom:9px;color:#b8f548;font-size:11px;font-weight:1000;letter-spacing:.18em}.result-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px}.result-stats>span{display:grid;gap:4px;padding:14px 10px;border:1px solid #caffdd24;border-radius:15px;background:#001a1599}.result-stats small{color:#94c9a9;font-size:9px;font-weight:900;letter-spacing:.1em}.result-stats strong{color:#fff;font-size:25px}.result-status{display:block;margin-top:11px;padding:9px 10px;border-radius:10px;color:#d8ffe6;background:#0b5a4090;font-size:12px}.result-mode .start{min-width:210px;padding:13px 25px;font-size:16px}
@media(max-width:600px){.result-mode{display:grid;padding:12px}.result-mode .card{width:min(420px,100%);min-height:0;padding:24px 16px 26px}.result-mode .eco-badge{margin-bottom:16px}.result-mode .card h1{margin-bottom:18px;font-size:34px}.result-mode .card p{margin-bottom:20px}.result-stats strong{font-size:22px}.result-mode .start{padding:12px 22px;font-size:15px}}
/* Keep optional touch buttons visible on every mobile game shape */
@media(max-width:900px) and (pointer:coarse){.game.playing.control-buttons .mobile-controls,.game:fullscreen.control-buttons .mobile-controls{display:flex!important;z-index:7;left:8px;right:8px;top:56%;bottom:auto;transform:translateY(-50%)}.game.playing.control-buttons .mobile-controls button,.game:fullscreen.control-buttons .mobile-controls button{width:62px;height:62px;border-color:#dffff0b8;background:#003426d9;box-shadow:0 8px 24px #0008,0 0 0 2px #78efa02b;font-size:25px}}
/* A separate stage prevents mobile fullscreen from stretching game graphics */
.game-stage{position:absolute;inset:0;overflow:hidden}
@media(orientation:portrait){.game:fullscreen{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;min-height:0!important;margin:0!important;aspect-ratio:auto!important;transform:none!important;border:0;border-radius:0;background:radial-gradient(circle at 50% 50%,#073d30 0,#001713 72%)}.game:fullscreen .game-stage{left:0;right:auto;top:50%;bottom:auto;width:100vw;height:88.8889vw;transform:translateY(-50%);box-shadow:0 0 55px #0009}.game:fullscreen::backdrop{background:#001713}}

/* Bursa Fun Club identity and navigation */
@font-face{font-family:'Bebas Neue';src:url('/fonts/bebas-neue.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.brand-mark{overflow:hidden;padding:3px;background:linear-gradient(145deg,#0c7b4c,#20c96e);font-size:0}
.brand-mark img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 3px 5px #0005)}
.game-wordmark{margin:0 auto 12px!important;font-family:'Bebas Neue',Impact,Arial,sans-serif;font-size:clamp(38px,7vw,64px)!important;font-weight:400;line-height:.9!important;letter-spacing:.025em!important;white-space:nowrap;text-transform:uppercase}
.game-wordmark span{color:#fff}.game-wordmark em{color:var(--lime);font-style:normal}
.start-actions{display:flex;align-items:center;justify-content:center;gap:10px;margin:0 auto}
.games-return,.menu-return{border:1px solid #a9ffc83b;border-radius:999px;color:#fff;background:#052d25cc;box-shadow:inset 0 1px #ffffff1c;font-weight:900;text-decoration:none;cursor:pointer;transition:.18s}
.games-return{padding:13px 18px;font-size:13px;letter-spacing:.04em}.games-return:hover,.menu-return:hover{border-color:#7dffa9;background:#0a4937}
.menu-return{display:none;margin-left:4px;padding:9px 13px}.game-active .menu-return{display:inline-flex}
.result-mode .start-actions{display:flex}.result-mode .games-return{display:none}
@media(max-width:600px){.game-wordmark{margin:2px auto 10px!important;font-size:clamp(31px,10.2vw,44px)!important}.start-actions{gap:7px}.games-return{padding:10px 12px;font-size:11px}.menu-return{padding:8px;font-size:10px}.brand-mark{flex:0 0 40px}.brand-mark img{width:34px;margin:auto}}
@media(max-height:700px) and (pointer:coarse){.game-wordmark{margin:0 auto 6px!important;font-size:30px!important}.games-return{padding:8px 10px}.start-actions .start{padding:8px 15px}}
