:root{--accent: #d4a84b;--accent-dim: rgba(212, 168, 75, .14);--accent-border:rgba(212, 168, 75, .18);--card-bg: rgba(14, 22, 38, .82);--page-bg: #141f34;--text-primary: #f5ead2;--text-muted: #8fa4c7;--nav-bg: rgba(8, 12, 22, .92);--nav-border: rgba(212, 168, 75, .12);--nav-active-bg:rgba(212, 168, 75, .12);--nav-active-color: #f4d292;--nav-color: #94a9c8}body[data-mode=sailing]{--accent: #4a9ebe;--accent-dim: rgba(74, 158, 190, .14);--accent-border:rgba(74, 158, 190, .22);--card-bg: rgba(6, 18, 34, .88);--page-bg: #060e1c;--text-primary: #c8e8f5;--text-muted: #6a93b0;--nav-bg: rgba(4, 12, 24, .95);--nav-border: rgba(74, 158, 190, .18);--nav-active-bg:rgba(74, 158, 190, .15);--nav-active-color: #7ec8e3;--nav-color: #4a7a9b}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--page-bg);color:#fff;-webkit-font-smoothing:antialiased;-webkit-overflow-scrolling:touch;-webkit-tap-highlight-color:transparent;transition:background .4s ease;overscroll-behavior-y:contain}#app{min-height:100vh}.bottom-nav{position:fixed;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;padding:8px;border:1px solid var(--nav-border);border-radius:18px;background:var(--nav-bg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);z-index:100;transition:border-color .4s ease,background .4s ease}.mute-btn{position:absolute;top:-14px;right:12px;width:28px;height:28px;border:1px solid var(--nav-border);border-radius:50%;background:var(--nav-bg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:border-color .3s,opacity .3s;opacity:.7}.mute-btn:hover,.mute-btn:active{opacity:1}.nav-item{border:none;border-radius:12px;padding:10px 0;min-height:48px;background:transparent;color:var(--nav-color);cursor:pointer;transition:color .3s,background .3s}.nav-item:active{opacity:.7}.nav-item.active{background:var(--nav-active-bg);color:var(--nav-active-color)}.nav-sailing .nav-return{background:#4a9ebe2e;color:#7ec8e3;border:1px solid rgba(74,158,190,.3)}.nav-item small{display:block;margin-top:4px;font-size:12px}.toast-container{position:fixed;top:20px;left:50%;transform:translate(-50%);z-index:9999;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{padding:12px 24px;border-radius:24px;color:#fff;font-size:14px;box-shadow:0 4px 12px #0000004d;animation:toastIn .3s ease;white-space:nowrap}@keyframes toastIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.toast-info{background:#3498dbf2}.toast-success{background:#27ae60f2}.toast-warning{background:#e67e22f2}.toast-error{background:#e74c3cf2}.page-fade-enter-active{transition:opacity .15s ease,transform .15s ease}.page-fade-leave-active{transition:opacity .1s ease}.page-fade-enter-from{opacity:0;transform:translateY(8px)}.page-fade-leave-to{opacity:0}