.header{max-width:var(--content-width);height:var(--header-height);margin:auto;padding:.8rem var(--page-gutter);display:flex;align-items:center;justify-content:space-between;gap:1rem;position:relative;z-index:var(--z-header)}.brand{display:inline-flex;align-items:center;gap:.65rem;min-height:44px}.brand-mark{width:2.4rem;height:2.4rem;color:var(--sky-500)}.brand strong{font-size:1.35rem;letter-spacing:-.06em;font-weight:800;color:var(--ink-strong)}.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.55rem 1.1rem;border:1px solid var(--border);border-radius:var(--radius-pill);background:linear-gradient(135deg,#fff,#eff8ff);box-shadow:var(--shadow-card);font-size:.85rem;font-weight:600;line-height:1.4;color:var(--ink);transition:background .18s,box-shadow .18s,transform .18s}.button:hover{background:var(--sky-100);box-shadow:0 4px 14px #69aeef24}.button:active{transform:translateY(1px)}.button--primary{background:linear-gradient(125deg,#7dd8ff,var(--sky-500));border-color:#83bdff;color:var(--ink-strong);font-weight:700}.button--square{width:44px;padding:.5rem;border-radius:var(--radius-md)}.login-button{min-width:6.2rem}.card{background:linear-gradient(140deg,#ffffffed,#f7fbffd9);border:1px solid var(--border);border-radius:var(--radius-md);box-shadow:var(--shadow-card)}.panel{border-radius:var(--radius-lg);box-shadow:var(--shadow-panel);padding:var(--space-4)}.icon-tile{display:flex;align-items:center;justify-content:center;width:3.5rem;height:3.5rem;border-radius:.95rem;background:radial-gradient(circle at 27% 20%,#fff 0,#e8f7ff 45%,#d9edff);border:1px solid #d9efff;box-shadow:var(--shadow-icon);color:var(--sky-500);flex-shrink:0}.icon-tile .icon{width:2.2rem;height:2.2rem;filter:drop-shadow(0 2px 1px #6facda28)}.icon-tile--small{width:2.9rem;height:2.9rem;border-radius:.75rem}.icon-tile--small .icon{width:1.75rem;height:1.75rem}.icon-tile--locked{color:#88a1c0;background:linear-gradient(145deg,#f7faff,#e9eff7);border-color:#e4edf8}.info-note{display:flex;align-items:flex-start;gap:.65rem;padding:.85rem .9rem;margin-top:1.15rem;border:1px solid var(--border);border-radius:var(--radius-md);background:#f4faffd9;font-size:.77rem;line-height:1.55;color:var(--muted);box-shadow:var(--shadow-card)}.info-note>.icon{width:1.2rem;height:1.2rem;margin-top:.1rem;color:#74afdf}.badge{display:inline-flex;align-items:center;justify-content:center;background:linear-gradient(120deg,#e1f3ff,#c9e5ff);border-radius:var(--radius-pill);padding:.25rem .65rem;font-size:.85rem;font-weight:700;color:var(--ink);white-space:nowrap}.navigation{position:fixed;bottom:calc(.55rem + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));width:calc(100% - 1.25rem);max-width:29rem;min-height:var(--nav-height);padding:.4rem;gap:.15rem;border:1px solid #d5eafe;border-radius:1.8rem;background:linear-gradient(135deg,#ffffffed,#f2faffed);backdrop-filter:blur(20px);box-shadow:var(--shadow-nav);z-index:var(--z-nav)}.nav-link{min-width:0;min-height:4rem;padding:.5rem .05rem .45rem;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;border-radius:1.25rem;color:var(--muted);font-size:clamp(.64rem,2.55vw,.74rem);white-space:nowrap;transition:background .2s,color .2s}.nav-link .icon{width:1.5rem;height:1.5rem}.nav-link:hover{background:#eaf6ff}.nav-link[aria-current=page]{color:#176bc4;background:linear-gradient(145deg,#d6eaff,#e4f6ff);box-shadow:inset 0 1px 0 #effbff}.nav-link[aria-current=page] .icon{fill:#93c9ff66;filter:drop-shadow(0 2px 1px #87b9ec40)}.character{display:block;aspect-ratio:1;flex-shrink:0;background-image:none;background-repeat:no-repeat;background-size:200% 200%;background-position:0 0;filter:drop-shadow(0 5px 3px #79a8cc13)}.character--wave{background-position:0 0}.character--star{background-position:100% 0}.character--point{background-position:0 100%}.character--heart{background-position:100% 100%}.sparkles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}.sparkles .icon{position:absolute;width:1rem;height:1rem;color:#88c0ff8c}.sparkles .icon:nth-child(1){left:8%;top:11%;width:1.3rem;height:1.3rem}.sparkles .icon:nth-child(2){right:18%;top:8%}.sparkles .icon:nth-child(3){left:5%;top:45%;width:.8rem}.sparkles .icon:nth-child(4){right:3%;top:37%;width:1.4rem;height:1.4rem}.sparkles .icon:nth-child(5){right:25%;bottom:12%;width:.75rem}.sparkles .icon:nth-child(6){left:24%;bottom:6%;color:#c8e8ff}.progress{height:.75rem;overflow:hidden;border-radius:var(--radius-pill);background:#dceafb;box-shadow:inset 0 1px 2px #6d9fc918}.progress>span{display:block;height:100%;width:var(--progress);border-radius:inherit;background:linear-gradient(100deg,#82dcff,#58a3f6);border:1px solid #74baff;box-shadow:inset 0 1px 2px #ffffff90}.progress--small{height:.45rem}.tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:.25rem;border-radius:var(--radius-pill);background:#eaf2fc;gap:.2rem;margin:1rem 0 .85rem}.tab{border-radius:var(--radius-pill);padding:.55rem .2rem;min-height:44px;font-size:.85rem;font-weight:600}.tab[aria-selected=true]{background:linear-gradient(120deg,#88dcff,#62a7fa);box-shadow:inset 0 1px 0 #d1efff,0 2px 6px #649edf20;color:var(--ink-strong)}.tab:hover:not([aria-selected=true]){background:#ffffff80}dialog{width:calc(100% - 2rem);max-width:28rem;border:1px solid var(--sky-200);border-radius:var(--radius-xl);padding:1.6rem;background:linear-gradient(145deg,#fff,#edf7ff);color:var(--ink);box-shadow:0 24px 80px #173b7430}dialog::backdrop{background:#163a6952;backdrop-filter:blur(5px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1rem}.dialog-body{color:var(--muted);font-size:.95rem;line-height:1.8}.dialog-body p+p{margin-top:.7rem}.dialog-actions{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.3rem}.dialog-actions .button{flex:1}.dialog-status{font-size:.8rem;margin-top:1rem}.copy-fallback{width:100%;padding:.9rem;margin-top:1rem;border:1px solid var(--sky-300);border-radius:var(--radius-sm);color:var(--ink);background:var(--white)}.toast{position:fixed;bottom:calc(var(--nav-height) + 1.5rem + env(safe-area-inset-bottom));left:50%;transform:translate(-50%,10px);padding:.7rem 1.2rem;border-radius:var(--radius-pill);background:var(--ink);color:var(--white);box-shadow:0 8px 22px #16356b30;max-width:calc(100% - 2rem);width:max-content;text-align:center;font-size:.85rem;opacity:0;pointer-events:none;z-index:var(--z-toast);transition:opacity .2s,transform .2s}.toast.visible{opacity:1;transform:translate(-50%,0)}@media(min-width:640px){.header{max-width:40rem}.navigation{max-width:37rem}.nav-link{font-size:.8rem}}@media(min-width:1000px){.header{max-width:var(--content-width);height:5.5rem;padding:1rem 2rem}.brand-mark{width:2.8rem;height:2.8rem}.brand strong{font-size:1.5rem}.navigation{max-width:40rem;bottom:1.2rem}.nav-link{flex-direction:row;gap:.6rem;font-size:.9rem}.icon-tile{width:4rem;height:4rem}.icon-tile--small{width:3rem;height:3rem}}