:root{
  --v08-space-1:4px;
  --v08-space-2:8px;
  --v08-space-3:12px;
  --v08-space-4:16px;
  --v08-space-5:20px;
  --v08-space-6:24px;
  --v08-radius-sm:10px;
  --v08-radius-md:16px;
  --v08-radius-lg:22px;
  --v08-touch-target:44px;
  --v08-safe-top:env(safe-area-inset-top,0px);
  --v08-safe-right:env(safe-area-inset-right,0px);
  --v08-safe-bottom:env(safe-area-inset-bottom,0px);
  --v08-safe-left:env(safe-area-inset-left,0px);
  --v08-overlay-z:9990;
  --v08-toast-z:10020;
}

html[data-v08-ux="p1"]{scroll-padding-top:calc(76px + var(--v08-safe-top));}
body.v08-overlay-open{overflow:hidden;overscroll-behavior:none;}

.topbar.v08-shell-header{
  display:grid;
  grid-template-columns:var(--v08-touch-target) minmax(0,1fr) var(--v08-touch-target);
  align-items:center;
  gap:var(--v08-space-2);
  min-height:calc(64px + var(--v08-safe-top));
  padding-top:max(var(--v08-space-2),var(--v08-safe-top));
  padding-right:max(var(--v08-space-3),var(--v08-safe-right));
  padding-left:max(var(--v08-space-3),var(--v08-safe-left));
}
.topbar.v08-shell-header .v08-header-copy{min-width:0;}
.topbar.v08-shell-header .v08-header-copy .eyebrow{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.topbar.v08-shell-header .v08-header-copy h1{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.v08-header-button{
  width:var(--v08-touch-target);
  min-width:var(--v08-touch-target);
  height:var(--v08-touch-target);
  min-height:var(--v08-touch-target);
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  background:rgba(255,255,255,.055);
  color:inherit;
  font:inherit;
  font-weight:800;
  -webkit-tap-highlight-color:transparent;
  touch-action:manipulation;
}
.v08-header-button:active{transform:scale(.97);}
.v08-header-button:focus-visible{outline:2px solid currentColor;outline-offset:2px;}
.v08-header-back span{font-size:32px;line-height:1;transform:translateY(-1px);}
.v08-header-help{font-size:18px;}
.v08-header-button.is-placeholder{visibility:hidden;pointer-events:none;}

.bottom-nav{padding-bottom:max(var(--v08-space-2),var(--v08-safe-bottom));}
.nav-item,.btn,.icon-btn,.v08-header-button,.v08-overlay-close,.v08-toast-close{min-height:var(--v08-touch-target);touch-action:manipulation;}

button[data-v08-action="primary"],.v08-action-primary{font-weight:800;}
button[data-v08-action="secondary"],.v08-action-secondary{font-weight:700;}
button[data-v08-action="warning"],.v08-action-warning{font-weight:800;}
button[data-v08-action="destructive"],.v08-action-destructive{font-weight:800;}

.v08-action-bar{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:var(--v08-space-2);
  padding:var(--v08-space-3);
  border-radius:var(--v08-radius-md);
}
.v08-sticky-actions{
  position:sticky;
  bottom:calc(68px + max(var(--v08-space-2),var(--v08-safe-bottom)));
  z-index:20;
  margin-top:var(--v08-space-3);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.v08-ui-layer{position:relative;z-index:var(--v08-overlay-z);}
.v08-overlay{
  position:fixed;
  inset:0;
  z-index:var(--v08-overlay-z);
  display:flex;
  align-items:flex-end;
  justify-content:center;
  padding:max(var(--v08-space-4),var(--v08-safe-top)) max(var(--v08-space-3),var(--v08-safe-right)) max(var(--v08-space-3),var(--v08-safe-bottom)) max(var(--v08-space-3),var(--v08-safe-left));
  background:rgba(0,0,0,.58);
  opacity:0;
  transition:opacity .18s ease;
}
.v08-overlay.is-open{opacity:1;}
.v08-sheet,.v08-modal{
  width:min(100%,560px);
  max-height:min(84dvh,760px);
  overflow:auto;
  overscroll-behavior:contain;
  border:1px solid rgba(255,255,255,.12);
  background:#0b1723;
  color:#f3f7fb;
  box-shadow:0 22px 72px rgba(0,0,0,.46);
}
.v08-sheet{
  border-radius:var(--v08-radius-lg) var(--v08-radius-lg) var(--v08-radius-md) var(--v08-radius-md);
  transform:translateY(24px);
  transition:transform .18s ease;
}
.v08-overlay.is-open .v08-sheet{transform:translateY(0);}
.v08-overlay[data-v08-overlay="modal"]{align-items:center;}
.v08-modal{border-radius:var(--v08-radius-lg);transform:scale(.97);transition:transform .18s ease;}
.v08-overlay.is-open .v08-modal{transform:scale(1);}
.v08-overlay-head{
  position:sticky;
  top:0;
  z-index:2;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--v08-space-3);
  padding:var(--v08-space-4);
  background:rgba(11,23,35,.96);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.v08-overlay-head h2{margin:2px 0 0;font-size:20px;}
.v08-overlay-close{
  width:var(--v08-touch-target);
  min-width:var(--v08-touch-target);
  border:0;
  border-radius:14px;
  background:rgba(255,255,255,.07);
  color:inherit;
  font-size:24px;
}
.v08-overlay-body{padding:0 var(--v08-space-4) var(--v08-space-4);line-height:1.55;}
.v08-overlay-body p{margin:0;}
.v08-overlay-actions{
  position:sticky;
  bottom:0;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:var(--v08-space-2);
  padding:var(--v08-space-3) var(--v08-space-4) max(var(--v08-space-3),var(--v08-safe-bottom));
  background:rgba(11,23,35,.96);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.v08-overlay-action{min-height:var(--v08-touch-target);}

.v08-toast-stack{
  position:fixed;
  z-index:var(--v08-toast-z);
  top:calc(max(var(--v08-space-3),var(--v08-safe-top)) + 68px);
  left:max(var(--v08-space-3),var(--v08-safe-left));
  right:max(var(--v08-space-3),var(--v08-safe-right));
  display:grid;
  gap:var(--v08-space-2);
  pointer-events:none;
}
.v08-toast{
  width:min(100%,520px);
  margin:0 auto;
  min-height:var(--v08-touch-target);
  display:grid;
  grid-template-columns:10px minmax(0,1fr) var(--v08-touch-target);
  align-items:center;
  gap:var(--v08-space-2);
  padding:var(--v08-space-2) var(--v08-space-2) var(--v08-space-2) var(--v08-space-3);
  border:1px solid rgba(255,255,255,.12);
  border-radius:var(--v08-radius-md);
  background:rgba(8,19,30,.96);
  color:#f6f8fb;
  box-shadow:0 14px 38px rgba(0,0,0,.34);
  transform:translateY(-10px);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease,transform .18s ease;
}
.v08-toast.is-visible{opacity:1;transform:translateY(0);}
.v08-toast-dot{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.78;}
.v08-toast-close{width:var(--v08-touch-target);border:0;background:transparent;color:inherit;font-size:20px;pointer-events:auto;}
.v08-toast-success{border-color:rgba(86,214,145,.35);}
.v08-toast-warning{border-color:rgba(255,190,92,.38);}
.v08-toast-danger{border-color:rgba(255,105,105,.42);}

@media (min-width:700px){
  .v08-overlay{align-items:center;}
  .v08-sheet{border-radius:var(--v08-radius-lg);}
  .v08-sticky-actions{bottom:var(--v08-space-4);}
}

@media (prefers-reduced-motion:reduce){
  .v08-overlay,.v08-sheet,.v08-modal,.v08-toast{transition:none!important;animation:none!important;}
}


/* P7.5 UX / Product Polish */
html{-webkit-text-size-adjust:100%;}
body{min-height:100dvh;}
#screen{overflow-anchor:none;}
.v08-state-surface{min-height:180px;display:grid;place-items:center;align-content:center;gap:10px;text-align:center;padding:24px 18px;}
.v08-state-surface>p{max-width:34rem;margin:0 auto;line-height:1.55;}
.v08-state-surface[aria-busy="true"]::before{content:"";width:28px;height:28px;border:3px solid rgba(255,255,255,.18);border-top-color:currentColor;border-radius:50%;animation:v08-p75-spin .8s linear infinite;}
@keyframes v08-p75-spin{to{transform:rotate(360deg)}}
.btn:focus-visible,.nav-item:focus-visible,.icon-btn:focus-visible,.v08-overlay-action:focus-visible{outline:2px solid currentColor;outline-offset:2px;}
@supports not (height:100dvh){body{min-height:100vh;}}
@media(prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;}}
