/* ── SlitherPepe Shared Styles ── */
:root{
  --w:720px;--h:1280px;
  --panel:rgba(0,0,0,.35);--stroke:rgba(255,255,255,.10);--text:#f3f3f3;
  --accent:#00ff7a;--accent2:#00e066;--card:rgba(8,18,6,.78);--card-border:rgba(0,255,100,.12);
  --muted:rgba(220,255,220,.55);--gold:#ffa832;
}
*{margin:0;padding:0;box-sizing:border-box;}
html,body{margin:0;height:100%;background:#000;color:var(--text);font-family:'Rajdhani',system-ui,sans-serif;font-weight:600;}
body{display:flex;align-items:center;justify-content:center;}
#shell{width:min(var(--w),100vw);height:min(var(--h),100vh);position:relative;overflow:hidden;border-radius:18px;box-shadow:0 20px 60px rgba(0,0,0,.65);background:#000;aspect-ratio:9/16;}
@media(pointer:coarse){
  html,body{height:100%;overscroll-behavior:none;}
  body{align-items:stretch;justify-content:center;}
  #shell{border-radius:0;width:min(100vw,calc(100vh * 0.5625));height:100vh;max-height:100vh;max-width:100vw;}
}
.page{position:absolute;inset:0;display:flex;flex-direction:column;background:#050a04;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;touch-action:pan-y;min-height:100%;}
.page::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;z-index:0;pointer-events:none;background:url('./assets/game2.png') center/cover no-repeat;opacity:0.5;}
.page>*{position:relative;z-index:1;}
.topbar{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;background:rgba(0,0,0,.65);backdrop-filter:blur(8px);border-bottom:1px solid var(--card-border);position:sticky;top:0;z-index:10;flex-shrink:0;}
.topbar h1{font-family:'Orbitron',sans-serif;font-weight:900;font-size:16px;letter-spacing:2px;color:var(--accent);}
.back-btn{appearance:none;border:1px solid var(--stroke);background:rgba(255,255,255,.08);color:var(--text);border-radius:10px;padding:8px 14px;cursor:pointer;font-weight:800;font-size:12px;font-family:'Rajdhani',sans-serif;}
.back-btn:active{transform:translateY(1px);}
.content{padding:14px 12px 40px;display:flex;flex-direction:column;gap:12px;}
.card{background:var(--card);border:1px solid var(--card-border);border-radius:14px;padding:12px;backdrop-filter:blur(6px);}
.card:hover{border-color:rgba(0,255,100,.25);}
.card-title{font-family:'Orbitron',sans-serif;font-weight:700;font-size:12px;letter-spacing:1px;color:var(--accent);margin-bottom:8px;}
.btn{appearance:none;border:1px solid var(--accent);background:rgba(0,255,100,.08);color:var(--accent);border-radius:10px;padding:8px 16px;cursor:pointer;font-weight:700;font-family:'Orbitron',sans-serif;font-size:11px;letter-spacing:1px;text-decoration:none;display:inline-flex;align-items:center;gap:6px;transition:all .2s;}
.btn:hover{background:rgba(0,255,100,.18);box-shadow:0 0 14px rgba(0,255,100,.2);}
.btn-gold{border-color:var(--gold);background:rgba(255,168,50,.08);color:var(--gold);}
.btn-gold:hover{background:rgba(255,168,50,.18);box-shadow:0 0 14px rgba(255,168,50,.2);}
.btn-dim{border-color:var(--stroke);background:rgba(255,255,255,.06);color:var(--muted);}
.input{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--card-border);background:rgba(0,0,0,.5);color:var(--text);font-size:13px;font-family:'Rajdhani',sans-serif;font-weight:600;outline:none;}
.input:focus{border-color:var(--accent);box-shadow:0 0 8px rgba(0,255,100,.15);}
.label{font-family:'Orbitron',sans-serif;font-size:10px;font-weight:700;letter-spacing:1px;color:var(--muted);margin-bottom:4px;}
.pill{display:inline-flex;align-items:center;gap:5px;padding:4px 10px;border-radius:999px;background:rgba(0,0,0,.5);border:1px solid var(--card-border);font-weight:900;font-size:12px;}
.row{display:flex;align-items:center;gap:8px;}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.muted{color:var(--muted);font-size:12px;}
.sep{border:none;border-top:1px solid rgba(0,255,100,.08);margin:4px 0;}
.footer-links{text-align:center;padding:10px 0 20px;font-size:9px;}
.footer-links a{color:var(--muted);text-decoration:none;margin:0 12px;}
@media(max-width:380px){
  .topbar h1{font-size:14px;}
  .card-title{font-size:10px;}
  .btn{font-size:9px;padding:6px 10px;}
}