@font-face{font-family:Teko;src:url('fonts/Teko-Medium-v23.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
:root{color-scheme:dark;--accent:#00d0e7;--bg:#090c10;--panel:#121820;--text:#f0f4f5;--muted:#adb8c2;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif;background:var(--bg);color:var(--text)}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 50% 14%,#16323c99,transparent 49%),var(--bg);min-height:100svh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
[hidden]{display:none!important}button,a,summary{-webkit-tap-highlight-color:transparent}button,summary{cursor:pointer}a{color:inherit}button{font:inherit}:focus-visible{outline:2px solid #b5f6ff;outline-offset:5px}
.page{width:min(100%,460px);margin:0 auto;padding:0 24px}.brand{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:25px 0 19px;border-bottom:1px solid #ffffff15}.brand a{font-family:Teko,Impact,sans-serif;font-size:1.5rem;letter-spacing:2px;text-decoration:none}.online{font-size:.75rem;letter-spacing:1.4px;color:#b8c5ca}
.hero{text-align:center;padding:31px 0 0}.wolf{display:block;width:128px;height:128px;object-fit:contain;margin:0 auto 25px;filter:drop-shadow(0 0 22px #00b9d01a)}.eyebrow{font-size:.75rem;letter-spacing:3px;color:#b0c4cc;margin:0 0 16px}h1{font-family:Teko,Impact,sans-serif;font-weight:500;font-size:clamp(2.65rem,12vw,3.6rem);line-height:1;letter-spacing:1px;margin:0;color:var(--text)}h1 span{color:var(--accent)}.description{font-size:1rem;line-height:1.6;color:var(--muted);margin:19px 0 28px}
.primary,.guide>summary{width:100%;border:0;border-radius:10px;padding:16px;display:flex;justify-content:center;align-items:center;gap:10px;background:var(--accent);color:#061014;font-size:1rem;font-weight:600;min-height:54px;text-align:center;text-decoration:none}.primary{margin:0 0 13px}.guide>summary{list-style:none}.guide>summary::-webkit-details-marker{display:none}.guide>summary span{font-size:1.3rem}.guide[open]>summary span{transform:rotate(180deg)}.guide>summary:hover,.primary:hover{filter:brightness(1.08)}.native-ready .guide>summary{background:#18232c;color:var(--text)}.small{font-size:.75rem;text-align:center;line-height:1.6;color:var(--muted);margin:13px 0 0}
.guide-body{padding:22px 18px 8px;margin:14px 0 0;border:1px solid #ffffff19;border-radius:14px;background:var(--panel)}.guide-body>h2{font-family:Teko,Impact,sans-serif;font-size:1.8rem;line-height:1.1;letter-spacing:.5px;font-weight:500;margin:0 0 15px}.platforms{display:flex;gap:8px;margin-bottom:24px}.platforms button{flex:1;min-height:44px;border:1px solid #44525f;border-radius:7px;background:transparent;color:#bdc9d1;font-size:.875rem}.platforms [aria-pressed="true"]{background:#273c46;border-color:var(--accent);color:#fff}
ol{list-style:none;padding:0;margin:0;display:grid;gap:26px}li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px}.number{font-family:Teko,Impact,sans-serif;font-size:1.9rem;color:var(--accent);line-height:1.1}h3{font-size:1rem;font-weight:600;margin:0 0 8px;line-height:1.35}li p{font-size:.875rem;color:var(--muted);line-height:1.6;margin:0 0 12px}.ui-example{display:flex;align-items:center;gap:10px;background:#242d37;color:#edf4f8;border-radius:8px;padding:13px;font-size:.875rem;line-height:1.5}.ui-example svg{width:21px;height:21px;flex:none;color:#7ac8ff}.plus-icon,.menu-icon{font-size:1.5rem;color:#7ac8ff;line-height:1;flex:none}.result{display:flex;align-items:center;gap:10px;background:#242d37;border-radius:8px;padding:10px;font-size:.875rem}.result img{border-radius:8px;width:40px;height:40px}.check{margin-left:auto;color:var(--accent);font-size:1.2rem}.done{font-size:.875rem;text-align:center;color:#d4e2e7;line-height:1.5;margin:25px 0 18px}
.bottom{text-align:center;padding:20px 0 26px}.bottom a{display:inline-flex;gap:8px;align-items:center;justify-content:center;min-height:44px;font-size:.875rem;color:#e0e8ec;text-decoration:none}.bottom a:hover{text-decoration:underline}.bottom p{font-size:.75rem;color:#9eabb5;line-height:1.5;margin:12px 0 0}footer{padding:17px 0 23px;border-top:1px solid #ffffff15;display:flex;justify-content:space-between;gap:12px;color:#a6b2bc;font-size:.75rem;letter-spacing:1px}.browser-hint,.status,.noscript{font-size:.875rem;line-height:1.6;color:#c5e7ed;text-align:center}.browser-hint{background:#18242b;padding:14px;border-radius:9px;margin:0 0 20px}.status:empty{display:none}.qr-card{display:flex;align-items:center;gap:20px;background:var(--panel);border:1px solid #ffffff19;padding:20px;border-radius:14px;margin-top:26px}.qr-card img{width:116px;height:116px;background:white;flex:none}.qr-card h2{font-family:Teko,Impact,sans-serif;font-size:1.5rem;font-weight:500;line-height:1.1;margin:0 0 9px}.qr-card p{font-size:.875rem;line-height:1.5;color:var(--muted);margin:0 0 10px}.qr-card span{font-size:.75rem;color:#d6e9ee;overflow-wrap:anywhere}
@media(min-width:700px){body{padding:32px 0}.page{padding:0 32px;border:1px solid #ffffff15;border-radius:20px;background:radial-gradient(ellipse at 50% 20%,#16323c55,transparent 45%),#090c10;box-shadow:0 22px 60px #0004}}
@media(max-width:360px){.page{padding:0 18px}.guide-body{padding:18px 12px 6px}.brand a{font-size:1.3rem}.description{font-size:.9375rem}.eyebrow{letter-spacing:2px}.qr-card{flex-direction:column;text-align:center}}
@media(prefers-reduced-motion:no-preference){.guide>summary span{transition:transform .15s ease}}