/* AEGIS Landskab: garden theme. Loaded after app.css; it re-skins the same layout with deep greens, a marigold sun and soft serif headings.
   Lora (headings) is bundled in /fonts, so nothing is fetched from the internet. */
@font-face{font-family:"Lora";src:url("/fonts/Lora-Variable.woff") format("woff");font-weight:400 700;font-style:normal;font-display:swap}
@font-face{font-family:"Lora";src:url("/fonts/Lora-Italic-Variable.woff") format("woff");font-weight:400 700;font-style:italic;font-display:swap}

:root{
  --primary:#2f7a52; --primary-hover:#266a45; --primary-d:#1b5236; --primary-soft:#dcefdc; --primary-tint:#f0f8ee; --on-primary:#fff; --link:#1f6b45;
  --accent:#f0b24a;
  --ok:#1f7a4d; --ok-soft:#e1f2e2;
  --nav-bg:#173b2d; --nav-bg-2:#0e251b; --nav-text:#d2e6d8; --nav-dim:#8fb39e; --nav-line:rgba(255,255,255,.1);
  --bg:#eef4ea; --surface:#fbfdf9; --surface-2:#e4eee0; --line:#d6e3d0; --line-2:#bccfb6;
  --text:#17261d; --muted:#566a5d;
  --amber:#8a5a00; --amber-soft:#fbecc9; --red:#b0372c; --red-soft:#fae5e1; --blue:#285f80; --blue-soft:#e1eff6;
  --shadow-xs:0 1px 2px rgba(23,59,45,.08); --shadow:0 1px 2px rgba(23,59,45,.07),0 8px 22px rgba(23,59,45,.08); --shadow-lg:0 16px 50px rgba(6,24,15,.36);
  --r:20px; --r-sm:14px;
  --font-display:"Lora","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --hazard:linear-gradient(90deg,#2f7a52,#7cc27f 34%,#d3e98f 60%,#f0c46a 80%,#7cc27f);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){
  --primary:#5fbf86; --primary-hover:#7ad39c; --primary-d:#a8e6bf; --primary-soft:#1e3d2d; --primary-tint:#162a20; --on-primary:#0a1c12; --link:#8fe0ae;
  --ok:#5fd093; --ok-soft:#173826;
  --nav-bg:#0d2118; --nav-bg-2:#07130d;
  --bg:#0c1810; --surface:#122219; --surface-2:#192e22; --line:#233a2c; --line-2:#325140;
  --text:#e4efe6; --muted:#97ae9f;
  --amber:#f0b45a; --amber-soft:#3a2d12; --red:#ef8074; --red-soft:#3b1d1a; --blue:#72b8df; --blue-soft:#162f3c;
  --shadow-xs:0 1px 2px rgba(0,0,0,.4); --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 22px rgba(0,0,0,.32); color-scheme:dark}}
:root[data-theme=dark]{
  --primary:#5fbf86; --primary-hover:#7ad39c; --primary-d:#a8e6bf; --primary-soft:#1e3d2d; --primary-tint:#162a20; --on-primary:#0a1c12; --link:#8fe0ae;
  --ok:#5fd093; --ok-soft:#173826;
  --nav-bg:#0d2118; --nav-bg-2:#07130d;
  --bg:#0c1810; --surface:#122219; --surface-2:#192e22; --line:#233a2c; --line-2:#325140;
  --text:#e4efe6; --muted:#97ae9f;
  --amber:#f0b45a; --amber-soft:#3a2d12; --red:#ef8074; --red-soft:#3b1d1a; --blue:#72b8df; --blue-soft:#162f3c;
  --shadow-xs:0 1px 2px rgba(0,0,0,.4); --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 22px rgba(0,0,0,.32); color-scheme:dark}

/* ───── page: soft meadow light, leaves drift behind the content ───── */
html{background:var(--bg)}
body{background:
  radial-gradient(900px 520px at 100% -8%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 70%),
  radial-gradient(800px 600px at -10% 110%,color-mix(in srgb,var(--primary) 12%,transparent),transparent 70%),
  var(--bg);background-attachment:fixed}
::selection{background:color-mix(in srgb,var(--primary) 30%,transparent)}
.leaf-layer{position:fixed;left:0;top:0;pointer-events:none}
.leaf-layer.back{z-index:-1;filter:blur(1.4px)} .leaf-layer.front{z-index:20}
@media print{.leaf-layer{display:none!important}}

/* ───── type ───── */
h1,h2,h3,.side-brand,.kpi-v,.stat,.rec-clock,.wo-title,.login-brand h1{font-family:var(--font-display);font-optical-sizing:auto}
h1{font-weight:650;letter-spacing:-.015em} h2{font-weight:650;letter-spacing:-.01em} h3{font-weight:650;letter-spacing:-.005em}
.kpi-v,.stat{font-weight:600;letter-spacing:-.01em}
.side-brand{text-transform:none;letter-spacing:.005em;font-weight:650;font-size:1.18rem}
.topbar .side-brand{font-size:1.2rem}

