@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Geist:wght@400;500;600;700;800&display=swap');
:root{color-scheme:light;--navy:#102841;--blue:#185bbb;--muted:#50657b;--line:#c7d7e5;--surface:#f4f9fe;font-family:"DM Sans",system-ui,sans-serif;color:var(--navy);background:#c6d6e4}
*{box-sizing:border-box}body{margin:0;background:linear-gradient(120deg,#e5eff7df,#e8f1f7e8),url('/mine-aerial.jpeg') center/cover fixed;min-height:100vh}button,input,textarea,select{font:inherit}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #348ae7;outline-offset:3px}button:disabled{opacity:.65;cursor:wait}
.shell{display:grid;grid-template-columns:244px minmax(0,1fr);min-height:100vh}.sidebar{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;overflow:auto;background:linear-gradient(160deg,#142e48,#08182b 73%);color:#e5f0ff;border-right:1px solid #577491;box-shadow:8px 0 30px #0e2a4734;padding:23px 14px}.brand{display:flex;align-items:center;gap:12px;padding:0 5px 24px}.brand strong,.sidebar-footer strong{display:block}.brand strong{font:750 18px Geist,sans-serif;letter-spacing:-.4px}.brand small,.sidebar-footer small{display:block;color:#c0d2e5;font-size:11px;margin-top:4px}.brand small{letter-spacing:1.1px}.logo{width:52px;height:52px;display:grid;place-items:center;background:white;border-radius:12px;overflow:hidden;box-shadow:0 4px 10px #0006;flex:none}.logo img{display:block;width:44px;height:44px;object-fit:contain}.sidebar nav{display:grid;gap:4px}.sidebar nav a{display:flex;align-items:center;gap:10px;padding:10px 9px;border-radius:9px;font-size:14px;color:#d3e1f0;border:1px solid transparent}.sidebar nav a:hover{background:#ffffff13}.sidebar nav a[aria-current]{background:linear-gradient(140deg,#285780,#17416a);border-color:#4c779e;color:#fff;box-shadow:0 4px 10px #0003,inset 0 1px #ffffff29}.ico{width:20px;height:20px;vertical-align:middle;flex:none;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.sidebar-footer{margin-top:auto;border-top:1px solid #334b65;padding:15px 4px 0;display:flex;gap:9px;align-items:center;font-size:11px}.site-dot{width:8px;height:8px;border-radius:50%;background:#5ee3c4;box-shadow:0 0 0 4px #5ee3c42b;flex:none}
main{width:100%;max-width:1570px;padding:0 30px 34px;margin:auto;align-self:start}.top{display:flex;align-items:center;gap:14px;min-height:64px;font-size:12px;color:#354c65}.top b{margin:0 6px;color:#64819a}.top time{margin-left:auto;white-space:nowrap}.tag,.badge{display:inline-block;border-radius:6px;padding:4px 8px;background:#d9e9f9;color:#204f7e;font-size:11px;font-weight:700}.tag{background:#f8e9c5;color:#65450a}
.hero{min-height:276px;display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:30px;border-radius:17px;background:linear-gradient(91deg,#071b30f7 4%,#102d47db 39%,#112d4c26 100%),linear-gradient(0deg,#102841b9,transparent),url('/mine-aerial.jpeg') center 48%/cover;color:white;box-shadow:0 14px 24px #12355239,inset 0 1px #a2c5ea8c;border:1px solid #557a9e}.hero p{color:#e5eff9;margin:0 0 8px}.hero .site{color:#a9dbff;font-size:12px;font-weight:700;letter-spacing:.09em;text-transform:uppercase}.hero h1{font:750 clamp(35px,4.8vw,65px)/1 Geist,sans-serif;letter-spacing:-.065em;margin:10px 0 13px}.hero .quiet{background:#102940c7;color:white;border-color:#7491ab}.actions{display:flex;gap:8px;flex-wrap:wrap}.primary,.quiet{border:1px solid #aec7dd;border-radius:8px;padding:9px 13px;background:#edf6ff;color:#1a466d;font-weight:700;font-size:13px;box-shadow:inset 0 1px #fff8}.primary{border-color:#164f9d;background:linear-gradient(#287bd9,#1859ad);color:white;box-shadow:0 4px 10px #124b883d,inset 0 1px #82b9f3}.primary:hover,.quiet:hover{filter:brightness(1.08)}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin:17px 0}.metric,.panel{background:linear-gradient(145deg,#ffffff,#edf5fc);border:1px solid #f8fcff;box-shadow:0 6px 0 #9bb3ca70,0 12px 23px #244e7529;border-radius:13px}.metric{padding:16px;display:block}.metric:hover{background:#fff}.metric-head{display:flex;justify-content:space-between;gap:4px;align-items:center;font-size:12px;font-weight:700}.tile-icon{display:inline-grid;place-items:center;width:33px;height:33px;border-radius:9px;background:linear-gradient(#d6eafd,#bbd6f0);color:#1a5e99;box-shadow:inset 0 1px #fff,0 2px 4px #37658a38}.metric strong{display:block;font:750 34px Geist,sans-serif;letter-spacing:-.06em;margin:6px 0}.muted,.metric small{color:var(--muted)}.metric small{font-size:12px}.dash-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:14px}.panel{padding:18px;margin-bottom:16px;min-width:0}.panel h2{font:700 18px Geist,sans-serif;letter-spacing:-.4px;margin:0 0 11px}.panel p{margin:6px 0}.panel-head,.page-head{display:flex;justify-content:space-between;align-items:center;gap:12px}.page-head{padding:21px 23px;margin-bottom:16px;background:#eaf4fbea;border-radius:13px;border:1px solid #fff}.page-head h1{font:750 clamp(26px,4vw,40px) Geist,sans-serif;letter-spacing:-.05em;margin:0}.page-head p{margin:5px 0 0;color:var(--muted);line-height:1.5}
.occupancy{display:flex;gap:20px;align-items:center}.ring{width:106px;aspect-ratio:1;border-radius:50%;background:conic-gradient(#236dbf var(--progress),#ceddeb 0);display:grid;place-items:center;box-shadow:0 4px 10px #12334f33;flex:none}.ring strong{width:80px;aspect-ratio:1;background:#f1f7fc;border-radius:50%;display:grid;place-items:center;font:750 23px Geist,sans-serif}.legend,.queue{list-style:none;padding:0;margin:0}.legend li,.queue a{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid #d1deea;font-size:13px}.legend{flex:1}.queue small{display:block;color:var(--muted);margin-top:3px}.queue a:hover{color:var(--blue)}.meal-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.meal-grid div{padding:10px;background:#deebf6;border-radius:8px;font-size:12px}.meal-grid strong{display:block;font:700 22px Geist,sans-serif;margin:3px 0}.inventory{display:flex;gap:8px;flex-wrap:wrap}.bed{padding:8px 10px;background:#e1eef9;border-radius:8px;font-size:12px}.bed small{display:block;color:var(--muted)}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:14px}th,td{padding:10px 8px;border-bottom:1px solid #cbdbe9;vertical-align:top}th{color:#4c6379;font-size:12px;text-transform:uppercase;letter-spacing:.04em}td small{display:block;color:var(--muted);margin-top:4px;white-space:pre-wrap;overflow-wrap:anywhere}.record-actions button,.record-actions a{display:inline-block;margin:2px;padding:5px 8px;font-size:11px}.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 11px}.filters input{min-width:min(100%,230px)}input,select,textarea{border:1px solid #a8bed2;background:#fff;border-radius:7px;padding:9px 10px;color:var(--navy);min-width:0}dialog{border:1px solid #a3bbd0;border-radius:14px;padding:0;background:#f2f8fd;color:var(--navy);width:min(94vw,500px);box-shadow:0 20px 75px #00162b80}dialog::backdrop{background:#081c33aa}dialog form{padding:20px}.dialog-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.dialog-head h2{margin:0;font:700 22px Geist,sans-serif}#fields{display:grid;gap:10px}#fields label{display:grid;gap:4px;font-size:13px;font-weight:700}#form-error{color:#9c1a2a;font-size:13px}
@media(max-width:980px){.shell{grid-template-columns:195px minmax(0,1fr)}main{padding:0 18px 28px}.hero{padding:22px}.metrics{gap:8px}.metric{padding:10px}.metric-head .tile-icon{display:none}}
@media(max-width:720px){.shell{display:block}.sidebar{position:static;height:auto;padding:12px}.brand{padding:0 0 9px}.sidebar nav{display:flex;overflow:auto}.sidebar nav a{white-space:nowrap;padding:7px}.sidebar-footer{display:none}.top{min-height:48px;flex-wrap:wrap}.top time{display:none}.hero{min-height:230px;display:grid;align-content:end}.dash-grid{grid-template-columns:1fr}.metrics{grid-template-columns:repeat(2,1fr)}.page-head{align-items:flex-start;flex-direction:column}.meal-grid{grid-template-columns:repeat(2,1fr)}}
.metric {
  transform: perspective(750px) translateZ(0);
  transition: transform 170ms ease-out, box-shadow 170ms ease-out;
}
@media (hover:hover) and (pointer:fine) {
  .metric:hover {
    transform: perspective(750px) translateY(-4px) rotateX(4deg);
    box-shadow: 0 9px 0 #8aa7c475, 0 18px 24px #244e7540;
  }
}
.metric:focus-visible {
  box-shadow: 0 6px 0 #8aa7c475, 0 13px 25px #244e7540;
}
.metric:active {
  transform: translateY(2px);
  box-shadow: 0 3px 0 #8aa7c475, 0 7px 16px #244e7533;
}
@media (prefers-reduced-motion: reduce) {
  .metric, .metric:hover, .metric:active { transition:none; transform:none; }
}

.sign-in{max-width:440px;margin-top:24px}.sign-in form,.sign-in label{display:grid;gap:10px}.sign-in form{gap:15px}.sign-in button{justify-self:start}.sign-in [role=alert]{color:#9c1a2a}

/* Landing page */
.camp-landing {
  color:#ecf5ff;
  background:#081a2d;
}
.camp-landing .shell {
  display:block;
  position:relative;
  isolation:isolate;
  background:linear-gradient(90deg,#081a2df5 0%,#0a2032bd 54%,#102e45b3 100%),
    linear-gradient(0deg,#081a2d 0%,transparent 65%),url('/mine-aerial.jpeg') center/cover;
}
.camp-landing .sidebar {
  position:static;
  height:auto;
  padding:24px clamp(22px,5vw,80px);
  background:none;
  border:0;
  box-shadow:none;
}
.camp-landing .brand {width:fit-content;padding:0}
.camp-landing .sidebar nav,.camp-landing .sidebar-footer,
.camp-landing .top > :not(#language) {display:none}
.camp-landing main {max-width:1600px;min-height:0;padding:0 clamp(22px,5vw,80px) 48px}
.camp-landing .top {
  position:absolute;
  top:24px;
  right:clamp(22px,5vw,80px);
  min-height:52px;
}
.camp-landing #language {background:#102942;color:#ecf5ff;border-color:#7394b6}
.camp-welcome {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,0.92fr);
  grid-template-areas:"copy scene" "access scene";
  align-items:center;
  gap:28px clamp(24px,6vw,100px);
  padding:clamp(24px,6vh,86px) 0;
}
.camp-welcome-copy {grid-area:copy;align-self:end}
.camp-location {color:#9ed5ff;font-size:0.9rem;font-weight:700}
.camp-welcome h1 {
  margin:10px 0 18px;
  font:800 clamp(2.8rem,6.5vw,7rem)/1 Geist,system-ui,sans-serif;
  letter-spacing:-0.065em;
}
.camp-welcome h1 em {font-style:normal;color:#9dd7ff}
.camp-intro {font-size:clamp(1rem,1.8vw,1.25rem);line-height:1.55;color:#daeaf9}
.camp-welcome .sign-in {
  grid-area:access;
  align-self:start;
  width:min(100%,420px);
  margin:0;
  padding:clamp(18px,3vw,26px);
  color:#132e49;
}
.camp-welcome .sign-in h2 {margin-top:0}
.camp-welcome .sign-in p {line-height:1.5}
.camp-orbit-scene {
  grid-area:scene;
  width:min(100%,520px);
  aspect-ratio:1;
  position:relative;
  justify-self:center;
  perspective:850px;
  transform-style:preserve-3d;
  pointer-events:none;
}
.camp-orbit-core,.camp-orbit {position:absolute;inset:0;margin:auto}
.camp-orbit-core {
  display:grid;
  place-items:center;
  width:34%;
  height:34%;
  aspect-ratio:1;
  border:1px solid #b7e3ff;
  border-radius:50%;
  color:#fff;
  background:radial-gradient(circle at 32% 24%,#8bdaff,#2864a1 48%,#0a294b 76%);
  box-shadow:inset 0 -8px 24px #031b37b8,0 0 45px #54baff85,0 18px 50px #05152eaa;
  font:800 clamp(1.4rem,4.2vw,3.9rem)/1 Geist,system-ui,sans-serif;
  letter-spacing:-.07em;
}
.camp-orbit-core span span {color:#bcecff}
.camp-orbit {
  width:77%;
  height:77%;
  transform:rotateZ(var(--plane,-24deg)) rotateX(64deg);
  transform-style:preserve-3d;
}
.camp-orbit:nth-of-type(3) {--plane:42deg;--period:26s;width:83%;height:83%}
.camp-orbit:nth-of-type(4) {--plane:103deg;--period:32s;width:91%;height:91%}
.camp-orbit-track {
  position:absolute;
  inset:0;
  border:1px solid #a8deffac;
  border-radius:50%;
  transform-style:preserve-3d;
  box-shadow:0 0 18px #8fd2ff55,inset 0 0 11px #8fd2ff42;
  animation:camp-orbit-turn var(--period,20s) linear infinite;
}
.camp-orbit-track span {
  position:absolute;
  display:grid;
  place-items:center;
  top:50%;
  left:100%;
  width:clamp(28px,4vw,47px);
  aspect-ratio:1;
  border:1px solid #aadeff;
  border-radius:12px;
  color:#fff;
  background:linear-gradient(145deg,#4188bb,#0d2a50);
  box-shadow:inset 0 1px #daf2ff99,0 0 18px #65bfff7d;
  transform:translate(-50%,-50%) rotateX(-64deg);
  animation:camp-orbit-upright var(--period,20s) linear infinite;
}
.camp-orbit-track span:nth-child(2) {left:0}
@keyframes camp-orbit-turn {to {transform:rotateZ(1turn)}}
@keyframes camp-orbit-upright {
  from {transform:translate(-50%,-50%) rotateZ(0turn) rotateX(-64deg) rotateZ(calc(-1 * var(--plane,-24deg)))}
  to {transform:translate(-50%,-50%) rotateZ(-1turn) rotateX(-64deg) rotateZ(calc(-1 * var(--plane,-24deg)))}
}
@media(max-width:720px) {
  .camp-landing .sidebar {padding-top:16px;padding-bottom:16px}
  .camp-landing .top {top:16px}
  .camp-welcome {grid-template-columns:minmax(0,1fr);grid-template-areas:"copy" "access" "scene";gap:18px;padding:20px 0 0}
  .camp-orbit-scene {width:min(82vw,320px)}
}
@media(prefers-reduced-motion:reduce) {
  .camp-orbit-track,.camp-orbit-track span {animation:none}
  .camp-orbit-track span {transform:translate(-50%,-50%) rotateX(-64deg) rotateZ(calc(-1 * var(--plane,-24deg)))}
}