/* 1NFINIT3 OLIVE APP V31 — authenticated continuation of the same three-world product. */
:root{
  --olive-gold:#d7a127;
  --olive-gold-hi:#fff2b5;
  --olive-glass:rgba(255,255,255,.12);
  --olive-line:rgba(255,255,255,.34);
  --olive-text:#f8f7f2;
  --olive-muted:rgba(248,247,242,.66);
  --olive-shadow:rgba(4,16,22,.16);
}
html[data-olive-world="midday"]{color-scheme:dark}
html[data-olive-world="night"]{color-scheme:dark}
html[data-olive-world="fullday"]{color-scheme:light;--olive-text:#171717;--olive-muted:rgba(23,23,23,.58);--olive-line:rgba(75,61,31,.14);--olive-glass:rgba(255,255,255,.70);--olive-shadow:rgba(78,60,25,.08)}
html,body{background:transparent!important;color:var(--olive-text)!important}
body{min-height:100vh}
.cosmos{isolation:isolate;background:none!important}
.cosmos::before,.cosmos::after{content:"";position:absolute;inset:0;pointer-events:none;transition:opacity .65s ease,filter .65s ease}
.cosmos::before{z-index:-2;background:linear-gradient(180deg,rgba(26,77,96,.16),rgba(26,60,24,.22)),url('/assets/v22-world-midday.jpg') center/cover no-repeat;filter:saturate(1.02) brightness(.88)}
.cosmos::after{z-index:-1;background:linear-gradient(180deg,rgba(4,16,22,.26),rgba(4,15,18,.54));opacity:.46;mask-image:none!important}
html[data-olive-world="night"] .cosmos::before{filter:brightness(.27) saturate(.55) hue-rotate(176deg) contrast(1.08)}
html[data-olive-world="night"] .cosmos::after{background:radial-gradient(circle at 50% 38%,transparent 20%,rgba(0,2,8,.42) 72%),linear-gradient(rgba(0,4,14,.30),rgba(0,2,8,.70));opacity:1}
html[data-olive-world="fullday"] .cosmos::before{background:radial-gradient(circle at 50% 18%,rgba(255,242,181,.15),transparent 21%),linear-gradient(145deg,#fff,#fbfaf6 55%,#f2eee4);filter:none}
html[data-olive-world="fullday"] .cosmos::after{background:radial-gradient(ellipse at center,transparent 52%,rgba(209,195,163,.12));opacity:1}

.boot{background:rgba(5,7,9,.76)!important;backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px)}
html[data-olive-world="fullday"] .boot{background:rgba(248,247,242,.88)!important;color:#171717}
.auth-card,.panel,.metrics article,.module,.list-item,.setup-grid .check,.composition>div{
  background:linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.065))!important;
  border-color:var(--olive-line)!important;
  color:var(--olive-text)!important;
  box-shadow:0 24px 72px var(--olive-shadow)!important;
  backdrop-filter:blur(28px) saturate(145%)!important;
  -webkit-backdrop-filter:blur(28px) saturate(145%)!important;
}
html[data-olive-world="night"] .auth-card,html[data-olive-world="night"] .panel,html[data-olive-world="night"] .metrics article,html[data-olive-world="night"] .module,html[data-olive-world="night"] .list-item{background:linear-gradient(145deg,rgba(15,20,31,.64),rgba(7,10,17,.44))!important}
html[data-olive-world="fullday"] .auth-card,html[data-olive-world="fullday"] .panel,html[data-olive-world="fullday"] .metrics article,html[data-olive-world="fullday"] .module,html[data-olive-world="fullday"] .list-item,html[data-olive-world="fullday"] .setup-grid .check,html[data-olive-world="fullday"] .composition>div{background:rgba(255,255,255,.72)!important;border-color:rgba(75,61,31,.13)!important;box-shadow:0 20px 52px rgba(78,60,25,.07)!important}

.app{background:transparent!important}
.topbar{
  background:linear-gradient(180deg,rgba(7,14,19,.54),rgba(7,14,19,.26))!important;
  border-color:var(--olive-line)!important;
  backdrop-filter:blur(28px) saturate(150%)!important;
  -webkit-backdrop-filter:blur(28px) saturate(150%)!important;
}
html[data-olive-world="fullday"] .topbar{background:rgba(255,255,255,.73)!important;border-color:rgba(75,61,31,.12)!important}
.brand img{width:118px!important;filter:drop-shadow(0 4px 15px rgba(0,0,0,.12))}
.command{background:rgba(255,255,255,.075)!important;border-color:var(--olive-line)!important;color:var(--olive-muted)!important;backdrop-filter:blur(18px)}
html[data-olive-world="fullday"] .command{background:rgba(255,255,255,.74)!important;color:rgba(23,23,23,.58)!important}
.global-rail,.context-rail{background:rgba(8,15,20,.30)!important;border-color:var(--olive-line)!important;backdrop-filter:blur(26px) saturate(142%)!important;-webkit-backdrop-filter:blur(26px) saturate(142%)!important}
html[data-olive-world="night"] .global-rail,html[data-olive-world="night"] .context-rail{background:rgba(5,8,15,.48)!important}
html[data-olive-world="fullday"] .global-rail,html[data-olive-world="fullday"] .context-rail{background:rgba(255,255,255,.58)!important;border-color:rgba(75,61,31,.12)!important}
.global-rail button,.context-rail nav a,.context-rail nav button{color:var(--olive-muted)!important}
.global-rail button.active{color:var(--olive-text)!important;background:rgba(255,255,255,.10)!important;border-color:var(--olive-line)!important}

.workspace{color:var(--olive-text)!important}
.lede,.prose,.metrics span,.metrics small,.module span,.list-item span,.kv span,.rail-state span{color:var(--olive-muted)!important}
.eyebrow{color:var(--olive-gold-hi)!important}
html[data-olive-world="fullday"] .eyebrow{color:#9b6a12!important}
.primary{background:radial-gradient(circle at 35% 28%,#fff2b5,#d69722 57%,#8d5c0e)!important;color:#17120a!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.52),0 10px 24px rgba(109,76,16,.13)}
.secondary,.ghost{background:rgba(255,255,255,.06)!important;border-color:var(--olive-line)!important;color:var(--olive-text)!important}
html[data-olive-world="fullday"] .secondary,html[data-olive-world="fullday"] .ghost{background:rgba(255,255,255,.58)!important;color:#171717!important}

/* App world selector: same three unboxed circles as the public header. */
.olive-app-worlds{display:flex;gap:6px;align-items:center;margin-left:2px;margin-right:3px}
.olive-app-worlds button{width:14px;height:14px;border:0;outline:0;border-radius:50%;padding:0;cursor:pointer;opacity:.58;transform:scale(.82);box-shadow:0 2px 8px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.44);transition:.2s ease}
.olive-app-worlds button[data-world="night"]{background:linear-gradient(135deg,#020205,#171a23)}
.olive-app-worlds button[data-world="midday"]{background:linear-gradient(135deg,#505837,#b8c18c)}
.olive-app-worlds button[data-world="fullday"]{background:linear-gradient(135deg,#fff,#e7e3d7)}
.olive-app-worlds button[aria-pressed="true"]{opacity:1;transform:scale(1.08)}
.olive-app-worlds button:focus-visible{outline:2px solid rgba(255,242,181,.9);outline-offset:3px}

.auth-card input,.setup-grid input,.setup-grid select,.q-form textarea,.command-box input{background:rgba(7,11,15,.36)!important;border-color:var(--olive-line)!important;color:var(--olive-text)!important;backdrop-filter:blur(14px)}
html[data-olive-world="fullday"] .auth-card input,html[data-olive-world="fullday"] .setup-grid input,html[data-olive-world="fullday"] .setup-grid select,html[data-olive-world="fullday"] .q-form textarea,html[data-olive-world="fullday"] .command-box input{background:rgba(255,255,255,.72)!important;color:#171717!important}

.mobile-nav{background:rgba(7,13,18,.70)!important;border-color:var(--olive-line)!important;backdrop-filter:blur(28px) saturate(150%)!important;-webkit-backdrop-filter:blur(28px) saturate(150%)!important}
html[data-olive-world="fullday"] .mobile-nav{background:rgba(255,255,255,.82)!important;border-color:rgba(75,61,31,.12)!important}.mobile-nav button.active{color:var(--olive-gold-hi)!important}html[data-olive-world="fullday"] .mobile-nav button.active{color:#9b6a12!important}

@media(max-width:780px){
  .topbar{gap:9px}.brand img{width:94px!important}.olive-app-worlds{gap:4px}.olive-app-worlds button{width:11px;height:11px}.command{min-width:0}.workspace{padding-top:26px!important}
}
@media(prefers-reduced-motion:reduce){.cosmos::before,.cosmos::after,.olive-app-worlds button{transition:none!important}}


/* V31.3 QALS accessibility hit-area correction.
   The visual dots remain small; the interactive target is 44x44 CSS px. */
.olive-app-worlds button{
  position:relative;
  width:44px!important;
  height:44px!important;
  min-width:44px!important;
  min-height:44px!important;
  opacity:1!important;
  transform:none!important;
  box-shadow:none!important;
  background:transparent!important;
}
.olive-app-worlds button::before{
  content:"";
  position:absolute;
  left:50%;top:50%;
  width:14px;height:14px;
  margin:-7px 0 0 -7px;
  border-radius:50%;
  opacity:.58;
  transform:scale(.82);
  box-shadow:0 2px 8px rgba(0,0,0,.15),inset 0 1px 0 rgba(255,255,255,.44);
  transition:opacity .2s ease,transform .2s ease;
}
.olive-app-worlds button[data-world="night"]::before{background:linear-gradient(135deg,#020205,#171a23)}
.olive-app-worlds button[data-world="midday"]::before{background:linear-gradient(135deg,#505837,#b8c18c)}
.olive-app-worlds button[data-world="fullday"]::before{background:linear-gradient(135deg,#fff,#e7e3d7)}
.olive-app-worlds button[aria-pressed="true"]::before{opacity:1;transform:scale(1.08)}
@media(max-width:780px){
  .olive-app-worlds button{width:44px!important;height:44px!important}
  .olive-app-worlds button::before{width:11px;height:11px;margin:-5.5px 0 0 -5.5px}
}
@media(prefers-reduced-motion:reduce){
  .olive-app-worlds button::before{transition:none!important}
}


/* 1NFINIT3 AUTHENTICATED WORKSPACE V31.3 — SPACIOUS ENTERPRISE RHYTHM
   Keep the same functional surfaces, but stop presenting them as a compressed
   three-rail dashboard. Primary work receives the largest visual field.
*/
@media(min-width:781px){
  .app{
    grid-template-columns:72px 218px minmax(0,1fr)!important;
    grid-template-rows:68px 1fr!important;
  }
  .topbar{
    height:68px!important;
    padding:0 22px!important;
    gap:18px!important;
  }
  .brand img{width:104px!important}
  .command{
    max-width:720px!important;
    min-height:46px!important;
    padding:11px 15px!important;
    border-radius:16px!important;
  }
  .global-rail{
    top:68px!important;
    height:calc(100vh - 68px)!important;
    gap:12px!important;
    padding:22px 10px!important;
  }
  .global-rail button{
    min-height:58px!important;
    border-radius:18px!important;
    padding:12px 4px!important;
  }
  .context-rail{
    top:68px!important;
    height:calc(100vh - 68px)!important;
    padding:30px 18px!important;
  }
  .context-rail h2{margin-bottom:24px!important}
  .context-rail nav{gap:8px!important}
  .context-rail nav a,.context-rail nav button{
    min-height:42px!important;
    padding:10px 10px!important;
    border-radius:12px!important;
  }
  .workspace{
    padding:56px clamp(34px,5vw,84px) 124px!important;
    max-width:1580px!important;
  }
  .hero{gap:36px!important;margin-bottom:34px!important}
  .lede,.prose{line-height:1.72!important}
  .metrics{
    gap:16px!important;
    margin:34px 0 20px!important;
  }
  .metrics article{
    min-height:136px!important;
    padding:22px!important;
    border-radius:24px!important;
  }
  .two{gap:18px!important}
  .panel{
    padding:28px!important;
    margin:18px 0!important;
    border-radius:26px!important;
  }
  .panel h2{margin-bottom:16px!important}
  .list{gap:11px!important}
  .list-item{
    min-height:64px!important;
    padding:15px 16px!important;
    border-radius:16px!important;
  }
  .module-grid{gap:14px!important}
  .module{
    min-height:108px!important;
    padding:18px!important;
    border-radius:18px!important;
  }
  .setup-grid{gap:14px 18px!important}
  .setup-grid .check{padding:15px!important;border-radius:16px!important}
  .composition{gap:14px!important}
  .composition>div{padding:17px!important;border-radius:16px!important}
  .q-thread{gap:14px!important;margin:30px 0!important}
  .q-msg{padding:17px 19px!important;border-radius:20px!important}
  .q-form{gap:12px!important}
  .q-form textarea{min-height:92px!important}
}

/* Phone/tablet work surfaces become a single calm column; no metric/card squeezing. */
@media(max-width:780px){
  .app{padding-bottom:82px!important}
  .topbar{
    min-height:66px!important;
    height:auto!important;
    padding:10px 14px!important;
    gap:12px!important;
  }
  .brand img{width:96px!important}
  .command{
    min-height:44px!important;
    border-radius:16px!important;
    padding:10px 12px!important;
  }
  .workspace{
    padding:38px 18px 116px!important;
  }
  .view>h1,.hero h1{
    font-size:clamp(38px,10.5vw,52px)!important;
    line-height:1.01!important;
  }
  .lede,.prose{
    font-size:14px!important;
    line-height:1.7!important;
  }
  .hero{display:grid!important;gap:20px!important}
  .hero .secondary{
    margin-top:0!important;
    justify-self:start!important;
    min-height:44px!important;
  }
  .metrics{
    grid-template-columns:1fr!important;
    gap:14px!important;
    margin:30px 0 20px!important;
  }
  .metrics article{
    min-height:108px!important;
    padding:20px!important;
    border-radius:22px!important;
  }
  .two,.setup-grid,.composition,.module-grid{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }
  .panel{
    padding:22px!important;
    margin:16px 0!important;
    border-radius:24px!important;
  }
  .list{gap:10px!important}
  .list-item{
    min-height:60px!important;
    padding:15px!important;
    border-radius:16px!important;
  }
  .module{
    min-height:92px!important;
    padding:17px!important;
    border-radius:17px!important;
  }
  .setup-grid label{gap:8px!important;margin:0!important}
  .setup-grid input,.setup-grid select,.q-form textarea,.command-box input{
    min-height:48px!important;
    border-radius:15px!important;
    padding:13px!important;
  }
  .q-thread{gap:13px!important;margin:26px 0!important}
  .q-msg{
    max-width:92%!important;
    padding:15px 17px!important;
    border-radius:20px!important;
  }
  .q-form{gap:12px!important}
  .q-form textarea{min-height:96px!important}
  .primary,.secondary,.ghost{
    min-height:44px!important;
    padding:11px 16px!important;
  }
  .mobile-nav{
    gap:4px!important;
    padding:9px 8px calc(9px + env(safe-area-inset-bottom))!important;
    background:rgba(10,14,12,.74)!important;
    border-top-color:rgba(255,255,255,.10)!important;
  }
  .mobile-nav button{
    min-height:46px!important;
    border-radius:16px!important;
    padding:9px 3px!important;
  }
}
@media(max-width:430px){
  .workspace{padding-inline:16px!important}
  .topbar{padding-inline:12px!important}
  .truth{display:none!important}
}
