:root{--visit-type-transit: #fbc02d;--visit-type-visit: #388e3c;--visit-type-work: #1976d2;--visit-type-live: #7b1fa2;--achievement-locked: #64748b;--achievement-locked-track: rgba(100, 116, 139, .25);--achievement-progress: #f59e0b;--achievement-unlocked: #facc15;--achievement-level-1: #faf7f7;--achievement-level-2: #22c55e;--achievement-level-3: #38bdf8;--achievement-level-4: #3b82f6;--achievement-level-5: #8b5cf6;--achievement-level-6: #f97316;--achievement-level-7: #ef4444;--achievement-level-8: #db2777;--achievement-level-9: #be123c;--achievement-level-10: #fbbf24;--brand: #14b8a6;--brand-hover: #0d9488;--brand-active: #0f766e;--brand-contrast: #ffffff;--brand-soft: rgba(20, 184, 166, .14);--brand-ring: rgba(20, 184, 166, .45);--gradient-brand: linear-gradient(135deg, #14b8a6, #0d9488);--color-white: #ffffff;--color-black: #000000;--color-surface-default: #ffffff;--color-surface-soft: #f8f9fa;--color-surface-canvas: #1c2731;--color-surface-panel: #2c3e50;--color-surface-elevated: #374151;--color-surface-hover: #253548;--color-input-bg: #111827;--color-overlay-soft: rgba(0, 0, 0, .3);--color-overlay-strong: rgba(0, 0, 0, .6);--color-text-primary: #1f2937;--color-text-secondary: #4b5563;--color-text-muted: #6b7280;--color-text-on-dark: #ecf0f1;--color-text-on-dark-muted: #9ca3af;--color-text-on-dark-subtle: #7f8c8d;--color-border-light: #d1d5db;--color-border-default: #34495e;--color-border-subtle: #4b5563;--color-border-on-dark: rgba(255, 255, 255, .25);--color-divider-on-dark: rgba(255, 255, 255, .1);--color-action-primary: var(--brand);--color-action-primary-hover: var(--brand-hover);--color-action-secondary: var(--brand);--color-action-secondary-hover: var(--brand-hover);--color-action-tertiary: var(--brand);--color-action-tertiary-hover: var(--brand-hover);--color-action-success: #2e7d32;--color-action-success-hover: #16a34a;--color-action-danger: #dc2626;--color-action-danger-hover: #b91c1c;--color-status-warning: #fbbf24;--color-status-danger-bg: #450a0a;--color-status-danger-soft-bg: #fef2f2;--color-status-danger-soft-border: #fecaca;--color-status-success-bg: #052e16;--color-status-success-soft-bg: #e8f5e8;--color-status-success-soft-border: #c8e6c9;--color-status-info-soft-bg: #e3f2fd;--color-on-success-bg: #86efac;--color-on-danger-bg: #fca5a5;--color-warning-soft-bg: rgba(251, 191, 36, .15);--font-family-base: system-ui, Avenir, Helvetica, Arial, sans-serif;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-body: 1rem;--font-size-lg: 1.25rem;--font-size-xl: 1.5rem;--font-size-heading: 2rem;--font-size-display: 2.5rem;--font-size-label: var(--font-size-sm);--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 12px;--radius-xl: 16px;--radius-pill: 999px;--shadow-sm: 0 1px 2px rgba(0, 0, 0, .2);--shadow-md: 0 2px 8px rgba(0, 0, 0, .25);--shadow-lg: 0 8px 24px rgba(0, 0, 0, .35);--shadow-xl: 0 20px 40px rgba(0, 0, 0, .45);--transition-fast: .12s ease;--transition-base: .2s ease;--hover-lift: translateY(-2px);--focus-ring: 0 0 0 3px var(--brand-ring);--nav-height: 72px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes skeletonShimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes expandDown{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.page-container{width:100%;max-width:1400px;margin-left:auto;margin-right:auto;padding:var(--space-4) var(--space-8)}@media(max-width:768px){.page-container{padding:var(--space-4) var(--space-4)}}@media(max-width:480px){.page-container{padding:var(--space-3) var(--space-3)}}a,button,[role=button],input,select,textarea,label{-webkit-tap-highlight-color:transparent}button,input,select,textarea{font-family:inherit}input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],input[type=tel],input[type=url],input[type=date]{-webkit-appearance:none;appearance:none}button,[role=button]{cursor:pointer}a,button,[role=button],label,select,input,textarea{touch-action:manipulation}@media(pointer:coarse){button{min-height:44px}}@media(max-width:768px){input[type=text],input[type=email],input[type=password],input[type=search],input[type=number],input[type=tel],input[type=url],input[type=date],select,textarea{font-size:16px}}.bg-surface,:where(.settings-card,.friend-request-modal,.home-region-modal,.region-edit-modal,.modal-content){background-color:var(--color-surface-default)}.bg-surface-muted,:where(.selected-region-controls,.trip-card,.country-section,.place-type-section){background-color:var(--color-surface-soft)}.bg-overlay,:where(.modal-overlay,.home-region-modal-overlay,.friend-request-modal-overlay){background-color:var(--color-overlay-strong)}.bg-overlay-soft,:where(.navigation,.trip-visits-list){background-color:var(--color-overlay-soft)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold);line-height:1.2;white-space:nowrap;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;text-decoration:none;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),box-shadow var(--transition-fast),transform var(--transition-fast)}.btn:disabled,.btn[aria-disabled=true],.btn.btn--loading{opacity:.6;cursor:not-allowed;pointer-events:none}.btn--loading:before{content:"";width:1em;height:1em;border:2px solid currentColor;border-top-color:transparent;border-radius:var(--radius-pill);animation:spin .7s linear infinite;flex-shrink:0}.btn--sm{padding:var(--space-1) var(--space-3);font-size:var(--font-size-xs)}.btn--lg{padding:var(--space-3) var(--space-6);font-size:var(--font-size-body)}.btn--full{width:100%}.btn--primary{background:var(--brand);color:var(--brand-contrast);border-color:var(--brand)}.btn--primary:hover{background:var(--brand-hover);border-color:var(--brand-hover)}.btn--primary:active{background:var(--brand-active);border-color:var(--brand-active)}.btn--secondary{background:var(--color-surface-elevated);color:var(--color-text-on-dark);border-color:var(--color-border-subtle)}.btn--secondary:hover{background:var(--color-surface-hover);border-color:var(--brand)}.btn--danger{background:var(--color-action-danger);color:var(--color-white);border-color:var(--color-action-danger)}.btn--danger:hover{background:var(--color-action-danger-hover);border-color:var(--color-action-danger-hover)}.btn--success{background:var(--color-action-success);color:var(--color-white);border-color:var(--color-action-success)}.btn--success:hover{background:var(--color-action-success-hover);border-color:var(--color-action-success-hover)}.btn--ghost{background:transparent;color:var(--color-text-on-dark);border-color:var(--color-border-subtle)}.btn--ghost:hover{background:var(--color-surface-hover);border-color:var(--brand)}.btn--link{background:transparent;color:var(--brand);border-color:transparent;padding:0;font-weight:var(--font-weight-medium)}.btn--link:hover{color:var(--brand-hover);text-decoration:underline}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:2.25rem;height:2.25rem;padding:0;font-size:var(--font-size-lg);line-height:1;color:var(--color-text-on-dark);background:transparent;border:1px solid transparent;border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast),border-color var(--transition-fast)}.icon-btn:hover{background:var(--color-surface-hover)}.icon-btn--sm{width:1.75rem;height:1.75rem;font-size:var(--font-size-body)}.icon-btn--danger:hover{background:transparent;color:var(--color-action-danger)}.icon-btn:disabled{opacity:.5;cursor:not-allowed}.text-muted,:where(.loading-message,.empty-state,.no-data-message,.subtitle,.hint,[class*=muted]){color:var(--color-text-on-dark-muted)}.text-error,:where(.error-message,.login-error,.settings-error,[class*=error]){color:var(--color-action-danger)}.text-success,:where(.success-message,.login-success,.settings-success,[class*=success]){color:var(--color-action-success)}.text-label,:where(label,.stat-label,[class*=label]){color:var(--color-text-on-dark-muted);font-size:var(--font-size-label)}.trip-visits-list,.region-visits-list{margin-top:1rem;padding:1.5rem;background-color:#2c3e50f2;border-radius:8px;box-shadow:0 4px 12px #00000026}.trip-visits-list h3,.region-visits-list h3{margin:0 0 1rem;color:var(--color-text-on-dark);font-size:1.2rem;font-weight:600}.no-visits{color:var(--color-text-on-dark-muted);font-style:italic;margin:0;text-align:center;padding:2rem}.visits-container{display:flex;flex-direction:column;gap:.5rem}.visit-item{background-color:#34495ecc;border:1px solid var(--color-border-subtle);border-radius:6px;padding:.75rem;transition:all .2s ease}.visit-item:hover{background-color:#34495e;border-color:var(--color-border-subtle)}.visit-header{display:flex;justify-content:space-between;align-items:center;gap:1rem}.visit-header.clickable{cursor:pointer;transition:background-color .2s ease;border-radius:6px;margin:-.25rem;padding:.25rem}.visit-header.clickable:hover{background-color:#ecf0f10d}.visit-header.clickable:hover .expand-icon{color:var(--color-text-on-dark);transform:scale(1.1)}.visit-info{display:flex;align-items:center;gap:.5rem;flex:1}.expand-icon{color:var(--color-text-on-dark-muted);font-size:.8rem;width:16px;height:16px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:transform .2s ease;-webkit-user-select:none;user-select:none}.visit-details{display:flex;align-items:center;gap:.75rem}.visit-flag-container{display:flex;align-items:center;justify-content:center;flex-shrink:0}.visit-flag{width:20px;height:15px;border-radius:2px;box-shadow:0 1px 3px #0000004d;object-fit:cover}.visit-name{color:var(--color-text-on-dark);font-weight:500;font-size:.9rem}.visit-type-badge{padding:.25rem .5rem;border-radius:12px;font-size:.75rem;font-weight:600;color:#fff;text-transform:uppercase;letter-spacing:.5px}.children-counter{padding:.25rem .5rem;border-radius:12px;font-size:.7rem;font-weight:500;color:var(--color-text-on-dark-muted);background-color:#34495e99;border:1px solid var(--color-border-subtle);white-space:nowrap}.shared-with-display{display:flex;align-items:center;gap:.5rem;padding:.4rem .75rem;border-radius:8px;flex-wrap:wrap}.shared-with-label{font-size:.85rem;font-weight:600;color:var(--color-text-on-dark-muted);white-space:nowrap}.shared-with-users{display:flex;align-items:center;gap:.3rem;flex-wrap:wrap}.shared-user-link{background:none;border:none;color:var(--color-text-on-dark-muted);cursor:pointer;font-size:.85rem;font-weight:500;padding:0;text-decoration:underline;transition:all .2s ease}.shared-user-link:hover{color:var(--color-action-secondary);text-decoration-thickness:2px}.user-separator{color:var(--color-text-on-dark-muted);font-size:.8rem}.visit-actions{display:flex;align-items:center;gap:.75rem;justify-content:flex-end}.date-inputs{display:flex;align-items:center;gap:.5rem;flex:1;justify-content:flex-end}.date-input{width:120px;flex-shrink:0}.date-input .dp-trigger{background-color:#2c3e50cc;border:1px solid var(--color-border-subtle);border-radius:4px;padding:.25rem .5rem;color:var(--color-text-on-dark);font-size:.8rem}.date-input .dp-trigger.dp-trigger--open{border-color:var(--color-action-secondary);box-shadow:var(--focus-ring)}.date-separator{color:var(--color-text-on-dark-muted);font-size:.8rem;flex-shrink:0}.simplified-year-input{width:72px;padding:.2rem .4rem;border:1px solid var(--color-border-subtle);border-radius:4px;background:#2c3e50cc;color:var(--color-text-on-dark);font-size:.8rem;text-align:center;outline:none;transition:border-color .15s ease}.simplified-days-input{width:54px;padding:.2rem .4rem;border:1px solid var(--color-border-subtle);border-radius:4px;background:#2c3e50cc;color:var(--color-text-on-dark);font-size:.8rem;text-align:center;outline:none;transition:border-color .15s ease}.simplified-year-input:focus,.simplified-days-input:focus{border-color:var(--color-action-secondary);box-shadow:var(--focus-ring)}.simplified-year-input::-webkit-inner-spin-button,.simplified-year-input::-webkit-outer-spin-button,.simplified-days-input::-webkit-inner-spin-button,.simplified-days-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.simplified-year-input[type=number],.simplified-days-input[type=number]{-moz-appearance:textfield}.remove-button{background:var(--color-action-danger);border:none;color:#fff;cursor:pointer;font-size:1.2rem;padding:.25rem .5rem;border-radius:4px;transition:background-color .2s;width:24px;height:24px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.remove-button:hover{background:var(--color-action-danger-hover)}.visit-children{margin-top:.5rem;margin-left:1.5rem;padding-left:1rem;border-left:2px solid var(--color-border-subtle);position:relative;overflow:hidden;animation:slideDown .2s ease-out}@keyframes slideDown{0%{opacity:0;max-height:0}to{opacity:1;max-height:1000px}}.visit-children:before{content:"";position:absolute;left:-2px;top:-.5rem;bottom:0;width:2px;background:linear-gradient(180deg,var(--color-border-subtle) 0%,transparent 100%)}.visit-children .visit-item{background-color:#34495e99;border-color:#4a6a7cb3}.visit-children .visit-item:hover{background-color:#34495ecc;border-color:var(--color-border-subtle)}.visit-children .visit-children{margin-left:1rem}.visit-children .visit-children .visit-item{background-color:#34495e66;border-color:#4a6a7c80}.visit-children .visit-children .visit-item:hover{background-color:#34495e99}@media(max-width:768px){.trip-visits-list,.region-visits-list{padding:1rem}.visit-header{flex-direction:column;align-items:flex-start;gap:.5rem}.visit-info{width:100%}.visit-actions{width:100%;justify-content:space-between}.date-inputs{flex-direction:row;flex-wrap:wrap;gap:.35rem;justify-content:flex-start}.date-input{width:auto}.children-counter{font-size:.65rem;padding:.2rem .4rem}}@media(max-width:480px){.visit-children{padding-left:.5rem;margin-left:1rem}.visit-children .visit-children{margin-left:.5rem}.expand-icon{font-size:.9rem;width:18px;height:18px}}.region-breadcrumb-link,.region-breadcrumb-current{border-radius:999px;padding:.2rem .55rem;font-size:.82rem;line-height:1.2}.region-breadcrumb-link{border:1px solid var(--color-border-subtle);background:var(--color-border-subtle);color:var(--color-action-primary);cursor:pointer}.region-breadcrumb-link:hover{background:var(--color-border-subtle);border-color:var(--color-border-subtle)}.region-breadcrumb-current{border:1px solid var(--color-border-subtle);background:var(--color-border-subtle);color:var(--color-text-on-dark)}.expand-button,.collapse-button,.go-to-region-button,.add-visit-button,.edit-region-button,.edit-region-header-btn{padding:6px 12px;border-radius:4px;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.expand-button,.collapse-button,.go-to-region-button,.edit-region-button,.edit-region-header-btn{border:1px solid var(--color-border-subtle);background:var(--color-border-default);color:var(--color-text-on-dark)}.edit-region-header-btn,.edit-region-button:hover,.edit-region-header-btn:hover{background:var(--color-border-subtle);border-color:var(--color-border-subtle)}.add-visit-button{border:1px solid var(--color-action-success);background:var(--color-action-success);color:var(--color-white)}.add-visit-button:hover:not(:disabled){background:var(--color-action-success-hover);border-color:var(--color-action-success-hover)}.expand-button:disabled,.collapse-button:disabled,.go-to-region-button:disabled,.add-visit-button:disabled{background:var(--color-surface-panel);color:var(--color-text-on-dark-subtle);border-color:var(--color-border-subtle);cursor:not-allowed;opacity:.6}.region-edit-modal-overlay{position:fixed;inset:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:2000;padding:1rem}.region-edit-modal{width:100%;max-width:420px;background:var(--color-border-subtle);border:1px solid var(--color-border-subtle);border-radius:10px;box-shadow:0 12px 30px #0006;padding:1rem}.region-edit-modal h3{margin:0;color:var(--color-text-on-dark);font-size:1.15rem}.region-edit-modal-subtitle{margin:.35rem 0 1rem;color:var(--color-action-primary);font-size:.8rem}.region-edit-field{display:flex;flex-direction:column;gap:.35rem;margin-bottom:.85rem}.region-edit-field label{font-size:.85rem;color:var(--color-action-primary)}.region-edit-field input{background:var(--color-border-subtle);border:1px solid var(--color-border-subtle);border-radius:6px;color:var(--color-text-on-dark);padding:.55rem .65rem;font-size:.92rem}.region-edit-field input:focus{outline:none;border-color:var(--color-border-subtle)}.region-edit-modal-error{margin:0 0 .8rem;color:var(--color-status-danger-soft-bg);font-size:.85rem}.region-edit-modal-actions{display:flex;justify-content:flex-end;gap:.6rem}.region-edit-cancel-btn,.region-edit-save-btn{border-radius:6px;border:1px solid var(--color-border-subtle);font-size:.85rem;padding:.45rem .9rem;cursor:pointer}.region-edit-cancel-btn{background:var(--color-border-subtle);color:var(--color-text-on-dark)}.region-edit-save-btn{background:var(--color-action-success);border-color:var(--color-action-success);color:var(--color-text-on-dark)}.region-edit-cancel-btn:disabled,.region-edit-save-btn:disabled{opacity:.6;cursor:not-allowed}.list-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px}.list-title{font-size:20px;font-weight:600;color:var(--color-text-on-dark);margin:0}.list-controls{display:flex;gap:12px}.control-button{padding:8px 16px;background-color:var(--color-surface-panel);color:var(--color-text-on-dark);border:1px solid var(--color-surface-panel);border-radius:4px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.control-button:hover{background-color:var(--color-surface-panel);border-color:var(--color-surface-elevated)}.place-count-badge{padding:4px 12px;background-color:var(--color-action-success);color:var(--color-white);border-radius:12px;font-size:14px;font-weight:600}.places-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;padding:16px 20px 20px;background-color:var(--color-surface-canvas)}.place-card{background-color:var(--color-surface-panel);border:1px solid var(--color-surface-panel);border-radius:6px;overflow:hidden;transition:all .2s}.place-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000004d;border-color:var(--color-surface-panel)}.place-image-link{display:block;text-decoration:none}.place-image-placeholder{width:100%;height:180px;background:linear-gradient(135deg,var(--color-surface-panel) 0%,var(--color-surface-panel) 100%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;transition:background .2s}.place-image-placeholder:hover{background:linear-gradient(135deg,var(--color-surface-panel) 0%,var(--color-surface-panel) 100%)}.place-image-placeholder.loading{cursor:wait}.image-icon{font-size:32px}.place-card-header{display:flex;justify-content:space-between;align-items:flex-start;gap:8px;margin-bottom:6px}.country-days-bar-chart .bar-chart-title,.place-type-countries-chart .bar-chart-title{color:var(--color-text-on-dark);font-size:1.25rem;font-weight:600;text-align:center}.country-days-bar-chart .bar-chart-container,.place-type-countries-chart .bar-chart-container{position:relative}.country-days-bar-chart .bar-chart-wrapper,.place-type-countries-chart .bar-chart-wrapper{height:400px;margin-bottom:1rem}.country-days-bar-chart .bar-chart-empty,.place-type-countries-chart .bar-chart-empty{height:200px;display:flex;align-items:center;justify-content:center;color:var(--color-text-on-dark-muted);font-style:italic}.country-days-bar-chart .country-flags-row,.place-type-countries-chart .country-flags-row{position:relative;display:flex;align-items:flex-start}.country-days-bar-chart .country-flag-item,.place-type-countries-chart .country-flag-item{position:absolute;display:flex;flex-direction:column;align-items:center;transform:translate(-50%)}.country-days-bar-chart .country-flag-image,.place-type-countries-chart .country-flag-image{object-fit:cover;border-radius:2px;border:1px solid var(--color-text-muted);box-shadow:0 1px 3px #0000001a}.country-days-bar-chart .country-total,.place-type-countries-chart .country-total{margin-top:4px;font-weight:600;color:var(--color-text-on-dark);text-align:center;background-color:#00000080;border-radius:3px}.country-days-bar-chart .country-code-fallback,.place-type-countries-chart .country-code-fallback{display:flex;align-items:center;justify-content:center;background-color:var(--color-border-subtle);color:var(--color-text-on-dark);border-radius:2px;border:1px solid var(--color-text-muted)}@media(max-width:768px){.country-days-bar-chart .bar-chart-wrapper,.place-type-countries-chart .bar-chart-wrapper{height:300px}}@media(max-width:480px){.country-days-bar-chart .bar-chart-wrapper,.place-type-countries-chart .bar-chart-wrapper{height:250px}}.extreme-point-card,.extreme-places-card{background:transparent;border-radius:.5rem;padding:1rem;margin-bottom:1rem;max-width:100%;overflow:hidden}.extreme-points-title,.extreme-places-title{font-size:1.125rem;font-weight:600;color:var(--color-text-on-dark);margin:0 0 1rem;text-align:center}.extreme-point-item,.extreme-place-item{background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:.5rem;padding:1rem;transition:all .2s ease}.extreme-point-item:hover,.extreme-place-item:hover{background:var(--color-border-subtle);border-color:var(--color-text-muted);transform:translateY(-2px);box-shadow:0 4px 12px #0000004d}.extreme-point-header,.extreme-place-header{display:flex;align-items:center;gap:.5rem;margin-bottom:.75rem}.extreme-point-card .direction-icon,.extreme-places-card .direction-icon{font-size:1.25rem;line-height:1}.extreme-point-card .direction-title,.extreme-places-card .direction-title{font-size:.875rem;font-weight:600;color:var(--color-text-on-dark);text-transform:uppercase;letter-spacing:.05em}.extreme-point-coordinate-row,.extreme-place-coordinate-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.extreme-point-coordinate,.extreme-place-coordinate{font-size:1.125rem;font-weight:700;color:var(--color-status-warning);font-family:Courier New,monospace;flex:1}.extreme-point-flags,.extreme-place-flags{margin-left:.5rem;display:flex;align-items:center;gap:.25rem}.extreme-point-flags .flag-image,.extreme-place-flags .flag-image{width:40px;height:25px;object-fit:cover;border-radius:2px;border:1px solid var(--color-text-muted);display:block}@media(max-width:768px){.extreme-point-card .direction-title,.extreme-places-card .direction-title{font-size:.75rem}.extreme-point-coordinate,.extreme-place-coordinate{font-size:1rem}}@media(max-width:480px){.extreme-point-card .direction-title,.extreme-places-card .direction-title{font-size:.6875rem}.extreme-point-flags .flag-image,.extreme-place-flags .flag-image{width:28px;height:18px}}.route-controls{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}.route-dates,.route-actions{display:flex;align-items:center;gap:.5rem}.route-control-label{font-size:.82rem;color:var(--color-text-on-dark-muted);white-space:nowrap}.route-control-input{font-size:.82rem;padding:4px 7px;border:1px solid rgba(255,255,255,.18);border-radius:5px;background:var(--color-border-subtle);color:var(--color-text-on-dark);cursor:pointer;outline:none}.route-dp .react-datepicker__input-container input{font-size:.82rem;padding:4px 7px;border:1px solid rgba(255,255,255,.18);border-radius:5px;background:var(--color-border-subtle);color:var(--color-text-on-dark);cursor:pointer;outline:none;width:108px}.route-dp .react-datepicker__input-container input:focus{border-color:var(--color-action-primary)}.route-control-input:focus{border-color:var(--color-action-primary)}.route-control-input option{background:var(--color-surface-panel);color:var(--color-text-on-dark)}.route-control-btn{background:#ffffff1a;color:var(--color-text-on-dark);border:1px solid rgba(255,255,255,.18);border-radius:5px;padding:4px 12px;font-size:.82rem;font-weight:500;cursor:pointer;white-space:nowrap;transition:background .15s}.route-control-btn:hover:not(:disabled){background:#fff3}.route-control-btn:disabled{opacity:.4;cursor:not-allowed}.route-control-btn-save{background:var(--color-action-primary);border-color:transparent;font-weight:600}.route-control-btn-save:hover:not(:disabled){filter:brightness(1.15)}.route-control-btn-save.is-saved{background:var(--color-action-success);border-color:transparent}.route-control-btn-save.is-error{background:var(--color-action-danger);border-color:transparent}@media(max-width:768px){.route-controls{flex-direction:column;align-items:stretch;width:100%;gap:.35rem}.route-dates,.route-actions{width:100%}.route-dp{flex:1;min-width:0}.route-dp .react-datepicker__input-container input{font-size:.78rem;padding:3px 5px;width:100%}.route-control-label{font-size:.78rem}}*{margin:0;padding:0;box-sizing:border-box}html,body{margin:0;padding:0;width:100%;height:100%}:root{font-family:var(--font-family-base);line-height:1.5;font-weight:var(--font-weight-normal);color-scheme:dark;color:#ffffffde;background-color:var(--color-surface-canvas);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:var(--font-weight-medium);color:var(--brand);text-decoration:inherit;transition:color var(--transition-fast)}a:hover{color:var(--brand-hover)}h1{font-size:var(--font-size-heading);line-height:1.1}a:focus-visible,button:focus-visible,[role=button]:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;box-shadow:var(--focus-ring)}.session-provider-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;padding:20px;text-align:center;background-color:var(--color-white)}.session-provider-error-heading{color:var(--color-action-danger);margin-bottom:16px}.session-provider-error-message{color:var(--color-surface-elevated);margin-bottom:24px;max-width:600px}.session-provider-error-button{padding:10px 20px;font-size:16px;background-color:var(--color-border-subtle);color:#fff;border:none;border-radius:4px;cursor:pointer;transition:background-color .2s ease}.session-provider-error-button:hover,.session-provider-error-button:active{background-color:var(--color-border-subtle)}.ui-card{background:var(--color-surface-panel);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-md)}.ui-card--interactive{cursor:pointer;transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base)}.ui-card--interactive:hover{transform:var(--hover-lift);box-shadow:var(--shadow-lg);border-color:var(--brand)}.ui-modal-overlay{position:fixed;inset:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:var(--space-4);background:var(--color-overlay-strong);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:fadeIn var(--transition-base) ease}.ui-modal{display:flex;flex-direction:column;width:100%;max-height:calc(100vh - var(--space-8));background:var(--color-surface-panel);color:var(--color-text-on-dark);border:1px solid var(--color-border-default);border-radius:var(--radius-lg);box-shadow:var(--shadow-xl);overflow:hidden;animation:scaleIn var(--transition-base) ease}.ui-modal--sm{max-width:24rem}.ui-modal--md{max-width:32rem}.ui-modal--lg{max-width:48rem}.ui-modal__header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--color-border-default)}.ui-modal__title{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-on-dark)}.ui-modal__body{padding:var(--space-5);overflow-y:auto}.ui-modal__footer{display:flex;justify-content:flex-end;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-top:1px solid var(--color-border-default)}@media(max-width:768px){.ui-modal,.ui-modal--sm,.ui-modal--md,.ui-modal--lg{max-width:100%}}.ui-input{width:100%;padding:var(--space-2) var(--space-3);font-family:inherit;font-size:var(--font-size-body);color:var(--color-text-on-dark);background:var(--color-input-bg);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.ui-input::placeholder{color:var(--color-text-on-dark-subtle)}.ui-input:hover{border-color:var(--color-border-light)}.ui-input:focus,.ui-input:focus-visible{outline:none;border-color:var(--brand);box-shadow:var(--focus-ring)}.ui-input--invalid,.ui-input--invalid:hover{border-color:var(--color-action-danger)}.ui-input:disabled{opacity:.6;cursor:not-allowed}.ui-select{appearance:none;-webkit-appearance:none;padding-right:var(--space-8);cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='none' stroke='%239ca3af' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round' d='M2 4l4 4 4-4'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right var(--space-3) center}.ui-select option{color:var(--color-text-on-dark);background:var(--color-surface-panel)}.ui-form-field{display:flex;flex-direction:column;gap:var(--space-2)}.ui-form-field__label{font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-on-dark-muted)}.ui-form-field__required{margin-left:var(--space-1);color:var(--color-action-danger)}.ui-form-field__hint{font-size:var(--font-size-xs);color:var(--color-text-on-dark-subtle)}.ui-form-field__error{font-size:var(--font-size-xs);color:var(--color-action-danger)}.ui-badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:1;white-space:nowrap;border-radius:var(--radius-pill)}.ui-badge--neutral{background:var(--color-surface-elevated);color:var(--color-text-on-dark-muted)}.ui-badge--brand{background:var(--brand-soft);color:var(--brand)}.ui-badge--success{background:var(--color-status-success-bg);color:var(--color-on-success-bg)}.ui-badge--danger{background:var(--color-status-danger-bg);color:var(--color-on-danger-bg)}.ui-badge--warning{background:var(--color-warning-soft-bg);color:var(--color-status-warning)}.ui-chip{display:inline-flex;align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-on-dark);background:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-pill);text-decoration:none}.ui-chip--interactive{cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast)}.ui-chip--interactive:hover{background:var(--color-surface-hover);border-color:var(--brand)}.ui-chip__leading{display:inline-flex;align-items:center}.ui-chip__remove{display:inline-flex;align-items:center;justify-content:center;padding:0;font-size:var(--font-size-body);line-height:1;color:inherit;background:none;border:none;cursor:pointer;opacity:.7}.ui-chip__remove:hover{opacity:1;color:var(--color-action-danger)}.ui-tabs{display:inline-flex;gap:var(--space-1);padding:var(--space-1);background:var(--color-surface-elevated);border-radius:var(--radius-md)}.ui-tab{padding:var(--space-2) var(--space-4);font-family:inherit;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-on-dark-muted);background:transparent;border:none;border-radius:var(--radius-sm);cursor:pointer;transition:background-color var(--transition-fast),color var(--transition-fast)}.ui-tab:hover{color:var(--color-text-on-dark)}.ui-tab--active,.ui-tab--active:hover{color:var(--brand-contrast);background:var(--brand)}.ui-tab:disabled{opacity:.5;cursor:not-allowed}.ui-tabs--sm .ui-tab{padding:var(--space-1) var(--space-3);font-size:var(--font-size-xs)}.toast-viewport{position:fixed;bottom:var(--space-5);right:var(--space-5);z-index:2000;display:flex;flex-direction:column;gap:var(--space-3);max-width:min(360px,calc(100vw - var(--space-8)));pointer-events:none}.toast{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-3) var(--space-4);background:var(--color-surface-elevated);color:var(--color-text-on-dark);border:1px solid var(--color-border-default);border-left:3px solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);pointer-events:auto;animation:toastIn var(--transition-base)}.toast__icon{display:inline-flex;flex-shrink:0;font-size:var(--font-size-lg);line-height:1}.toast__message{flex:1;font-size:var(--font-size-sm);line-height:1.35}.toast__close{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;padding:0;color:var(--color-text-on-dark-muted);background:none;border:none;cursor:pointer;font-size:var(--font-size-body)}.toast__close:hover{color:var(--color-text-on-dark)}.toast--success{border-left-color:var(--color-action-success)}.toast--success .toast__icon{color:var(--color-on-success-bg)}.toast--error{border-left-color:var(--color-action-danger)}.toast--error .toast__icon{color:var(--color-on-danger-bg)}.toast--info{border-left-color:var(--brand)}.toast--info .toast__icon{color:var(--brand)}@keyframes toastIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.toast-viewport{left:var(--space-4);right:var(--space-4);bottom:var(--space-4);max-width:none}}@media(prefers-reduced-motion:reduce){.toast{animation:none}}.spinner{display:inline-block;border-radius:var(--radius-pill);border:2px solid var(--color-border-subtle);border-top-color:var(--brand);animation:spin .7s linear infinite;flex-shrink:0}.spinner--sm{width:1rem;height:1rem}.spinner--md{width:1.5rem;height:1.5rem}.spinner--lg{width:2.5rem;height:2.5rem;border-width:3px}.spinner-block{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);padding:var(--space-8) var(--space-4);color:var(--color-text-on-dark-muted)}.spinner-block__label{font-size:var(--font-size-sm)}.skeleton{display:block;border-radius:var(--radius-sm);background:linear-gradient(90deg,var(--color-surface-elevated) 25%,var(--color-surface-hover) 37%,var(--color-surface-elevated) 63%);background-size:400% 100%;animation:skeletonShimmer 1.4s ease infinite}.skeleton--rounded{border-radius:var(--radius-pill)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-3);text-align:center;padding:var(--space-8) var(--space-4);color:var(--color-text-on-dark-muted)}.empty-state__icon{display:inline-flex;font-size:2.5rem;color:var(--color-text-on-dark-subtle)}.empty-state__title{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-on-dark)}.empty-state__message{margin:0;max-width:38ch;font-size:var(--font-size-sm);line-height:1.5}.empty-state__action{margin-top:var(--space-2)}.notification-bell-container{position:relative}.notification-bell-button{display:flex;align-items:center;justify-content:center;position:relative;background:none;border:none;border-radius:var(--radius-sm);color:inherit;cursor:pointer;padding:0;width:24px;height:24px;margin:0 var(--space-2);transition:opacity var(--transition-base)}.notification-bell-button:hover{opacity:.7}.notification-bell-button:focus-visible{outline:none;box-shadow:var(--focus-ring)}.notification-bell-icon{width:18px;height:18px}.notification-badge{position:absolute;top:-6px;right:-6px;display:flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 var(--space-1);background-color:var(--color-action-danger);color:var(--brand-contrast);border-radius:var(--radius-pill);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);line-height:1}.notification-dropdown{position:absolute;top:calc(100% + var(--space-2));right:0;width:360px;max-height:500px;background-color:var(--color-surface-elevated);border:1px solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-lg);display:flex;flex-direction:column;z-index:1000}.notification-dropdown-header{padding:var(--space-4);border-bottom:1px solid var(--color-divider-on-dark);display:flex;justify-content:space-between;align-items:center}.notification-dropdown-header h3{margin:0;font-size:var(--font-size-body);font-weight:var(--font-weight-semibold);color:var(--color-text-on-dark)}.notification-list{flex:1;overflow-y:auto;display:flex;flex-direction:column}.notification-empty{display:flex;align-items:center;justify-content:center;padding:var(--space-8) var(--space-4);color:var(--color-text-on-dark-muted);font-size:var(--font-size-sm)}.notification-item{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-divider-on-dark);display:flex;gap:var(--space-3);cursor:pointer;transition:background-color var(--transition-fast)}.notification-item:hover{background-color:var(--color-surface-hover)}.notification-item.unread{background-color:var(--brand-soft)}.notification-item.unread:before{content:"";display:inline-block;width:8px;height:8px;background-color:var(--brand);border-radius:50%;margin-top:6px;flex-shrink:0}.notification-content{flex:1;min-width:0;display:flex;flex-direction:column;gap:var(--space-1)}.notification-title{font-weight:var(--font-weight-semibold);font-size:var(--font-size-sm);color:var(--color-text-on-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.notification-message{font-size:var(--font-size-sm);color:var(--color-text-on-dark-muted);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.notification-default{margin:0}.notification-default h4{margin:0;font-size:inherit}.notification-default p{margin:var(--space-1) 0 0 0}.notification-time{font-size:var(--font-size-xs);color:var(--color-text-on-dark-subtle);margin-top:2px}.notification-list::-webkit-scrollbar{width:6px}.notification-list::-webkit-scrollbar-track{background:transparent}.notification-list::-webkit-scrollbar-thumb{background:var(--color-border-subtle);border-radius:var(--radius-sm)}.notification-list::-webkit-scrollbar-thumb:hover{background:var(--color-text-on-dark-subtle)}.notification-modal-error{margin-top:var(--space-3);padding:var(--space-2) var(--space-3);border-radius:var(--radius-md);background:var(--color-status-danger-bg);color:var(--color-on-danger-bg);font-size:var(--font-size-sm)}.navigation{position:relative;z-index:1000;background-color:var(--color-surface-panel);color:var(--color-text-on-dark);padding:max(.5rem,env(safe-area-inset-top,0px)) 2rem .5rem;display:flex;justify-content:space-between;align-items:center;box-shadow:var(--shadow-sm);flex-shrink:0}.nav-brand{display:flex;align-items:center}.nav-logo{height:56px;width:auto}.nav-links{display:flex;list-style:none;margin:0;padding:0;gap:2rem;align-items:center}.nav-link{color:var(--color-text-on-dark);text-decoration:none;padding:.5rem 1rem;border-radius:var(--radius-sm);transition:background-color var(--transition-base)}.nav-link:hover,.nav-link.active{background-color:var(--brand);color:var(--brand-contrast)}.nav-user-section{display:flex;align-items:center;gap:.75rem;margin-left:1rem;padding-left:1rem;border-left:1px solid var(--color-border-on-dark)}.nav-user-profile{display:flex;align-items:center;gap:0}.nav-username{color:var(--color-text-on-dark);font-weight:var(--font-weight-medium);font-size:var(--font-size-sm);text-decoration:none;padding:.25rem .5rem;border-radius:var(--radius-sm);transition:color var(--transition-base)}.nav-username:hover,.nav-username-active{color:var(--brand)}.nav-settings-btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;width:30px;height:30px;border-radius:var(--radius-sm);border:1px solid var(--color-border-on-dark);color:var(--color-text-on-dark);text-decoration:none;transition:background-color var(--transition-base),border-color var(--transition-base),color var(--transition-base);overflow:hidden}.nav-settings-btn:hover,.nav-settings-btn-active{background-color:var(--brand-soft);border-color:var(--brand);color:var(--brand)}.nav-settings-label{display:none}.nav-settings-icon{display:block;flex-shrink:0}.nav-logout-btn{background:transparent;border:1px solid var(--color-border-on-dark);color:var(--color-text-on-dark);padding:.35rem .75rem;border-radius:var(--radius-sm);cursor:pointer;font-size:var(--font-size-sm);transition:background-color var(--transition-base),border-color var(--transition-base);font-family:inherit}.nav-logout-btn:hover{background-color:var(--color-action-danger);border-color:var(--color-action-danger);color:var(--color-white)}.nav-hamburger{display:none}@media(max-width:768px){.navigation{padding:.5rem 1rem}.nav-hamburger{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;background:transparent;border:1px solid var(--color-border-on-dark);border-radius:var(--radius-sm);cursor:pointer;padding:0;flex-shrink:0;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.nav-hamburger-bar{display:block;width:22px;height:2px;background-color:var(--color-text-on-dark);border-radius:2px;transition:transform .25s ease,opacity .25s ease;pointer-events:none}.nav-hamburger[aria-expanded=true] .nav-hamburger-bar:nth-child(1){transform:translateY(7px) rotate(45deg)}.nav-hamburger[aria-expanded=true] .nav-hamburger-bar:nth-child(2){opacity:0;transform:scaleX(0)}.nav-hamburger[aria-expanded=true] .nav-hamburger-bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}.nav-links{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;align-items:stretch;background-color:var(--color-surface-panel);box-shadow:var(--shadow-lg);padding:.25rem 0;list-style:none;margin:0;max-height:calc(100dvh - var(--nav-height));overflow-y:auto;-webkit-overflow-scrolling:touch}.nav-links.nav-open{display:flex;animation:navSlideDown .2s ease;padding-bottom:env(safe-area-inset-bottom,.25rem)}@keyframes navSlideDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.nav-links>li{width:100%}.nav-link{display:flex;align-items:center;width:100%;padding:.875rem 1.5rem;min-height:44px;border-radius:0;box-sizing:border-box}.nav-user-section{flex-direction:column;align-items:stretch;gap:0;margin-left:0;padding-left:0;border-left:none;border-top:1px solid var(--color-divider-on-dark);width:100%}.nav-user-profile{display:flex;align-items:center;justify-content:space-between;padding:.875rem 1.5rem;min-height:44px;border-bottom:1px solid var(--color-divider-on-dark)}.nav-username{padding:0;font-size:.95rem;flex:1}.nav-settings-btn{display:flex;align-items:center;justify-content:flex-start;width:100%;padding:.875rem 1.5rem;min-height:44px;height:auto;border-radius:0;border:none;border-top:1px solid var(--color-divider-on-dark)}.nav-settings-label{display:inline;margin-left:.5rem;font-size:.9rem}.nav-logout-btn{width:100%;padding:.875rem 1.5rem;min-height:44px;border-radius:0;border:none;border-top:1px solid var(--color-divider-on-dark);text-align:left;font-size:var(--font-size-sm)}}#root{height:100vh;height:100dvh;overflow:hidden}#root>div{height:100%;display:flex;flex-direction:column}.app-main{flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}.skip-to-content{position:absolute;left:var(--space-2);top:-3rem;z-index:3000;padding:var(--space-2) var(--space-4);background:var(--brand);color:var(--brand-contrast);border-radius:var(--radius-md);text-decoration:none;transition:top var(--transition-fast)}.skip-to-content:focus{top:var(--space-2)}.error-boundary{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-4);text-align:center;min-height:60vh;padding:var(--space-8) var(--space-4)}.error-boundary__title{margin:0;font-size:var(--font-size-heading);color:var(--color-text-on-dark)}.error-boundary__message{margin:0;max-width:40ch;color:var(--color-text-on-dark-muted)}.error-boundary__detail{margin:0;max-width:60ch;max-height:30vh;overflow:auto;padding:var(--space-3);border-radius:var(--radius-md);background:var(--color-surface-elevated);color:var(--color-text-on-dark-muted);font-size:var(--font-size-sm);text-align:left;white-space:pre-wrap;word-break:break-word}.error-boundary__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);justify-content:center}.achievement-badge{--badge-size: calc(var(--space-8) * 2.5);flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:var(--badge-size);height:var(--badge-size);border-radius:var(--radius-pill);color:var(--level-color, var(--achievement-progress));background:color-mix(in srgb,var(--level-color, var(--achievement-progress)) 16%,transparent);border:1px solid color-mix(in srgb,var(--level-color, var(--achievement-progress)) 40%,transparent)}.achievement-badge--locked{color:var(--achievement-locked);background:var(--achievement-locked-track);border-color:color-mix(in srgb,var(--achievement-locked) 35%,transparent)}.achievement-badge__icon{width:55%;height:55%}.achievement-unlock{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-3);animation:achievementPopIn var(--transition-base) ease both}.achievement-unlock--level-1{--level-color: var(--achievement-level-1)}.achievement-unlock--level-2{--level-color: var(--achievement-level-2)}.achievement-unlock--level-3{--level-color: var(--achievement-level-3)}.achievement-unlock--level-4{--level-color: var(--achievement-level-4)}.achievement-unlock--level-5{--level-color: var(--achievement-level-5)}.achievement-unlock--level-6{--level-color: var(--achievement-level-6)}.achievement-unlock--level-7{--level-color: var(--achievement-level-7)}.achievement-unlock--level-8{--level-color: var(--achievement-level-8)}.achievement-unlock--level-9{--level-color: var(--achievement-level-9)}.achievement-unlock--level-10{--level-color: var(--achievement-level-10)}.achievement-unlock__emblem{position:relative;display:inline-flex;align-items:center;justify-content:center;margin:var(--space-2) 0}.achievement-unlock__emblem .achievement-badge{--badge-size: calc(var(--space-8) * 3.5);position:relative;z-index:1;animation:achievementBadgePop var(--transition-base) ease both}.achievement-unlock__burst{position:absolute;inset:0;z-index:0;border-radius:var(--radius-pill);background:radial-gradient(circle,color-mix(in srgb,var(--level-color, var(--achievement-progress)) 55%,transparent) 0%,transparent 70%);animation:achievementBurst .9s ease-out both}.achievement-unlock__emblem:after{content:"";position:absolute;inset:calc(var(--space-2) * -1);z-index:0;border-radius:var(--radius-pill);box-shadow:0 0 var(--space-6) color-mix(in srgb,var(--level-color, var(--achievement-progress)) 45%,transparent);animation:achievementGlowPulse 2.4s ease-in-out infinite}.achievement-unlock__scope-flag{position:absolute;bottom:var(--space-2);right:var(--space-2);z-index:2;width:2rem;height:1.4rem;border-radius:var(--radius-sm);object-fit:cover;box-shadow:var(--shadow-md)}.achievement-unlock__tier{padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold);letter-spacing:.04em;text-transform:uppercase;color:var(--level-color, var(--achievement-progress));background:color-mix(in srgb,var(--level-color, var(--achievement-progress)) 16%,transparent)}.achievement-unlock__name{margin:0;font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold);color:var(--color-text-on-dark)}.achievement-unlock__scope{font-weight:var(--font-weight-normal);color:var(--color-text-on-dark-muted)}.achievement-unlock__threshold{margin-top:var(--space-2);font-size:var(--font-size-display);font-weight:var(--font-weight-bold);line-height:1;color:var(--level-color, var(--achievement-progress));font-variant-numeric:tabular-nums}.achievement-unlock__description{margin:0;font-size:var(--font-size-sm);line-height:1.4;color:var(--color-text-on-dark-muted)}.achievement-unlock__nav{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--space-4)}.achievement-unlock__counter{min-width:4rem;font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);color:var(--color-text-on-dark-muted);font-variant-numeric:tabular-nums}@keyframes achievementPopIn{0%{opacity:0;transform:translateY(var(--space-2)) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes achievementBadgePop{0%{opacity:0;transform:scale(.4) rotate(-12deg)}60%{opacity:1;transform:scale(1.12) rotate(4deg)}to{transform:scale(1) rotate(0)}}@keyframes achievementBurst{0%{opacity:.8;transform:scale(.5)}to{opacity:0;transform:scale(1.9)}}@keyframes achievementGlowPulse{0%,to{opacity:.5}50%{opacity:1}}