:root{--bg1: #8fb9d6;--bg2: #bfd6e6;--bg3: #e9f1f6;--card: #f2f7fb;--card2: #e6f0f7;--ink: #1e3a5f;--ink2: #244c73;--muted: #2e4a63;--shadow: 0 10px 30px rgba(0, 0, 0, .14);--shadow-soft: 0 6px 18px rgba(0, 0, 0, .12);--radius: 24px;--radius2: 20px}*{box-sizing:border-box}html,body{height:100%}body{margin:0;font-family:ui-rounded,system-ui,-apple-system,BlinkMacSystemFont,SF Pro Rounded,SF Pro Display,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--ink);background:linear-gradient(180deg,#e8e8e8,#d5d5d5 50%,#c9c9c9)}a{color:inherit;text-decoration:none}button{font:inherit}.shell{min-height:100svh;display:flex;align-items:center;justify-content:center;padding:18px}.phone{width:min(390px,100%);height:min(844px,100svh);border-radius:34px;background:#8fb9d6;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.35);overflow:hidden;position:relative}.content{height:100%;display:flex;flex-direction:column;padding:22px 18px 18px;gap:16px;overflow-y:auto;-webkit-overflow-scrolling:touch}.header{display:flex;flex-direction:column;gap:6px;padding:8px 6px 4px}.brand{display:flex;flex-direction:column;align-items:flex-start;gap:8px}.brand h1{margin:0;line-height:0}.brand .logo{height:80px;width:auto;margin:0;filter:drop-shadow(0 2px 8px rgba(0,0,0,.15))}.brand .pill{font-size:14px;color:#ffffffeb;background:#1e3a5f38;border:1px solid rgba(255,255,255,.25);padding:6px 10px;border-radius:999px}.subtitle{margin:0;font-size:18px;color:#fffffff2}.divider{height:1px;background:#ffffff61;margin-top:10px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:8px 4px 0}.tile{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow-soft);border:1px solid rgba(255,255,255,.65);padding:14px 12px;height:124px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;transition:transform .08s ease}.tile:active{transform:scale(.985)}.tile .icon{width:52px;height:52px;border-radius:18px;display:grid;place-items:center;background:#4c8ec924;border:1px solid rgba(36,76,115,.12);font-weight:1000;font-size:26px}.tile .label{font-size:18px;font-weight:600;color:var(--ink2);text-align:center;line-height:1.15}.bottom-actions{margin-top:auto;display:flex;gap:12px;padding:6px 4px 2px}.btn{flex:1;height:52px;border-radius:var(--radius2);border:1px solid rgba(255,255,255,.65);background:var(--card2);box-shadow:var(--shadow-soft);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--ink2)}.btn:active{transform:scale(.99)}.topbar{display:flex;align-items:center;justify-content:space-between;padding:6px 4px 0}.back{display:inline-flex;align-items:center;gap:8px;padding:10px 12px;border-radius:999px;background:#f2f7fbdb;border:1px solid rgba(255,255,255,.8);box-shadow:var(--shadow-soft);font-weight:800;color:var(--ink2)}.back:active{transform:scale(.99)}.page-title{margin:0;font-size:28px;font-weight:800;color:#fff;text-shadow:0 2px 14px rgba(0,0,0,.18)}.page-subtitle{margin:0;font-size:16px;color:#fffffff2}.card{background:#f2f7fbeb;border-radius:26px;border:1px solid rgba(255,255,255,.72);box-shadow:var(--shadow-soft);padding:16px}.preview-window{height:230px;border-radius:22px;background:linear-gradient(180deg,#dceaf3eb,#f2f7fbeb);border:1px solid rgba(255,255,255,.7);overflow:hidden;position:relative}.text{display:flex;flex-direction:column;gap:10px}.text p{margin:0;font-size:18px;line-height:1.35;color:var(--muted)}.primary{display:flex;align-items:center;justify-content:center;height:56px;width:100%;border-radius:24px;border:1px solid rgba(255,255,255,.4);background:#4c8ec9eb;box-shadow:0 12px 26px #1e3a5f38;color:#fff;font-size:20px;font-weight:800;text-decoration:none;cursor:pointer;transition:all .2s ease}.primary:active{transform:scale(.99)}.footer-back{display:flex;justify-content:center}.game-actions{display:flex;gap:12px;align-items:center;justify-content:space-between}.game-actions .back{flex-shrink:0}.game-actions .primary{flex:1;width:auto}small.hint{display:block;margin-top:8px;color:#244c73bf;font-size:14px}@media(max-width:768px){body{background:#8fb9d6}.shell{padding:0}.phone{width:100%;height:100svh;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;border:none}.content{padding:16px 18px 18px}}@media(prefers-reduced-motion:reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}