:root{--bg: #0f172a;--card: #111827;--text: #e5e7eb;--muted: #9ca3af;--accent: #22c55e;--accent-2: #3b82f6;--border: #1f2937}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{min-height:100%;display:flex;flex-direction:column}.topbar{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#0f172acc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:1px solid var(--border)}.title{font-weight:600}.badge{padding:4px 8px;border:1px solid var(--border);border-radius:12px;color:var(--muted);font-size:12px}.banner{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:10px 12px;background:#0b1220;border-bottom:1px solid var(--border);font-size:14px;color:var(--muted)}.content{flex:1;display:flex;align-items:center;justify-content:center;padding:16px}.panel{width:100%;max-width:560px;background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;box-shadow:0 10px 20px #00000040}.panel-header{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}.panel-title{margin:0;font-size:20px}.panel-subtitle{color:var(--muted);font-size:13px}.stack{display:flex;flex-direction:column;gap:12px}.center{text-align:center}.row{display:flex;gap:8px;align-items:center}.input{flex:1;padding:10px 12px;border-radius:10px;border:1px solid var(--border);background:#0b1220;color:var(--text);font-size:16px}.btn{padding:12px 16px;background:var(--accent);color:#0b1220;border:none;border-radius:12px;font-weight:600}.btn.secondary{background:var(--accent-2);color:#0b1220}.btn.small{padding:8px 12px;border-radius:10px}.chip{padding:8px 12px;background:#0b1220;border:1px solid var(--border);border-radius:999px;color:var(--text)}.list{margin-top:4px;border-top:1px solid var(--border)}.list-item{padding:8px 10px;border-bottom:1px solid var(--border);color:var(--muted)}.big{font-size:56px;letter-spacing:.5px;margin:8px 0}.muted{color:var(--muted)}.hint{margin-top:8px;color:var(--muted);font-size:12px}.footer{position:relative;text-align:center;color:var(--muted);padding:12px;font-size:13px}.footer-center{pointer-events:none}.footer-link{position:absolute;bottom:12px;color:var(--text);text-decoration:none;font-weight:600;background:transparent;padding:6px 8px;border-radius:8px;border:1px solid transparent}.footer-link.left{left:12px}.footer-link.right{right:12px}.footer-link:hover{border-color:var(--border)}.app.portrait_primary .panel{transform:translateY(0);opacity:1}.app.landscape_primary .panel{transform:translate(0);opacity:1}.app.landscape_secondary .panel{transform:rotate(-.5deg);opacity:1}.app.portrait_secondary .panel{transform:rotate(180deg);transform-origin:center center;opacity:1}.app.portrait_secondary .topbar,.app.portrait_secondary .footer,.app.portrait_secondary .footer-link{transform:rotate(180deg)}.content,.topbar,.footer,.panel{transition:transform .18s ease,opacity .18s ease}.app.portrait_secondary .topbar{padding-bottom:calc(12px + env(safe-area-inset-bottom))}.app.portrait_secondary .footer{padding-top:calc(12px + env(safe-area-inset-top))}button,input{touch-action:manipulation}@media (min-width: 640px){.big{font-size:64px}}a{color:#f5f5f5}a:focus{color:#22c55e}.btn,.chip{transition:transform 80ms ease,background-color .12s ease,box-shadow .12s ease;touch-action:manipulation;position:relative;overflow:hidden}.ripple{position:absolute;border-radius:50%;background:#ffffff59;transform:scale(0);animation:ripple .45s ease-out forwards;pointer-events:none}@keyframes ripple{to{transform:scale(12);opacity:0}}@media (hover: hover) and (pointer: fine){.btn:hover,.chip:hover{filter:brightness(1.05)}}.btn:focus-visible,.chip:focus-visible{outline:2px solid rgba(59,130,246,.8);outline-offset:2px}.btn:active,.chip:active{transform:scale(.98);filter:brightness(.95)}