.navbar-brand{align-items:center;gap:1rem;display:flex}.browse-link{border-radius:var(--radius-full);color:var(--color-text-secondary);transition:background var(--transition-fast), color var(--transition-fast);align-items:center;gap:.4rem;padding:.45rem .85rem;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex}.browse-link:hover{background:var(--color-surface-hover);color:var(--color-text)}.browse-link.active{background:var(--color-primary-bg);color:var(--color-primary)}.icon-btn{border-radius:var(--radius-full);width:38px;height:38px;color:var(--color-text-secondary);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:inline-flex}.icon-btn:hover{background:var(--color-surface-hover);color:var(--color-text)}.icon-btn:focus-visible,.profile-trigger:focus-visible,.navbar-toggle:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.btn-feedback{white-space:nowrap;color:var(--color-text-muted);cursor:pointer;background:0 0;border:0;align-items:center;gap:.35rem;display:inline-flex}.btn-feedback:hover{color:var(--color-primary)}.feedback-backdrop{z-index:100;background:#00000073;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.feedback-dialog{border:1px solid var(--color-border-light);border-radius:var(--radius-lg);background:var(--color-bg-white);width:min(100%,30rem);max-width:30rem;color:var(--color-text);box-shadow:var(--shadow-lg);gap:.75rem;padding:1.5rem;display:grid;position:relative}.feedback-dialog h2,.feedback-dialog p{margin:0}.feedback-dialog label{gap:.35rem;font-size:.9rem;display:grid}.feedback-dialog select,.feedback-dialog textarea{border:1px solid var(--color-border-light);border-radius:var(--radius-sm);background:var(--color-bg-white);width:100%;color:var(--color-text);font:inherit;padding:.6rem}.feedback-close{color:inherit;cursor:pointer;background:0 0;border:0;position:absolute;top:.75rem;right:.75rem}.feedback-actions{justify-content:flex-end;gap:.5rem;display:flex}.feedback-error{color:var(--color-danger,#b42318)}.feedback-success{color:var(--color-success,#18794e)}.profile-menu{position:relative}.profile-trigger{border:1px solid var(--color-border-light);border-radius:var(--radius-full);background:var(--color-bg-white);cursor:pointer;transition:border-color var(--transition-fast), box-shadow var(--transition-fast);align-items:center;gap:.5rem;max-width:240px;padding:.25rem .6rem .25rem .25rem;display:inline-flex}.profile-trigger:hover{border-color:var(--color-primary-light)}.profile-avatar{border-radius:var(--radius-full);background:var(--color-primary);color:#fff;letter-spacing:.5px;flex-shrink:0;justify-content:center;align-items:center;width:30px;height:30px;font-size:.75rem;font-weight:800;display:inline-flex}.profile-name{color:var(--color-text);white-space:nowrap;text-overflow:ellipsis;font-size:.875rem;font-weight:600;overflow:hidden}.profile-chevron{color:var(--color-text-tertiary);transition:transform var(--transition-fast);flex-shrink:0}.profile-trigger[aria-expanded=true] .profile-chevron{transform:rotate(180deg)}.profile-dropdown{text-align:left;z-index:1000;background:var(--color-bg-white);border:1px solid var(--color-border-light);border-radius:var(--radius-lg);min-width:260px;box-shadow:var(--shadow-dropdown);padding:.5rem;animation:.18s cubic-bezier(.22,1,.36,1) dropdownIn;position:absolute;top:calc(100% + .5rem);right:0}.dropdown-head{flex-direction:column;gap:.15rem;padding:.6rem .75rem .5rem;display:flex}.dropdown-head-name{color:var(--color-text);word-break:break-word;font-size:.9375rem;font-weight:700}.dropdown-head-username{color:var(--color-text-tertiary);word-break:break-word;font-size:.8125rem}.dropdown-badges{flex-wrap:wrap;gap:.35rem;padding:.35rem .75rem .5rem;display:flex}.user-badge{letter-spacing:.2px;white-space:nowrap;border-radius:999px;align-items:center;gap:.3rem;padding:.22rem .55rem;font-size:.6875rem;font-weight:700;display:inline-flex}.badge-monthly{background:var(--color-primary-bg);color:var(--color-primary);border:1px solid var(--color-primary-light)}.badge-alltime{background:var(--color-warning-bg);color:var(--color-warning);border:1px solid var(--color-warning)}.dropdown-sep{background:var(--color-border-lighter);height:1px;margin:.35rem .25rem}.dropdown-item{text-align:left;border-radius:var(--radius-sm);width:100%;color:var(--color-text);cursor:pointer;transition:background var(--transition-fast);background:0 0;border:none;justify-content:flex-start;align-items:center;gap:.65rem;padding:.6rem .75rem;font-size:.875rem;font-weight:500;text-decoration:none;display:flex}.dropdown-item:hover,.dropdown-item:focus-visible{background:var(--color-surface-hover)}.dropdown-item:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px}.dropdown-danger{color:var(--color-error)}.dropdown-danger:hover{background:var(--color-error-bg)}.navbar-toggle{border-radius:var(--radius-full);width:40px;height:40px;color:var(--color-text);cursor:pointer;transition:background var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;display:none}.navbar-toggle:hover{background:var(--color-surface-hover)}.navbar-mobile{top:var(--navbar-height);background:var(--color-bg-white);border-bottom:1px solid var(--color-border-light);box-shadow:var(--shadow-md);max-height:calc(100vh - var(--navbar-height));z-index:99;display:none;position:absolute;left:0;right:0;overflow-y:auto}.navbar-mobile.active{display:block}.mobile-menu-content{flex-direction:column;gap:.5rem;padding:1.25rem 1.5rem 1.5rem;display:flex}.mobile-account-head{align-items:center;gap:.75rem;padding:.5rem 0 .75rem;display:flex}.mobile-account-head .profile-avatar{width:42px;height:42px;font-size:.9375rem}.mobile-account-meta{flex-direction:column;gap:.1rem;min-width:0;display:flex}.mobile-account-name{color:var(--color-text);word-break:break-word;font-size:1rem;font-weight:700}.mobile-account-username{color:var(--color-text-tertiary);word-break:break-word;font-size:.8125rem}.mobile-nav-link{border-radius:var(--radius-sm);color:var(--color-text);transition:background var(--transition-fast);align-items:center;gap:.75rem;padding:.75rem .5rem;font-size:.9375rem;font-weight:500;text-decoration:none;display:flex}.mobile-nav-link:hover{background:var(--color-surface-hover)}.mobile-nav-link:focus-visible{outline:2px solid var(--color-primary);outline-offset:-2px}.mobile-utility-row{border-top:1px solid var(--color-border-lighter);justify-content:space-between;align-items:center;gap:.75rem;margin-top:.5rem;padding:.75rem .25rem;display:flex}.mobile-feedback{justify-content:center;width:100%;margin-top:.25rem;display:flex}.mobile-logout{border-radius:var(--radius-sm);width:100%;color:var(--color-error);cursor:pointer;transition:background var(--transition-fast);background:0 0;border:none;justify-content:center;align-items:center;gap:.6rem;padding:.75rem;font-size:.9375rem;font-weight:600;display:flex}.mobile-logout:hover{background:var(--color-error-bg)}.mobile-logout:focus-visible{outline:2px solid var(--color-error);outline-offset:-2px}.mobile-auth-section{flex-direction:column;gap:.75rem;display:flex}.btn-full{justify-content:center;width:100%}@keyframes dropdownIn{0%{opacity:0;transform:translateY(-6px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.profile-dropdown{animation:none}.profile-chevron{transition:none}}@media (max-width:768px){.navbar-desktop{display:none!important}.navbar-toggle{display:inline-flex}}.btn-kurasu{border-radius:var(--radius-full);color:#fff;transition:background var(--transition-fast);background:#2563eb;align-items:center;gap:.4rem;padding:.45rem .85rem;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-kurasu:hover{background:#1d4ed8}.app-footer{border-top:1px solid var(--color-border-light);background:0 0;margin-top:auto;padding:2rem 1.5rem 1.5rem}.footer-inner{text-align:center;flex-direction:column;align-items:center;gap:.75rem;max-width:900px;margin:0 auto;display:flex}.footer-brand{align-items:center;gap:.5rem;display:flex}.footer-logo{border-radius:6px;width:24px;height:24px}.footer-name{color:var(--color-primary);font-size:.95rem;font-weight:700}.footer-tagline{color:var(--color-text-secondary);margin:0;font-size:.8rem}.footer-social{gap:.75rem;display:flex}.social-link{color:var(--color-text-secondary);border-radius:var(--radius-lg);border:1px solid var(--color-border-light);background:var(--color-bg-white);align-items:center;gap:.4rem;padding:.35rem .75rem;font-size:.82rem;text-decoration:none;transition:color .18s,border-color .18s,background .18s;display:inline-flex}.social-facebook:hover{color:#1877f2;background:#1877f212;border-color:#1877f2}.social-instagram:hover{color:#e1306c;background:#e1306c17;border-color:#e1306c}.footer-copy{color:var(--color-text-tertiary);margin:0;font-size:.75rem}.lang-switcher{border:1px solid var(--color-border-light);border-radius:var(--radius-full);background:var(--color-bg-white);align-items:center;gap:.25rem;padding:.2rem .35rem;display:inline-flex}.flag{object-fit:cover;filter:drop-shadow(0 1px 1px #00000059);border-radius:2px;width:20px;height:15px;display:block;box-shadow:0 0 0 1px #0000001f}.lang-btn{cursor:pointer;border-radius:var(--radius-full);opacity:.55;filter:grayscale(.35);background:0 0;border:none;justify-content:center;align-items:center;padding:.2rem .3rem;transition:opacity .15s,filter .15s,background .15s;display:inline-flex}.lang-btn:hover{opacity:1;filter:grayscale(0)}.lang-btn:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}.lang-btn.active{opacity:1;filter:grayscale(0);background:var(--color-primary-bg);box-shadow:0 0 0 1px var(--color-primary-light) inset}.navbar{height:var(--navbar-height);background:var(--color-bg-white);border-bottom:1px solid var(--color-border-light);box-shadow:var(--shadow-xs);z-index:100;transition:background var(--transition-base);justify-content:space-between;align-items:center;padding:0 1.5rem;display:flex;position:sticky;top:0}.navbar-end,.navbar-auth{align-items:center;gap:.75rem;display:flex}.btn-primary-sm{background:var(--color-primary);color:#fff;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);border:none;justify-content:center;align-items:center;padding:.5rem 1rem;font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex;box-shadow:0 1px 3px #0000001f}.btn-primary-sm:hover{background:var(--color-primary-dark);text-decoration:none;transform:scale(1.02);box-shadow:0 4px 12px #aa003e40}.btn-outline{color:var(--color-primary);border:1.5px solid var(--color-primary);border-radius:var(--radius-full);cursor:pointer;transition:all var(--transition-base);background:0 0;padding:.5rem 1rem;font-size:.875rem;font-weight:600}.btn-outline:hover{background:var(--color-primary);color:#fff;transform:scale(1.02);box-shadow:0 2px 8px #aa003e33}.btn-sm{border-radius:var(--radius-md);cursor:pointer;transition:all var(--transition-base);justify-content:center;align-items:center;gap:.5rem;padding:.5rem .875rem;font-size:.875rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--color-primary);color:#fff;border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-base);border:none;padding:.75rem 1.5rem;font-size:1rem;font-weight:600;box-shadow:0 1px 3px #0000001f}.page-layout{background:var(--color-bg);min-height:100vh}.navbar .logo{align-items:center;height:40px;text-decoration:none;display:inline-flex}.navbar .logo img{width:auto;height:100%;display:block}.navbar .logo span{color:var(--color-primary)}