/* Gate 3: one grouped navigation system for desktop and phone. */
.app{flex-direction:row!important}.app .rail{position:sticky!important;top:0!important;width:246px!important;min-width:246px!important;height:100dvh!important;flex-direction:column!important;align-items:stretch!important;gap:16px!important;padding:22px 14px!important;border-right:1px solid var(--line)!important;border-bottom:0!important}.app .surface{min-width:0;flex:1}.app .desktop-nav{display:grid!important;gap:3px!important;align-content:start!important}.g3-nav-group{display:grid;gap:2px}.g3-nav-group>span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.11em;color:var(--muted);padding:12px 11px 3px}.app .desktop-nav .nav-button{width:100%!important;min-height:46px;display:flex;align-items:center;gap:11px;text-align:left;justify-content:flex-start;font-size:15px;padding:10px 12px!important}.app .desktop-nav .nav-button[aria-current=page],.app .g3-mobile-drawer .nav-button[aria-current=page]{color:var(--accent);background:var(--soft)}.app .rail-foot{margin-top:auto}.app .content{padding-bottom:48px!important}.g3-menu-button,.g3-menu-layer[hidden]{display:none!important}.g3-menu-layer{display:none}.app .mobile-nav{display:none!important}.g3-nav-group button:focus-visible,.g3-menu-layer button:focus-visible,.g3-menu-button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
@media(max-width:760px){.app .rail{display:none!important}.app .content{padding:18px 14px calc(28px + env(safe-area-inset-bottom))!important}.g3-menu-button{display:grid;place-items:center;min-width:48px;min-height:48px;border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--text);font-size:23px}.g3-menu-layer:not([hidden]){display:block;position:fixed;inset:0;z-index:100}.g3-menu-scrim{position:absolute;inset:0;border:0;background:#000a;width:100%}.g3-mobile-drawer{position:absolute;inset:0 auto 0 0;width:min(304px,calc(100vw - 45px));overflow-y:auto;background:var(--bg);border-right:1px solid var(--line);box-shadow:8px 0 30px #0008;padding:16px 14px calc(20px + env(safe-area-inset-bottom))}.g3-mobile-drawer header{display:flex;justify-content:space-between;align-items:center;min-height:52px;padding:0 11px}.g3-mobile-drawer header button{min-width:44px;min-height:44px;border:1px solid var(--line);background:var(--card);color:var(--text);font-size:26px;border-radius:8px}.g3-mobile-drawer .g3-nav-group{display:grid}.g3-mobile-drawer .nav-button{width:100%;min-height:46px;text-align:left;display:flex;align-items:center;gap:12px;padding:10px 12px;color:var(--text);background:none;border:0;border-radius:9px;font-size:15px}.app .topbar{justify-content:flex-start;gap:12px}.app .top-actions{margin-left:auto}}

.g3-calendar{display:grid;gap:14px}.g3-calendar .record{display:flex;flex-wrap:wrap;align-items:center;gap:10px;justify-content:space-between}.g3-plan-bottles{margin-top:22px;display:grid;gap:10px}.g3-weight{border:1px solid var(--line);border-radius:11px;padding:12px;display:grid;gap:9px}.g3-weight label{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}.g3-weight select{min-height:44px}.g3-weight small{color:var(--muted);overflow-wrap:anywhere}.g3-pack-progress{font-size:24px;font-weight:800;color:var(--accent)}.packing-player>button{margin:8px 0 15px}.config-summary .config-chip{border:1px solid var(--accent);border-radius:8px;padding:9px;display:inline-flex;overflow-wrap:anywhere}.config-stage{min-width:0}.config-visual{min-width:0}@media(max-width:760px){.g3-calendar .primary{width:100%}.packing-player>button{min-height:48px}}

.g3-used-sixths{grid-column:1/-1;display:grid;gap:8px;padding:12px;border:1px solid var(--line);border-radius:12px}.g3-used-sixths span{font-weight:800}.g3-six-bottle{width:min(180px,100%);display:flex;flex-direction:column;border:3px solid var(--accent);border-radius:18px 18px 26px 26px;overflow:hidden;padding:4px;touch-action:none}.g3-six-bottle button{height:38px;background:var(--card);color:var(--text);border:1px solid var(--line);cursor:pointer}.g3-six-bottle button[aria-pressed=true],.g3-six-bottle button:hover{background:var(--accent);color:#101014}.g3-used-sixths .quiet{min-height:44px;width:max-content;max-width:100%}.g3-used-sixths small{color:var(--muted)}
