/* Open, five-position navigation with the center action as the visual anchor. */
.app>footer:has(#navigation.wlf-navigation:not([hidden])){
 padding:8px clamp(14px,4vw,24px) max(8px,calc(env(safe-area-inset-bottom) + 6px));
 background:linear-gradient(180deg,#07111d00,#07111dfa 22%,#07111d 100%);
 border-top:1px solid #afc8e314;
}
#navigation.wlf-navigation{
 --nav-action:clamp(56px,16vw,64px);
 display:grid;
 grid-template-columns:minmax(0,1fr) minmax(0,1fr) var(--nav-action) minmax(0,1fr) minmax(0,1fr);
 align-items:end;
 width:100%;
 gap:clamp(0px,1.4vw,6px);
 padding:0;
 border:0;
 border-radius:0;
 background:transparent;
 box-shadow:none;
 overflow:visible;
}
#navigation.wlf-navigation[hidden]{display:none}
.wlf-navigation button{appearance:none;border:0;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.wlf-nav-item{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:5px;min-height:58px;min-width:0;padding:8px 2px 4px;color:#b9c7d8;background:transparent;border-radius:16px;transition:color 160ms ease,transform 160ms ease,background 160ms ease}
.wlf-nav-icon{display:flex;align-items:center;justify-content:center;height:24px;color:currentColor}
.wlf-nav-icon svg{width:24px;height:24px;stroke-width:1.9}
.wlf-nav-label{display:block;max-width:100%;font-size:clamp(10px,2.9vw,12px);line-height:1.12;white-space:nowrap;font-weight:650;letter-spacing:-.025em;overflow:hidden;text-overflow:ellipsis}
.wlf-nav-item[aria-current=page]{color:#f7fbff;font-weight:800}
.wlf-nav-item[aria-current=page] .wlf-nav-label{font-weight:800}
.wlf-nav-item[aria-current=page] svg{stroke-width:2.35;color:#52b7ef}
.wlf-nav-item[data-route=overview][aria-current=page] svg{fill:#52b7ef;stroke:#52b7ef}
.wlf-nav-add{display:grid;place-items:center;justify-self:center;align-self:center;width:var(--nav-action);height:var(--nav-action);padding:0;border-radius:50%;background:linear-gradient(180deg,#54c3f5 0%,#0e8fd8 58%,#0873bd 100%);color:#f8fcff;transition:background 160ms ease,transform 160ms ease;box-shadow:inset 0 2px 0 #ffffff59,inset 0 -5px 0 #0062a75c,0 14px 26px #0076ca3a}
.wlf-nav-add svg{width:30px;height:30px;stroke-width:2}
.wlf-navigation button:focus-visible,.wlf-quick-action:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
.wlf-navigation button:active{transform:scale(.95)}
.wlf-quick-actions{display:grid;gap:10px;padding-top:4px}
.wlf-quick-actions>p{margin:0 0 10px}
.wlf-quick-action{display:flex;align-items:center;gap:14px;text-align:left;width:100%;min-height:90px;padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--bg);color:var(--ink);cursor:pointer;touch-action:manipulation}
.wlf-quick-icon{display:grid;place-items:center;flex:0 0 38px;color:var(--accent)}
.wlf-quick-copy{display:grid;gap:6px;flex:1;min-width:0}
.wlf-quick-copy strong{font-size:16px;font-weight:650;line-height:1.3}
.wlf-quick-copy>span{font-size:13px;color:var(--muted);line-height:1.4}
.wlf-quick-action>.icon{width:18px;flex:0 0 18px}
@media(hover:hover){.wlf-nav-item:hover{color:var(--ink);background:#ffffff0a}.wlf-nav-add:hover{background:linear-gradient(180deg,#65cdf8 0%,#1799df 58%,#0873bd 100%)}.wlf-quick-action:hover{background:var(--raised)}}
@media(max-width:375px){.app>footer:has(#navigation.wlf-navigation){padding-inline:10px}#navigation.wlf-navigation{--nav-action:54px;gap:0}.wlf-nav-item{min-height:54px}.wlf-nav-label{font-size:10px}.wlf-nav-icon svg{width:22px;height:22px}.wlf-quick-action{padding:14px;gap:10px}}
@media(prefers-reduced-motion:reduce){.wlf-navigation button{transition:none}}

/* Touch comfort shared by the existing web preview. Actual iOS uses native controls. */
#app :is(.quiet-icon,.icon-btn),#modal-layer .icon-btn{min-width:48px;min-height:48px}
#app :is(.text-link,.back-link,.v4-section-link){min-height:48px;display:inline-flex;align-items:center}
#app .btn{min-height:56px}
#app button,#modal-layer button{touch-action:manipulation;-webkit-tap-highlight-color:transparent}
#app button:focus-visible,#modal-layer button:focus-visible{outline:2px solid var(--focus);outline-offset:3px}
#modal-layer.wlf-action-layer{inset:0;align-items:flex-end;padding-top:64px;background:#02091480;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.wlf-action-layer .sheet{position:relative;max-height:calc(100% - 20px);padding:36px 20px max(28px,env(safe-area-inset-bottom));background:#172334f5;border:1px solid #aec7e62b;border-bottom:0;border-radius:32px 32px 0 0;box-shadow:0 -12px 60px #0004;animation:wlf-sheet-rise 320ms cubic-bezier(.2,.8,.2,1);font-family:-apple-system,BlinkMacSystemFont,var(--sans)}
.wlf-action-layer .sheet:before{position:absolute;top:10px;left:calc(50% - 18px);width:36px;height:5px;background:#aebcce70;margin:0;touch-action:none}
.wlf-action-layer .sheet>.od-row{touch-action:none}.wlf-action-layer #dialog-title{font-size:25px;line-height:1.2;letter-spacing:-.04em;font-weight:700;margin:0}
.wlf-action-layer #dialog-close{width:48px;height:48px;border:0;border-radius:50%;background:#ffffff0b;color:var(--muted);flex:none}.wlf-action-layer #dialog-close .icon{width:19px;height:19px}
.wlf-action-layer .sheet-content{margin-top:4px;gap:0}.wlf-action-layer .wlf-quick-actions{gap:16px;padding:0}.wlf-action-layer .wlf-quick-actions>p{font-size:14px;line-height:1.4;color:var(--muted);margin:0 0 4px}
.wlf-action-group{background:#2534499c;border:1px solid #ffffff07;border-radius:22px;overflow:hidden}
.wlf-action-layer .wlf-quick-action{position:relative;min-height:82px;padding:16px 14px;border:0;border-radius:0;background:transparent;gap:12px}
.wlf-action-layer .wlf-quick-action+.wlf-quick-action:before{position:absolute;content:'';height:1px;background:#afc8e31c;top:0;left:66px;right:16px}
.wlf-action-layer .wlf-quick-icon{width:38px;height:38px;flex-basis:38px;background:#3a91ca1c;border-radius:12px}.wlf-action-layer .wlf-quick-icon svg{width:23px;height:23px}
.wlf-action-layer .wlf-quick-copy{gap:5px}.wlf-action-layer .wlf-quick-copy strong{font-size:16px;letter-spacing:-.015em}.wlf-action-layer .wlf-quick-copy>span{font-size:12px;line-height:1.4}.wlf-action-layer .wlf-quick-action>.icon{color:#aebcce8a;width:15px;flex-basis:15px}
.wlf-sheet-cancel{width:100%;min-height:52px;border:0;border-radius:18px;background:#ffffff09;color:var(--accent);font:600 16px -apple-system,BlinkMacSystemFont,var(--sans);cursor:pointer}
.wlf-action-layer .wlf-quick-action:active,.wlf-sheet-cancel:active{background:#ffffff0d}
.wlf-action-layer .sheet.is-closing{animation:sheet-out 180ms ease-in forwards}
@keyframes wlf-sheet-rise{from{transform:translateY(100%);opacity:.7}to{transform:translateY(0);opacity:1}}
@media(prefers-reduced-motion:reduce){.wlf-action-layer .sheet,.wlf-action-layer .sheet.is-closing{animation:none}.wlf-nav-add{transition:none}}
/* Keep desktop hit targets at their authored size; scroll the stage on short windows. */
@media(min-width:481px){.phone-frame{zoom:1}body{align-items:start;padding-block:24px}}
.wlf-sheet-grabber{display:none}.wlf-action-layer .sheet:before{display:none}.wlf-action-layer .wlf-sheet-grabber{display:block;position:absolute;top:0;left:0;right:0;height:30px;touch-action:none;cursor:grab}.wlf-sheet-grabber:after{content:'';display:block;width:36px;height:5px;margin:10px auto 0;border-radius:8px;background:#aebcce70}