/* ───── shell ───── */
.side{background:radial-gradient(420px 300px at 110% 105%,rgba(240,178,74,.14),transparent 70%),linear-gradient(185deg,var(--nav-bg),var(--nav-bg-2));overflow:hidden}
.side::after{content:"";position:absolute;left:0;right:0;bottom:0;height:120px;pointer-events:none;opacity:.5;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 264 120' preserveAspectRatio='none'%3E%3Cpath d='M0 120V96c10-2 14-22 20-36 4 14 2 28 10 38 6-20 12-44 22-62 4 24 4 42 12 56 8-14 14-30 26-40-2 18 0 34 6 46 8-12 22-24 34-26-6 14-6 26-2 38 10-14 20-34 38-42-4 16-2 30 6 42 8-10 18-18 28-20-4 10-4 18 0 26 8-6 18-8 22-6V120z' fill='%234f9f68' fill-opacity='.35'/%3E%3Cpath d='M0 120v-14c14-6 22-20 26-34 4 14 12 26 24 32 8-12 12-26 22-36 2 14 8 26 18 34 10-8 16-20 30-26-2 12 0 24 8 32 10-6 20-16 30-18-2 8 0 16 6 22 10-4 20-6 28-14 0 8 2 14 6 20 6-2 12-4 16-8v18z' fill='%237cc27f' fill-opacity='.28'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.side>*{position:relative;z-index:1}
.side::before{position:relative;z-index:1;height:7px!important}
.side-foot{background:linear-gradient(180deg,transparent,rgba(7,19,13,.35) 30%)}
.side nav a{border-radius:14px;transition:background .2s,color .2s,transform .15s}
.side nav a:hover{transform:translateX(2px)}
.side nav a.on{background:rgba(240,178,74,.14)} .side nav a.on svg{color:var(--accent)} .side nav a.on::before{background:var(--accent);width:5px;border-radius:0 6px 6px 0}
.topbar{background:color-mix(in srgb,var(--surface) 86%,transparent)} .topbar::after{height:3px!important}
.tabbar{background:color-mix(in srgb,var(--surface) 88%,transparent);border-top-color:var(--line)}
.tabbar .on{color:var(--primary-d)} .tabbar .on::before{background:var(--primary);left:34%;right:34%;height:4px;border-radius:0 0 6px 6px}
.logo{transition:transform .35s cubic-bezier(.3,1.6,.5,1);cursor:pointer;border-radius:30%!important;overflow:hidden;box-shadow:0 2px 8px rgba(14,37,27,.3)}
.logo:hover{transform:rotate(-8deg) scale(1.08)} .logo:active{transform:scale(.92)}
.logo svg{display:block;width:100%;height:100%}

/* ───── surfaces ───── */
.card{border-radius:var(--r);background:var(--surface);border-color:var(--line);box-shadow:var(--shadow)}
.list-row:not(.static){transition:background .18s} .list-row:not(.static):hover{background:var(--primary-tint)}
.btn{border-radius:14px}
.btn-primary{background:linear-gradient(180deg,color-mix(in srgb,var(--primary) 92%,#fff),var(--primary));box-shadow:0 1px 2px rgba(14,37,27,.3),0 6px 14px -6px color-mix(in srgb,var(--primary) 70%,transparent),inset 0 1px 0 rgba(255,255,255,.28)}
.btn-primary:hover:not(:disabled){background:var(--primary-hover);transform:translateY(-1px)} .btn:active:not(:disabled){transform:translateY(1px) scale(.985)}
.btn-soft{background:var(--primary-soft);color:var(--primary-d)} .btn-soft:hover:not(:disabled){background:color-mix(in srgb,var(--primary-soft) 80%,var(--primary))}
.badge-live::before,.dot{background:var(--accent)!important}
.toast{background:#143026;border-left:4px solid var(--accent);border-radius:16px} .toast-err{background:#8f2a21}
.scan-card{background:repeating-linear-gradient(135deg,var(--primary-tint) 0 14px,transparent 14px 28px)}
.wrap-card{background:linear-gradient(120deg,var(--primary-soft),var(--primary-tint))}
input,select,textarea{border-radius:13px}
input:focus,select:focus,textarea:focus{border-color:var(--primary)!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--primary) 22%,transparent)!important}
.tabs button.on,.tabs a.on{color:var(--primary-d);border-color:var(--primary)}

/* ───── timer + recorder ───── */
.timer-card{background:radial-gradient(520px 240px at 88% -24%,rgba(240,178,74,.34),transparent),radial-gradient(420px 260px at 0% 120%,rgba(124,194,127,.2),transparent),linear-gradient(160deg,#1f4b38,#0f271c);box-shadow:0 18px 40px -18px rgba(6,24,15,.85)}
.timer-card:not(.idle)::after{width:170px;height:170px;right:-30px;bottom:-34px;opacity:.9;animation:sway 7s ease-in-out infinite;transform-origin:50% 100%;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cpath d='M60 118C60 80 58 60 60 30' stroke='%237cc27f' stroke-opacity='.45' stroke-width='4' fill='none' stroke-linecap='round'/%3E%3Cpath d='M59 86C34 88 14 70 10 46c26-2 46 12 49 40z' fill='%237cc27f' fill-opacity='.32'/%3E%3Cpath d='M61 62C60 30 82 10 112 8c2 32-20 56-51 54z' fill='%23bfe39b' fill-opacity='.3'/%3E%3C/svg%3E") center/contain no-repeat}
@keyframes sway{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(5deg)}}
.empty-ic{background:var(--primary-soft);color:var(--primary-d)}
.empty-ic::before{opacity:.8;animation:sway 6s ease-in-out infinite;inset:-30px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 120'%3E%3Cpath d='M20 52c4-24 24-38 46-38 0 26-16 44-46 38z' fill='%237cc27f' fill-opacity='.4'/%3E%3Cpath d='M100 74c-2 22-20 34-42 32 0-24 14-40 42-32z' fill='%23d3e98f' fill-opacity='.5'/%3E%3Cpath d='M92 22c10 6 14 16 12 28-12-2-18-12-12-28z' fill='%23f0c46a' fill-opacity='.5'/%3E%3C/svg%3E") center/contain no-repeat}
.mic-btn{background:linear-gradient(150deg,#ffd37a,#f0a93a);color:#33210a;box-shadow:0 12px 30px rgba(240,169,58,.42),inset 0 2px 0 rgba(255,255,255,.5),inset 0 -4px 0 rgba(0,0,0,.12)}
.mic-ring{background:rgba(240,178,74,.55)!important}

/* ───── work order card (voice report) ───── */
.wo{border-radius:22px;overflow:hidden}
.wo>.wo-h{background:linear-gradient(150deg,var(--primary-soft),var(--primary-tint))}
.wo-n{background:linear-gradient(160deg,#ffd37a,#f0a93a)!important;color:#33210a!important;border-radius:50%!important;box-shadow:0 2px 0 rgba(160,100,10,.35)}
.wo-tag{font-family:var(--font-display);font-style:italic;text-transform:none;letter-spacing:0;font-weight:600}

/* ───── login: the first thing anyone sees ───── */
.login{background:
  radial-gradient(520px 420px at 12% 8%,color-mix(in srgb,var(--primary) 20%,transparent),transparent 70%),
  radial-gradient(620px 460px at 94% 96%,color-mix(in srgb,var(--accent) 24%,transparent),transparent 70%),
  var(--bg)}
.login-card{border-radius:30px;padding-top:44px;background:color-mix(in srgb,var(--surface) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:var(--shadow),0 40px 80px -36px rgba(14,59,40,.5)}
.login-card::before{height:10px}
.login-brand h1{font-size:1.85rem;letter-spacing:-.01em;text-transform:none;color:var(--primary-d);font-weight:650}
.login-brand p{font-family:var(--font-display);font-style:italic;color:var(--muted);font-size:1.02rem}
.login-brand .logo{width:84px!important;height:84px!important;box-shadow:0 14px 30px -10px rgba(14,59,40,.6)}
@media (prefers-reduced-motion:no-preference){
  .login-brand .logo{animation:sprout .9s cubic-bezier(.2,1.5,.4,1) both}
  .login-brand h1,.login-brand p{animation:rise .7s .25s ease-out both} .login-brand p{animation-delay:.4s}
}
@keyframes sprout{from{transform:translateY(26px) scale(.55) rotate(-10deg);opacity:0}to{transform:none;opacity:1}}
@keyframes rise{from{transform:translateY(10px);opacity:0}to{transform:none;opacity:1}}

@media (prefers-reduced-motion:reduce){.timer-card:not(.idle)::after,.empty-ic::before{animation:none}}

/* ───── card watermarks: leaves instead of gears ───── */
.kpi::after,.stats>.card::after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M18 62C16 36 34 16 62 14c2 28-14 50-44 48z' fill='%237cc27f' fill-opacity='.3'/%3E%3Cpath d='M82 54c0 22-16 36-38 36 0-24 14-38 38-36z' fill='%23d3e98f' fill-opacity='.42'/%3E%3C/svg%3E") center/contain no-repeat;transform:rotate(8deg)}
.kpi.warn::after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cpath d='M18 62C16 36 34 16 62 14c2 28-14 50-44 48z' fill='%23f0b24a' fill-opacity='.35'/%3E%3Cpath d='M82 54c0 22-16 36-38 36 0-24 14-38 38-36z' fill='%23e7a97a' fill-opacity='.4'/%3E%3C/svg%3E") center/contain no-repeat}
.section-h h2::before{width:9px;height:.95em;border-radius:9px 2px 9px 2px;background:linear-gradient(160deg,#9fd68a,var(--primary))}
.side-foot{background:none}
.side-user,.side-foot .icon-btn{position:relative;z-index:2}