*{margin:0;padding:0;box-sizing:border-box}
body{background:#181613;font-family:"Segoe UI","Noto Sans TC",system-ui,sans-serif;overflow:hidden;height:100vh;color:#e2d8c8}
canvas{display:block;width:100%!important;height:100%!important}
#canvas-container{width:100%;height:100vh;position:relative}
#canvas-container[hidden],#login-page[hidden]{display:none}

/* Fixed-admin sign in */
#login-page{
  position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:24px;
  background:
    radial-gradient(circle at 18% 18%,rgba(126,151,62,.2),transparent 34%),
    radial-gradient(circle at 82% 80%,rgba(173,127,53,.13),transparent 32%),
    linear-gradient(145deg,#171813,#0d0e0b 65%,#17140f);
}
#login-page::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.3;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:42px 42px;
}
.admin-login-card{
  position:relative;width:min(100%,460px);padding:34px;border-radius:24px;
  background:linear-gradient(150deg,rgba(30,32,23,.97),rgba(14,15,12,.98));
  border:1px solid rgba(198,216,108,.2);
  box-shadow:0 30px 90px rgba(0,0,0,.52),inset 0 1px rgba(255,255,255,.035);
}
.admin-login-brand{display:flex;align-items:center;gap:17px;margin-bottom:30px}
.admin-login-logo-wrap{
  width:70px;height:70px;flex:0 0 70px;padding:3px;border-radius:20px;overflow:hidden;
  background:linear-gradient(145deg,rgba(201,218,104,.4),rgba(93,118,43,.18));
  border:1px solid rgba(202,221,111,.3);box-shadow:0 10px 28px rgba(0,0,0,.32);
}
.admin-login-logo-wrap img{display:block;width:100%;height:100%;border-radius:16px;object-fit:cover}
.admin-login-brand span{color:#b8ca70;font-size:10px;font-weight:850;letter-spacing:.16em}
.admin-login-brand h1{margin:4px 0 5px;color:#f3eadb;font-size:28px;line-height:1.15}
.admin-login-brand p{color:rgba(235,228,212,.55);font-size:13px;line-height:1.55}
.admin-login-form{display:grid;gap:17px}
.admin-login-form label{display:grid;gap:8px}
.admin-login-form label>span,.admin-login-field>label{color:rgba(239,232,216,.68);font-size:12px;font-weight:750}
.admin-login-field{display:grid;gap:8px}
.admin-password-field{position:relative;display:block}
.admin-login-form input{
  width:100%;height:48px;padding:0 14px;border:1px solid rgba(202,216,126,.18);border-radius:11px;
  outline:none;background:rgba(7,8,6,.55);color:#f3ecdf;font:inherit;transition:border-color .18s,box-shadow .18s;
}
.admin-password-field #admin-password{padding-right:68px}
#admin-password-toggle{
  position:absolute;top:50%;right:7px;transform:translateY(-50%);height:34px;padding:0 10px;
  border:0;border-radius:8px;background:rgba(183,205,96,.1);color:#cbd993;
  font-size:12px;font-weight:800;cursor:pointer;
}
#admin-password-toggle:hover{background:rgba(183,205,96,.18);color:#e5edb7}
#admin-password-toggle:focus-visible{outline:2px solid #d6e38c;outline-offset:1px}
#admin-password-toggle:disabled{cursor:wait;opacity:.5}
.admin-login-form input:focus{border-color:rgba(202,221,111,.58);box-shadow:0 0 0 3px rgba(178,200,81,.1)}
.admin-login-form input:disabled{cursor:wait;opacity:.6}
.admin-login-message{min-height:20px;color:rgba(231,225,209,.58);font-size:12px;line-height:1.5}
.admin-login-message[data-type="error"]{color:#ef9a91}
#admin-login-submit{
  height:48px;border:1px solid rgba(220,232,150,.28);border-radius:11px;
  background:linear-gradient(135deg,#71863d,#586a31);color:#fbfce9;font-size:14px;font-weight:850;
  cursor:pointer;box-shadow:0 10px 24px rgba(70,87,32,.25);transition:filter .18s,transform .18s;
}
#admin-login-submit:hover:not(:disabled){filter:brightness(1.12);transform:translateY(-1px)}
#admin-login-submit:disabled{cursor:wait;opacity:.62}

/* Top bar */
#top-bar{
  position:absolute;top:0;left:0;right:0;height:64px;padding:0 22px;
  display:flex;align-items:center;justify-content:space-between;
  background:linear-gradient(90deg,rgba(11,13,9,.96),rgba(19,22,14,.91) 52%,rgba(11,12,9,.96));
  border-bottom:1px solid rgba(183,202,91,.2);
  box-shadow:0 10px 30px rgba(0,0,0,.28),inset 0 -1px rgba(255,255,255,.025);
  backdrop-filter:blur(12px);pointer-events:none;z-index:30;
}
#brand{display:flex;align-items:center;gap:12px;min-width:0}
#brand-logo-wrap{
  width:46px;height:46px;flex:0 0 46px;padding:2px;border-radius:14px;
  background:linear-gradient(145deg,rgba(201,218,104,.34),rgba(93,118,43,.16));
  border:1px solid rgba(202,221,111,.28);box-shadow:0 7px 18px rgba(0,0,0,.28);
  overflow:hidden;
}
#brand-logo{width:100%;height:100%;display:block;border-radius:11px;object-fit:cover}
#farm-title{font-size:20px;font-weight:800;letter-spacing:.025em;color:#f2eadb;line-height:1.15}
#farm-sub{font-size:10px;color:rgba(214,225,173,.48);margin-top:4px;letter-spacing:.12em;text-transform:uppercase}
#top-status{display:flex;align-items:center;gap:9px}
.admin-session-actions{display:flex;align-items:center;gap:7px;pointer-events:auto}
.admin-account-chip{
  height:36px;padding:0 11px;display:flex;align-items:center;gap:6px;border-radius:11px;
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.075);
  color:rgba(235,232,218,.42);font-size:10px;
}
.admin-account-chip strong{max-width:100px;overflow:hidden;text-overflow:ellipsis;color:#e9e3d7;font-size:12px}
#admin-logout-button{
  height:36px;padding:0 12px;border:1px solid rgba(224,151,117,.23);border-radius:11px;
  background:rgba(126,60,40,.14);color:#e9b49b;font-size:11px;font-weight:800;cursor:pointer;
}
#admin-logout-button:hover:not(:disabled){border-color:rgba(235,164,130,.45);background:rgba(142,68,45,.27)}
#admin-logout-button:disabled{cursor:wait;opacity:.55}
.top-view-control{
  display:flex;align-items:center;gap:9px;min-width:0;pointer-events:auto;
  padding:5px 7px 5px 12px;border-radius:12px;
  background:rgba(255,255,255,.045);border:1px solid rgba(196,211,117,.13);
}
.top-view-label{font-size:10px;color:rgba(235,232,218,.45);white-space:nowrap;letter-spacing:.04em}
.top-view-control .view-select-wrap{width:210px}
.nav-chip{
  height:36px;padding:0 12px;display:flex;align-items:center;gap:8px;border-radius:11px;
  background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.085);
  color:rgba(235,232,218,.62);font-size:10px;letter-spacing:.02em;
}
.nav-chip strong{font-size:13px;color:#eee7d9;letter-spacing:.01em}
.system-dot{width:7px;height:7px;border-radius:50%;background:#8bc56b;box-shadow:0 0 0 4px rgba(139,197,107,.1),0 0 12px rgba(139,197,107,.45)}
#system-status-chip[data-connection-state="connecting"] .system-dot{
  background:#e2ad55;box-shadow:0 0 0 4px rgba(226,173,85,.12),0 0 12px rgba(226,173,85,.45);
  animation:backend-connection-pulse 1.15s ease-in-out infinite;
}
#system-status-chip[data-connection-state="connecting"] strong{color:#ebc47e}
#system-status-chip[data-connection-state="offline"] .system-dot{
  background:#df7166;box-shadow:0 0 0 4px rgba(223,113,102,.12),0 0 12px rgba(223,113,102,.4);
}
#system-status-chip[data-connection-state="offline"] strong{color:#ef9a91}
@keyframes backend-connection-pulse{
  0%,100%{opacity:.55;transform:scale(.85)}
  50%{opacity:1;transform:scale(1.15)}
}
.nav-chip-label{color:rgba(235,232,218,.4)}

/* Left sidebar: view controls + sensor dashboard */
#left-sidebar{
  position:absolute;left:18px;top:80px;bottom:20px;width:360px;
  display:flex;flex-direction:column;gap:10px;z-index:18;pointer-events:none;
  transition:transform .28s cubic-bezier(.22,.72,.28,1);will-change:transform;
}
#sensor-dashboard{
  position:relative;width:100%;padding:16px;
  background:linear-gradient(160deg,rgba(15,16,12,.94),rgba(10,10,9,.88));
  border:1px solid rgba(190,205,112,.13);border-radius:18px;
  backdrop-filter:blur(14px);pointer-events:auto;box-shadow:0 16px 36px rgba(0,0,0,.25);
}
#sensor-dashboard{flex:1 1 auto;min-height:0;overflow-y:auto;padding:18px}
#sensor-dashboard::-webkit-scrollbar,#panel-content::-webkit-scrollbar{width:6px}
#sensor-dashboard::-webkit-scrollbar-thumb,#panel-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:99px}
.view-select-wrap{position:relative}
#view-selector{
  width:100%;height:32px;padding:0 32px 0 10px;border-radius:8px;
  appearance:none;border:1px solid rgba(196,211,117,.16);
  background:rgba(9,10,7,.55);color:#eee7d8;font-size:12px;font-weight:700;
  color-scheme:dark;outline:none;cursor:pointer;transition:border-color .18s,background .18s;
}
#view-selector:hover,#view-selector:focus{background:rgba(194,211,112,.1);border-color:rgba(196,211,117,.38)}
#view-selector:disabled{cursor:not-allowed;opacity:.58}
#view-selector option{background:#211f1a;color:#f0e8d8;font-weight:600}
#view-selector option:checked{background:#55652f;color:#fff8e9}
.view-select-arrow{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:#b9c878;font-size:9px;pointer-events:none}

/* Standalone sensor dashboard */
.sensor-board-head{display:flex;justify-content:flex-start;align-items:flex-start;gap:8px;margin-bottom:12px;padding:0 38px 10px 0;border-bottom:.5px solid rgba(255,255,255,.08);transition:opacity .16s ease}
.sensor-board-title{font-size:20px;font-weight:850;color:#f0e5d3;letter-spacing:.02em}
.sensor-reading-time{margin:0 0 10px;color:rgba(239,233,220,.62);font-size:11px;line-height:1.4}
.sensor-mini-status.status-unknown{color:#ccd1c8;background:rgba(255,255,255,.1)}
.sensor-mini-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.sensor-mini-card{
  background:rgba(255,255,255,.058);border:.5px solid rgba(255,255,255,.09);
  border-radius:14px;padding:14px;position:relative;overflow:hidden;
}
.sensor-mini-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent);opacity:.85}
.sensor-mini-name{font-size:10.5px;color:rgba(255,255,255,.5);margin-bottom:6px}
.sensor-mini-val{font-size:25px;font-weight:850;color:#f0e8d8;line-height:1}
.sensor-mini-unit{font-size:10px;color:rgba(255,255,255,.48);margin-left:2px}
.sensor-mini-status{display:inline-block;font-size:9px;margin-top:8px;padding:2px 7px;border-radius:10px;font-weight:800}
.farm-alert{
  position:relative;margin-top:13px;padding:15px 16px 15px 48px;border-radius:14px;
  border:1px solid var(--alert-border);background:var(--alert-bg);overflow:hidden;
}
.farm-alert::before{
  content:'';position:absolute;left:17px;top:19px;width:12px;height:12px;border-radius:50%;
  background:var(--alert-color);box-shadow:0 0 0 6px color-mix(in srgb,var(--alert-color) 14%,transparent),0 0 16px var(--alert-color);
}
.farm-alert-safe{--alert-color:#6fca83;--alert-border:rgba(87,190,111,.28);--alert-bg:rgba(47,133,68,.13)}
.farm-alert-warning{--alert-color:#e3ad55;--alert-border:rgba(227,173,85,.3);--alert-bg:rgba(174,111,27,.15)}
.farm-alert-dangerous{--alert-color:#ed6b61;--alert-border:rgba(237,107,97,.34);--alert-bg:rgba(174,48,43,.18)}
.farm-alert-state{font-size:15px;font-weight:900;color:var(--alert-color);letter-spacing:.055em}
.farm-alert-message{font-size:11px;color:rgba(244,239,227,.7);line-height:1.55;margin-top:4px}
.sensor-trend-list{display:grid;gap:10px;margin-top:11px}
.sensor-trend-card{background:rgba(255,255,255,.042);border:.5px solid rgba(255,255,255,.08);border-radius:11px;padding:10px 11px}
.sensor-trend-title{display:flex;justify-content:space-between;margin-bottom:7px;font-size:10.5px;color:rgba(255,255,255,.5)}
.sensor-trend-title strong{color:#f0e8d8;font-size:11.5px}
.sensor-trend-canvas{width:100%;height:64px;display:block;border-radius:9px;background:rgba(0,0,0,.16)}

/* Right info panel */
#info-panel{
  position:absolute;top:76px;right:18px;bottom:20px;width:clamp(460px,34vw,620px);
  background:linear-gradient(155deg,rgba(17,16,14,.97),rgba(11,11,10,.94));
  border:1px solid rgba(190,205,112,.13);border-radius:18px;display:flex;flex-direction:column;
  backdrop-filter:blur(16px);z-index:20;overflow:hidden;pointer-events:auto;
  box-shadow:0 18px 42px rgba(0,0,0,.3);
  transition:transform .28s cubic-bezier(.22,.72,.28,1);will-change:transform;
}
#panel-header{padding:24px 30px 19px 64px;border-bottom:.5px solid rgba(255,255,255,.08);transition:opacity .16s ease}
.panel-heading-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.panel-heading-row #panel-title{margin-bottom:0}
.panel-heading-row #panel-badge{flex:0 0 auto;margin-bottom:0}
.panel-heading-tools{display:flex;align-items:center;gap:8px;margin-left:auto}
#open-deer-archive-history-button,
#open-zone-movement-history-button{
  min-height:38px;border:1px solid rgba(196,211,117,.24);border-radius:10px;padding:8px 15px;
  background:rgba(104,124,55,.18);color:#dce9a1;font-size:14px;font-weight:800;cursor:pointer;
}
#open-deer-archive-history-button:hover,
#open-zone-movement-history-button:hover{border-color:rgba(196,211,117,.36);background:rgba(104,124,55,.18);color:#e3edb3}
#open-deer-archive-history-button:disabled,
#open-zone-movement-history-button:disabled{cursor:not-allowed;opacity:.42}
#open-deer-archive-history-button[hidden],
#open-zone-movement-history-button[hidden]{display:none}
.panel-header-actions{display:grid;gap:10px;margin-top:14px}
.panel-header-actions:not(:has(.panel-write-actions>button:not([hidden]))){display:none}
.panel-write-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
.panel-write-actions:not(:has(>button:not([hidden]))){display:none}
#add-deer-profile-button,#add-deer-measurement-button,#add-deer-antler-record-button,#open-feeding-records-button{
  width:100%;min-height:39px;border:1px solid rgba(196,211,117,.26);border-radius:10px;padding:7px 10px;
  background:rgba(104,124,55,.28);color:#dce9a1;font-size:12px;font-weight:800;
  cursor:pointer;line-height:1.35;transition:background .18s,border-color .18s;
}
#add-deer-profile-button[hidden],#add-deer-measurement-button[hidden],#add-deer-antler-record-button[hidden],#open-feeding-records-button[hidden]{display:none}
#add-deer-profile-button[data-mode="create"],#add-deer-profile-button[data-mode="unavailable"]{grid-column:1/-1}
#add-deer-profile-button:hover,#add-deer-measurement-button:hover,#add-deer-antler-record-button:hover,#open-feeding-records-button:hover{background:rgba(124,146,67,.42);border-color:rgba(211,225,137,.46)}
#add-deer-profile-button:focus-visible,#add-deer-measurement-button:focus-visible,#add-deer-antler-record-button:focus-visible,#open-feeding-records-button:focus-visible{outline:2px solid #d6e38c;outline-offset:2px}
#add-deer-antler-record-button{background:linear-gradient(135deg,rgba(160,112,39,.48),rgba(104,124,55,.42));border-color:rgba(232,184,95,.42);color:#ffe2a3;box-shadow:0 0 18px rgba(205,145,45,.1)}
#add-deer-antler-record-button:hover{background:linear-gradient(135deg,rgba(186,132,47,.58),rgba(121,143,61,.52));border-color:rgba(245,199,112,.62)}
#open-feeding-records-button{border-color:rgba(112,185,133,.32);background:rgba(52,119,70,.24);color:#bfe2b9}
#open-feeding-records-button:hover{border-color:rgba(135,207,153,.48);background:rgba(64,140,83,.35)}
#panel-badge{
  display:inline-block;font-size:11px;font-weight:600;padding:4px 11px;border-radius:20px;margin-bottom:12px;
  background:rgba(160,120,60,.25);color:#c8a060;border:.5px solid rgba(160,120,60,.35);
}
#panel-title{font-size:28px;font-weight:700;color:#f0e8d8;margin-bottom:6px}
#panel-subtitle{font-size:15px;color:rgba(232,220,200,.58);line-height:1.6}
#panel-content{flex:1;overflow-y:auto;padding:24px 30px 32px;transition:opacity .16s ease}

/* 鹿場總覽：左側直式建模、右側大型資訊儀表板。 */
body.farm-overview-mode #c{
  position:absolute;
  top:76px;
  left:18px;
  width:calc(40vw - 27px)!important;
  height:calc(100vh - 96px)!important;
  border:1px solid rgba(190,205,112,.13);
  border-radius:18px;
  background:#12130f;
  box-shadow:0 18px 42px rgba(0,0,0,.28);
}
body.farm-overview-mode #left-sidebar{
  transform:translateX(calc(-100% - 32px));
  opacity:0;
  visibility:hidden;
  pointer-events:none;
}
body.farm-overview-mode #info-panel{
  top:76px;
  right:18px;
  bottom:20px;
  left:auto;
  width:calc(60vw - 27px);
  height:auto;
}
body.farm-overview-mode #info-panel .panel-collapse-toggle{display:none}
body.farm-overview-mode #panel-header{padding-left:30px}
body.farm-overview-mode #info-panel.is-collapsed #panel-header,
body.farm-overview-mode #info-panel.is-collapsed #panel-content{opacity:1;pointer-events:auto}
body.farm-overview-mode #panel-title{font-size:28px}
body.farm-overview-mode #panel-subtitle{font-size:16px}
body.farm-overview-mode #controls-hint{left:20vw}
body.farm-overview-mode #load-bar{left:20vw}
body.farm-overview-mode #panel-content{padding:22px 26px 30px}
.farm-overview-dashboard{display:grid;gap:20px}
.overview-metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.overview-metric-card{
  --metric-color:#8bc56b;
  min-width:0;padding:17px;border:1px solid rgba(255,255,255,.09);border-radius:13px;
  background:rgba(255,255,255,.045);box-shadow:inset 0 2px var(--metric-color);
}
.overview-metric-card[data-status="warn"]{--metric-color:#dfa650}
.overview-metric-card[data-status="bad"]{--metric-color:#df6f65}
.overview-metric-head{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:11px}
.overview-metric-head span{overflow:hidden;color:rgba(239,233,220,.52);font-size:13px;text-overflow:ellipsis;white-space:nowrap}
.overview-metric-head small{color:var(--metric-color);font-size:11px;font-weight:850}
.overview-metric-card>strong{display:block;color:#f1eadb;font-size:30px;line-height:1;font-variant-numeric:tabular-nums}
.overview-metric-card>strong em{margin-left:3px;color:rgba(239,233,220,.42);font-size:12px;font-style:normal}
.overview-summary-row{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(280px,1fr);gap:12px}
.overview-farm-alert{margin:0;min-height:100%;display:grid;align-content:center}
.overview-farm-alert .farm-alert-state{font-size:18px}
.overview-farm-alert .farm-alert-message{font-size:13px}
.overview-count-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.overview-count-grid>div{display:grid;align-content:center;justify-items:center;gap:5px;padding:12px 8px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.038)}
.overview-count-grid span{color:rgba(239,233,220,.45);font-size:12px}
.overview-count-grid strong{color:#eee6d7;font-size:27px;font-variant-numeric:tabular-nums}
.overview-dashboard-section{padding:17px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(255,255,255,.025)}
.overview-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.overview-section-head small{display:block;margin-bottom:4px;color:#a8b76d;font-size:10px;font-weight:850;letter-spacing:.14em}
.overview-section-head h3{color:#eee5d6;font-size:21px}
.overview-section-head>span{color:rgba(239,233,220,.4);font-size:12px;text-align:right}
.overview-trend-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.overview-trend-card{min-width:0;padding:16px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:rgba(0,0,0,.13)}
.overview-trend-card>div{display:flex;justify-content:space-between;gap:8px;margin-bottom:8px}
.overview-trend-card strong{color:#ddd7ca;font-size:13px}
.overview-trend-card span{overflow:hidden;color:rgba(239,233,220,.36);font-size:11px;text-overflow:ellipsis;white-space:nowrap}
.overview-trend-card canvas{width:100%!important;height:116px!important;border-radius:8px;background:rgba(0,0,0,.12)}
.overview-zone-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.overview-zone-card{
  --zone-accent:#7f9151;
  min-width:0;padding:17px;border:1px solid rgba(255,255,255,.09);border-radius:14px;
  background:linear-gradient(145deg,rgba(255,255,255,.052),rgba(255,255,255,.025));
  color:inherit;font:inherit;text-align:left;cursor:pointer;transition:transform .18s,border-color .18s,background .18s;
  box-shadow:inset 3px 0 var(--zone-accent);
}
.overview-zone-card[data-status="occupied"]{--zone-accent:#7f9d58}
.overview-zone-card[data-status="empty"]{--zone-accent:#6f746a}
.overview-zone-card:hover{transform:translateY(-2px);border-color:rgba(199,216,112,.28);background:linear-gradient(145deg,rgba(121,141,64,.12),rgba(255,255,255,.04))}
.overview-zone-card:focus-visible{outline:2px solid #cbd982;outline-offset:2px}
.overview-zone-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:11px}
.overview-zone-head>strong{overflow:hidden;color:#eee6d7;font-size:17px;text-overflow:ellipsis;white-space:nowrap}
.overview-occupancy-badge{flex:0 0 auto;padding:4px 8px;border:1px solid rgba(255,255,255,.1);border-radius:99px;color:rgba(239,233,220,.5);font-size:11px;font-weight:800}
.overview-occupancy-badge.is-occupied{border-color:rgba(124,177,92,.25);background:rgba(67,129,55,.13);color:#9fcd87}
.overview-zone-presence{display:flex;align-items:center;gap:9px;padding:12px;border:1px solid rgba(255,255,255,.065);border-radius:10px;background:rgba(255,255,255,.028)}
.overview-zone-presence>span{width:9px;height:9px;flex:0 0 9px;border-radius:50%;background:#72766e}
.overview-zone-presence strong{color:rgba(239,233,220,.55);font-size:14px}
.overview-zone-presence.is-occupied{border-color:rgba(124,177,92,.18);background:rgba(67,129,55,.08)}
.overview-zone-presence.is-occupied>span{background:#82bc68;box-shadow:0 0 0 4px rgba(130,188,104,.09)}
.overview-zone-presence.is-occupied strong{color:#b8d5a7}
.overview-zone-open{display:flex;justify-content:flex-end;gap:6px;margin-top:14px;color:#bdcb80;font-size:12px;font-weight:800}

/* Collapsible side panels */
.panel-collapse-toggle{
  position:absolute;top:12px;width:30px;height:30px;padding:0;border-radius:9px;
  display:grid;place-items:center;border:1px solid rgba(199,216,112,.24);
  background:linear-gradient(145deg,rgba(91,108,48,.9),rgba(42,49,27,.94));
  color:#eef2cf;box-shadow:0 7px 18px rgba(0,0,0,.3);cursor:pointer;
  pointer-events:auto;z-index:6;transition:background .18s,border-color .18s,box-shadow .18s;
}
.panel-collapse-toggle:hover{
  background:linear-gradient(145deg,rgba(119,139,63,.96),rgba(55,64,34,.96));
  border-color:rgba(211,226,130,.46);box-shadow:0 8px 22px rgba(0,0,0,.36);
}
.panel-collapse-toggle:focus-visible{outline:2px solid #d6e38c;outline-offset:2px}
.panel-collapse-toggle span{font-size:21px;line-height:1;transform:translateY(-1px);transition:transform .28s ease}
.panel-collapse-toggle-left{right:8px}
.panel-collapse-toggle-right{left:8px}
#left-sidebar.is-collapsed{transform:translateX(calc(-100% + 40px))}
#info-panel.is-collapsed{transform:translateX(calc(100% - 40px))}
#left-sidebar.is-collapsed .panel-collapse-toggle span,
#info-panel.is-collapsed .panel-collapse-toggle span{transform:translateY(-1px) rotate(180deg)}
#left-sidebar.is-collapsed .sensor-board-head,
#left-sidebar.is-collapsed #sensor-dashboard-content,
#info-panel.is-collapsed #panel-header,
#info-panel.is-collapsed #panel-content{opacity:0;pointer-events:none}
#left-sidebar.is-collapsed #sensor-dashboard{pointer-events:none}
body.deer-profile-form-mode #left-sidebar,body.deer-measurement-form-mode #left-sidebar,body.deer-antler-record-form-mode #left-sidebar,body.deer-antler-photo-manager-mode #left-sidebar,body.deer-antler-growth-view-mode #left-sidebar,body.deer-archive-history-mode #left-sidebar{
  transform:translateX(calc(-100% - 24px));pointer-events:none;
}
body.deer-profile-form-mode #info-panel,body.deer-measurement-form-mode #info-panel,body.deer-antler-record-form-mode #info-panel,body.deer-antler-photo-manager-mode #info-panel,body.deer-antler-growth-view-mode #info-panel,body.deer-archive-history-mode #info-panel{
  transform:translateX(calc(100% + 24px));pointer-events:none;
}
#deer-form-zone-preview{
  position:absolute;top:82px;left:22px;z-index:21;min-width:180px;padding:11px 14px;
  display:flex;align-items:center;gap:10px;border:1px solid rgba(200,216,115,.24);
  border-radius:12px;background:rgba(17,19,13,.9);box-shadow:0 10px 28px rgba(0,0,0,.3);
  pointer-events:none;
}
#deer-form-zone-preview[hidden]{display:none}
#deer-form-zone-preview span{font-size:10px;color:rgba(235,232,218,.48);letter-spacing:.08em}
#deer-form-zone-preview strong{font-size:14px;color:#e5edb8}

/* Dedicated deer profile creation page */
#deer-profile-create-page,#deer-measurement-page,#deer-antler-record-page,#deer-antler-photo-page,#deer-antler-growth-page,#deer-archive-history-page{
  position:absolute;top:76px;right:18px;bottom:20px;width:clamp(560px,48vw,820px);
  z-index:22;border:1px solid rgba(197,213,117,.2);border-radius:20px;overflow:hidden;
  background:linear-gradient(155deg,rgba(25,26,21,.98),rgba(14,15,12,.97));
  box-shadow:0 22px 56px rgba(0,0,0,.38);backdrop-filter:blur(16px);pointer-events:auto;
}
#deer-archive-history-page{width:calc(60vw - 27px)}
body.deer-archive-history-zone-mode #deer-archive-history-page{width:clamp(560px,48vw,820px)}
#deer-profile-create-page[hidden],#deer-measurement-page[hidden],#deer-antler-record-page[hidden],#deer-antler-photo-page[hidden],#deer-antler-growth-page[hidden],#deer-archive-history-page[hidden]{display:none}
.deer-profile-create-scroll{height:100%;overflow-y:auto;padding:34px 38px 38px}
.deer-profile-create-scroll::-webkit-scrollbar{width:6px}
.deer-profile-create-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:99px}
.deer-profile-form{padding:0;color-scheme:dark}
.profile-dialog-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:22px}
.profile-dialog-kicker{font-size:10px;font-weight:800;letter-spacing:.16em;color:#b5c66e;margin-bottom:7px}
.profile-dialog-head h2{font-size:25px;color:#f1eadc;margin:0 0 7px}
.profile-dialog-head p{font-size:12px;line-height:1.6;color:rgba(239,232,216,.55)}
.profile-dialog-close{
  width:36px;height:36px;flex:0 0 36px;border-radius:10px;border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.055);color:#e9e1d2;font-size:24px;line-height:1;cursor:pointer;
}
.profile-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.profile-form-field{display:grid;gap:7px}
.profile-form-field[hidden]{display:none}
.profile-form-field-wide{grid-column:1/-1}
.profile-form-field>span{font-size:12px;font-weight:750;color:rgba(239,232,216,.68)}
.profile-form-field input,.profile-form-field select,.profile-form-field textarea{
  width:100%;border:1px solid rgba(255,255,255,.12);border-radius:10px;
  background:#24241f;color:#f0e9dc;padding:10px 11px;font:inherit;font-size:14px;outline:none;
}
.profile-form-field input,.profile-form-field select{height:42px}
.profile-form-field textarea{resize:vertical;min-height:82px;line-height:1.55}
.profile-form-field input:focus,.profile-form-field select:focus,.profile-form-field textarea:focus{
  border-color:rgba(195,214,105,.62);box-shadow:0 0 0 3px rgba(160,185,71,.1);
}
.profile-form-field [aria-invalid="true"]{border-color:#e06f65;box-shadow:0 0 0 3px rgba(224,111,101,.1)}
.profile-form-field option{background:#24241f;color:#f0e9dc}
.profile-form-field :disabled{cursor:not-allowed;opacity:.58}
.profile-form-toggle{display:flex;align-items:flex-start;gap:11px;padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.035);cursor:pointer}
.profile-form-toggle input{width:18px;height:18px;flex:0 0 18px;margin:1px 0 0;accent-color:#8ea54b}
.profile-form-toggle span{display:grid;gap:4px;color:#e9e2d5;font-size:13px}
.profile-form-toggle small{color:rgba(239,232,216,.5);font-size:11px;line-height:1.5}
.profile-form-toggle [aria-invalid="true"]{outline:2px solid #e06f65;outline-offset:2px}
.profile-form-hint{margin-top:14px;padding:10px 12px;border:1px solid rgba(197,215,108,.2);border-radius:9px;background:rgba(197,215,108,.06);color:rgba(231,235,203,.76);font-size:12px;line-height:1.55}
.profile-form-hint[hidden]{display:none}
.profile-form-error{min-height:20px;margin-top:14px;color:#ef847a;font-size:12px;line-height:1.55}
.profile-form-actions{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:8px}
.profile-form-action-group{display:flex;justify-content:flex-end;gap:10px;margin-left:auto}
.profile-form-actions button{border-radius:10px;padding:10px 17px;font-size:13px;font-weight:800;cursor:pointer}
.profile-form-secondary{border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.055);color:#ddd5c7}
.profile-form-primary{border:1px solid rgba(197,215,108,.38);background:#687d39;color:#f5f8df}
.profile-form-danger{border:1px solid rgba(229,103,92,.4);background:rgba(145,45,38,.24);color:#f0958d}
.profile-form-danger:hover{border-color:rgba(238,124,114,.65);background:rgba(169,53,45,.36)}
.profile-form-danger[hidden]{display:none}
.profile-form-primary:disabled,.profile-form-danger:disabled,.profile-form-secondary:disabled{cursor:not-allowed;opacity:.45}
.deer-profile-form.is-archive-mode>.profile-form-grid,
.deer-profile-form.is-archive-mode>#deer-profile-independent-fields-note,
.deer-profile-form.is-archive-mode>#deer-profile-form-error,
.deer-profile-form.is-archive-mode>.profile-form-actions{display:none}
.deer-profile-archive-panel{padding:19px;border:1px solid rgba(229,103,92,.28);border-radius:15px;background:linear-gradient(145deg,rgba(105,39,34,.16),rgba(37,31,25,.72))}
.deer-profile-archive-panel[hidden]{display:none}
.deer-profile-archive-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:12px}
.deer-profile-archive-head h3{margin:0;color:#f1e7d9;font-size:22px}
.deer-profile-archive-warning{margin:0 0 17px;padding:11px 13px;border-radius:10px;background:rgba(217,139,73,.09);color:rgba(246,224,199,.74);font-size:13px;line-height:1.65}
.deer-profile-archive-panel>.profile-form-action-group{margin-top:4px}

/* Archived deer profiles: list 40%, read-only detail 60%. */
.deer-archive-history-shell{height:100%;display:flex;flex-direction:column;padding:30px 32px 32px;color-scheme:dark}
.deer-archive-history-head{flex:0 0 auto;margin-bottom:18px}
.deer-archive-history-layout{min-height:0;flex:1;display:grid;grid-template-columns:minmax(210px,40%) minmax(0,60%);gap:14px}
.deer-archive-list-pane,.deer-archive-detail{min-height:0;border:1px solid rgba(255,255,255,.09);border-radius:14px;background:rgba(255,255,255,.025)}
.deer-archive-list-pane{display:flex;flex-direction:column;overflow:hidden}
.deer-archive-pane-title{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 16px;border-bottom:1px solid rgba(255,255,255,.08)}
.deer-archive-pane-title strong{color:#eee7da;font-size:15px}
.deer-archive-pane-title span{color:rgba(239,232,216,.48);font-size:12px}
.deer-archive-list{min-height:0;overflow-y:auto;padding:8px}
.deer-archive-list-item{width:100%;display:grid;gap:7px;padding:12px;border:1px solid transparent;border-radius:10px;background:transparent;color:rgba(239,232,216,.5);text-align:left;cursor:pointer}
.deer-archive-list-item:hover{background:rgba(255,255,255,.045);color:rgba(239,232,216,.7)}
.deer-archive-list-item.is-selected{border-color:rgba(197,215,108,.3);background:rgba(104,124,55,.18);color:#dce9a1}
.deer-archive-list-main{display:flex;align-items:center;justify-content:space-between;gap:9px}
.deer-archive-list-main strong{color:#eee7da;font-size:16px}
.deer-archive-list-item>span:last-child{font-size:12px}
.deer-archive-status{display:inline-flex;align-items:center;width:max-content;padding:3px 8px;border:1px solid rgba(255,255,255,.13);border-radius:99px;background:rgba(255,255,255,.05);color:#ddd5c7;font-size:11px;font-weight:800}
.deer-archive-status-transferred{border-color:rgba(112,169,203,.34);background:rgba(50,113,148,.16);color:#a9d3e9}
.deer-archive-status-deceased{border-color:rgba(190,153,143,.3);background:rgba(105,72,66,.2);color:#d9bab2}
.deer-archive-status-archived{border-color:rgba(187,171,111,.3);background:rgba(123,103,42,.17);color:#d7c98d}
.deer-zone-direction{display:inline-flex;align-items:center;width:max-content;padding:3px 8px;border:1px solid;border-radius:99px;font-size:11px;font-weight:850}
.deer-zone-direction-in{border-color:rgba(112,191,133,.36);background:rgba(46,128,69,.17);color:#a9ddb4}
.deer-zone-direction-out{border-color:rgba(218,151,79,.38);background:rgba(153,84,31,.17);color:#e5b77e}
.deer-archive-detail{overflow-y:auto;padding:20px}
.deer-archive-detail-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:15px}
.deer-archive-detail-label{color:rgba(239,232,216,.45);font-size:11px}
.deer-archive-detail-head h3{margin:4px 0 0;color:#f2eadc;font-size:26px}
.deer-archive-summary-card{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:15px;border:1px solid rgba(211,178,105,.2);border-radius:12px;background:rgba(132,91,36,.1);margin-bottom:20px}
.deer-archive-summary-card>div,.deer-archive-facts>div{display:grid;gap:5px}
.deer-archive-summary-card span,.deer-archive-facts span{color:rgba(239,232,216,.45);font-size:11px}
.deer-archive-summary-card strong,.deer-archive-facts strong{color:#e9e1d2;font-size:13px;line-height:1.5}
.deer-archive-summary-wide{grid-column:1/-1}
.deer-archive-facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.deer-archive-facts>div{padding:11px 12px;border-radius:10px;background:rgba(255,255,255,.035)}
.deer-archive-section-label{margin-top:20px}
.deer-archive-count-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.deer-archive-count-grid>div{display:grid;gap:4px;padding:11px 7px;border:1px solid rgba(255,255,255,.075);border-radius:10px;background:rgba(255,255,255,.025);text-align:center}
.deer-archive-count-grid strong{color:#dbe6a7;font-size:19px}
.deer-archive-count-grid span{color:rgba(239,232,216,.48);font-size:10px}
.deer-archive-preserved-note{margin:10px 0 0;color:rgba(239,232,216,.46);font-size:11px;line-height:1.55}
.deer-archive-event-list{display:grid;gap:9px}
.deer-archive-event-list article{padding:11px 12px;border:1px solid rgba(255,255,255,.075);border-radius:10px;background:rgba(255,255,255,.025)}
.deer-archive-event-list article>div{display:flex;justify-content:space-between;gap:10px}
.deer-archive-event-list strong{color:#e8e1d4;font-size:12px}
.deer-archive-event-list time{color:rgba(239,232,216,.4);font-size:10px}
.deer-archive-event-list p{margin:6px 0 0;color:rgba(239,232,216,.58);font-size:11px;line-height:1.55}
.deer-archive-empty{padding:24px 14px;color:rgba(239,232,216,.48);font-size:13px;line-height:1.6;text-align:center}
.deer-archive-error{color:#ef847a}
.antler-form-context{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:18px;padding:14px;border:1px solid rgba(226,181,91,.24);border-radius:14px;background:linear-gradient(135deg,rgba(119,77,24,.18),rgba(91,111,47,.13))}
.antler-form-context>div{display:grid;gap:5px;min-width:0}
.antler-form-context span{font-size:10px;color:rgba(244,231,203,.46);letter-spacing:.06em}
.antler-form-context strong{color:#f3dfb1;font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.antler-action-selector{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0 0 18px;padding:0;border:0}
.antler-action-selector legend{grid-column:1/-1;width:100%;margin-bottom:9px;color:rgba(239,232,216,.68);font-size:12px;font-weight:750}
.antler-action-option{display:flex;gap:9px;min-height:78px;padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:12px;background:rgba(255,255,255,.035);cursor:pointer;transition:border-color .18s,background .18s,transform .18s}
.antler-action-option:hover{border-color:rgba(205,219,126,.35);background:rgba(125,145,63,.1)}
.antler-action-option.is-selected{border-color:rgba(220,190,106,.58);background:linear-gradient(145deg,rgba(153,105,35,.2),rgba(112,132,58,.16));transform:translateY(-1px)}
.antler-action-option.is-disabled{cursor:not-allowed;opacity:.38;transform:none}
.antler-action-option input{width:17px;height:17px;flex:0 0 17px;margin:1px 0 0;accent-color:#d4a94e}
.antler-action-option span{display:grid;align-content:start;gap:5px}
.antler-action-option strong{color:#eee5d5;font-size:12px;line-height:1.35}
.antler-action-option small{color:rgba(239,232,216,.46);font-size:10px;line-height:1.5}
.antler-action-option-harvest.is-selected{border-color:rgba(231,165,76,.62);background:rgba(157,90,22,.2)}
.antler-harvest-details-fields{display:grid;gap:16px;padding:16px;border:1px solid rgba(226,181,91,.2);border-radius:14px;background:rgba(133,103,42,.08)}
.antler-harvest-details-fields[hidden]{display:none}
.antler-harvest-details-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}
.antler-harvest-details-head h3{margin:0;color:#eee5d5;font-size:17px}
.antler-harvest-details-head p{margin:5px 0 0;color:rgba(239,232,216,.5);font-size:12px;line-height:1.5}
.antler-harvest-details-head>span{color:rgba(226,181,91,.7);font-size:9px;font-weight:850;letter-spacing:.12em}
.antler-quality-issues{margin:0;padding:0;border:0}
.antler-quality-issues legend{margin-bottom:9px;color:rgba(239,232,216,.68);font-size:12px;font-weight:750}
.antler-quality-issue-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.antler-quality-issue-grid label{display:flex;align-items:center;gap:8px;min-height:42px;padding:9px 11px;border:1px solid rgba(255,255,255,.09);border-radius:9px;background:rgba(255,255,255,.035);color:rgba(239,232,216,.72);font-size:12px;font-weight:700;cursor:pointer}
.antler-quality-issue-grid input{width:16px;height:16px;accent-color:#9bac58}
.antler-harvest-photo-fields{display:grid;gap:13px;padding-top:15px;border-top:1px solid rgba(255,255,255,.09)}
.antler-harvest-photo-fields[hidden]{display:none}
.antler-harvest-photo-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.antler-harvest-photo-head h4{margin:0;color:#eee5d5;font-size:15px}
.antler-harvest-photo-head p{margin:5px 0 0;color:rgba(239,232,216,.5);font-size:11px;line-height:1.5}
.antler-harvest-photo-head>span{flex:0 0 auto;color:rgba(226,181,91,.72);font-size:10px;font-weight:800;white-space:nowrap}
.antler-harvest-photo-picker-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.antler-harvest-photo-picker{min-width:0;padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:rgba(255,255,255,.025)}
.antler-harvest-photo-picker>div:first-child{display:flex;align-items:center;justify-content:space-between;gap:10px}
.antler-harvest-photo-picker strong{color:#eee5d5;font-size:12px}
.antler-harvest-photo-picker>div:first-child span{color:rgba(239,232,216,.52);font-size:10px;font-weight:800}
.antler-harvest-photo-picker>p{margin:5px 0 10px;color:rgba(239,232,216,.45);font-size:10px;line-height:1.45}
.antler-harvest-photo-select{
  min-height:34px;display:grid;place-items:center;padding:7px 10px;border:1px dashed rgba(196,214,108,.3);
  border-radius:9px;background:rgba(196,214,108,.055);color:#cfdda0;font-size:11px;font-weight:800;cursor:pointer;
}
.antler-harvest-photo-select:hover{border-color:rgba(196,214,108,.52);background:rgba(196,214,108,.1)}
.antler-harvest-photo-preview-list{display:grid;gap:7px;margin-top:9px}
.antler-harvest-photo-preview-list:empty{display:none}
.antler-harvest-photo-preview{
  min-width:0;display:grid;grid-template-columns:48px minmax(0,1fr) 28px;align-items:center;gap:8px;
  padding:6px;border:1px solid rgba(255,255,255,.08);border-radius:9px;background:rgba(0,0,0,.13);
}
.antler-harvest-photo-preview img{width:48px;height:40px;display:block;border-radius:6px;object-fit:cover}
.antler-harvest-photo-preview>div{min-width:0;display:grid;gap:3px}
.antler-harvest-photo-preview strong{overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}
.antler-harvest-photo-preview span{color:rgba(239,232,216,.45);font-size:9px}
.antler-harvest-photo-preview button{
  width:28px;height:28px;padding:0;border:1px solid rgba(229,103,92,.28);border-radius:7px;
  background:rgba(145,45,38,.18);color:#ed978f;font-size:16px;cursor:pointer;
}
.antler-harvest-photo-fields.is-disabled{opacity:.58}
.antler-harvest-photo-fields.is-disabled .antler-harvest-photo-select{pointer-events:none}
.profile-created-notice{
  margin-bottom:15px;padding:11px 13px;border-radius:11px;border:1px solid rgba(104,199,125,.3);
  background:rgba(63,145,81,.14);color:#8ed59c;font-size:12px;font-weight:750;line-height:1.55;
}
.profile-storage-warning{border-color:rgba(225,168,77,.32);background:rgba(171,107,24,.14);color:#e4b76e}
.backend-retry-button{
  min-width:160px;height:44px;margin-top:14px;padding:0 20px;border-radius:11px;
  border:1px solid rgba(196,211,117,.34);background:rgba(133,153,69,.22);
  color:#edf1d5;font:700 15px/1 "Segoe UI","Noto Sans TC",system-ui,sans-serif;
  cursor:pointer;transition:background .18s,border-color .18s,transform .18s;
}
.backend-retry-button:hover:not(:disabled){
  background:rgba(148,171,76,.34);border-color:rgba(207,222,130,.54);transform:translateY(-1px);
}
.backend-retry-button:disabled{cursor:wait;opacity:.62}
.backend-connection-toast{
  position:fixed;top:76px;left:50%;z-index:90;max-width:min(520px,calc(100vw - 32px));
  padding:12px 18px;border-radius:12px;transform:translate(-50%,-10px);
  border:1px solid rgba(164,194,105,.38);background:rgba(28,38,20,.96);
  box-shadow:0 12px 30px rgba(0,0,0,.32);color:#e8f0d1;font-size:14px;font-weight:700;
  opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;
}
.backend-connection-toast.is-visible{opacity:1;transform:translate(-50%,0)}
.profile-notes{margin-top:14px}
.measurement-history-list{display:grid;gap:9px}
.measurement-history-item{padding:11px 12px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.035)}
.measurement-history-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:5px;color:#e7e1d5;font-size:12px;font-weight:750}
.measurement-history-values{color:rgba(239,232,216,.7);font-size:12px;line-height:1.55}
.measurement-history-notes{margin-top:5px;color:rgba(239,232,216,.48);font-size:11px;line-height:1.5}
.antler-history-list{display:grid;gap:9px}
.antler-history-item{position:relative;padding:11px 12px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.035)}
.antler-history-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:5px;color:#e7e1d5;font-size:12px;font-weight:750}
.antler-history-cycle{color:rgba(239,232,216,.7);font-size:12px;line-height:1.55}
.antler-history-notes{margin-top:5px;color:rgba(239,232,216,.48);font-size:11px;line-height:1.5}
.antler-harvest-badge{display:inline-flex;margin-left:7px;padding:2px 7px;border:1px solid rgba(231,169,77,.35);border-radius:99px;background:rgba(179,111,25,.16);color:#e6b66d;font-size:10px;font-weight:800}
.antler-history-source{margin-left:8px;color:rgba(239,232,216,.34);font-size:10px}
.antler-event-badge{padding:2px 7px;border:1px solid rgba(255,255,255,.12);border-radius:99px;color:rgba(240,235,220,.64);font-size:9px;letter-spacing:.04em}
.antler-event-phase_change{border-color:rgba(155,194,95,.32);background:rgba(91,129,43,.14);color:#bad679}
.antler-event-observation{border-color:rgba(103,169,190,.3);background:rgba(39,111,134,.13);color:#8fcbd9}
.antler-event-harvest{border-color:rgba(231,169,77,.38);background:rgba(179,111,25,.16);color:#e8b96f}
.antler-growth-timeline{position:relative;padding-left:16px}
.antler-growth-timeline::before{content:'';position:absolute;top:10px;bottom:10px;left:4px;width:1px;background:linear-gradient(#d5ad5b,rgba(155,177,83,.18))}
.antler-growth-timeline .antler-history-item::before{content:'';position:absolute;left:-16px;top:18px;width:7px;height:7px;border:2px solid #d1aa57;border-radius:50%;background:#1a1915;box-shadow:0 0 0 3px rgba(209,170,87,.1)}
.antler-growth-core{position:relative;margin-bottom:22px;padding:18px;border:1px solid rgba(221,181,91,.36);border-radius:16px;overflow:hidden;background:radial-gradient(circle at 90% 0,rgba(184,125,31,.2),transparent 42%),linear-gradient(145deg,rgba(61,57,35,.88),rgba(25,29,20,.94));box-shadow:0 12px 30px rgba(0,0,0,.2),inset 0 1px rgba(255,244,207,.04)}
.antler-growth-core::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#d5a64c,#9aaf55 65%,transparent)}
.antler-core-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:15px}
.antler-core-head{flex-wrap:wrap}
.antler-core-head>div{flex:1 1 220px;min-width:0}
.antler-core-kicker{margin-bottom:4px;color:#d6ad5a;font-size:9px;font-weight:850;letter-spacing:.17em}
.antler-core-head h3,.antler-growth-core>h3{margin:0;color:#fff0cd;font-size:19px}
.antler-growth-core>p{margin:9px 0 0;color:rgba(244,233,208,.62);font-size:12px;line-height:1.6}
.antler-progress-status{display:inline-flex;align-items:center;min-height:26px;padding:4px 9px;border:1px solid rgba(137,188,93,.32);border-radius:99px;background:rgba(75,132,49,.18);color:#b7df8b;font-size:10px;font-weight:850;white-space:nowrap}
.antler-growth-core[data-status="REVIEW_DUE"]{border-color:rgba(231,174,73,.52);background:radial-gradient(circle at 90% 0,rgba(215,143,29,.25),transparent 42%),linear-gradient(145deg,rgba(67,54,29,.9),rgba(29,28,19,.95))}
.antler-growth-core[data-status="REVIEW_DUE"] .antler-progress-status{border-color:rgba(235,177,76,.45);background:rgba(185,112,23,.19);color:#f1c270}
.antler-growth-core[data-status="OVERDUE"]{border-color:rgba(226,104,78,.58);background:radial-gradient(circle at 90% 0,rgba(190,62,37,.28),transparent 45%),linear-gradient(145deg,rgba(67,41,28,.92),rgba(31,24,19,.96))}
.antler-growth-core[data-status="OVERDUE"]::before{background:linear-gradient(90deg,#e66e54,#d29a43,transparent)}
.antler-growth-core[data-status="OVERDUE"] .antler-progress-status{border-color:rgba(235,116,91,.46);background:rgba(175,54,34,.2);color:#f29a86}
.antler-growth-core[data-status="COMPLETED"] .antler-progress-status{border-color:rgba(226,177,77,.45);background:rgba(173,111,26,.2);color:#ebbe6e}
.antler-growth-core-unavailable{border-color:rgba(223,141,77,.3)}
.antler-stage-hero{display:grid;grid-template-columns:minmax(120px,.8fr) 1.8fr;gap:14px;padding:13px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(0,0,0,.14)}
.antler-stage-hero>div:first-child{display:grid;align-content:center;gap:4px}
.antler-stage-hero span,.antler-stage-metrics span{color:rgba(247,234,207,.42);font-size:9px;letter-spacing:.04em}
.antler-stage-hero>div:first-child strong{color:#f8d992;font-size:24px;line-height:1.15}
.antler-stage-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.antler-stage-metrics>div{display:grid;align-content:center;gap:4px;padding-left:9px;border-left:1px solid rgba(255,255,255,.08)}
.antler-stage-metrics strong{color:#eee5d4;font-size:12px;line-height:1.3}
.antler-stage-flow{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin:16px 0 13px}
.antler-stage-flow::before{content:'';position:absolute;top:12px;left:12%;right:12%;height:1px;background:rgba(255,255,255,.13)}
.antler-stage-step{position:relative;z-index:1;display:grid;justify-items:center;gap:6px;color:rgba(242,232,212,.35);font-size:10px}
.antler-stage-node{display:grid;place-items:center;width:25px;height:25px;border:1px solid rgba(255,255,255,.14);border-radius:50%;background:#292820;color:rgba(242,232,212,.38);font-size:9px;font-weight:850}
.antler-stage-step.is-complete{color:#a9c66b}
.antler-stage-step.is-complete .antler-stage-node{border-color:rgba(154,190,85,.46);background:#516529;color:#e5f3ba}
.antler-stage-step.is-current{color:#f0c56e}
.antler-stage-step.is-current .antler-stage-node{border-color:#d4a64b;background:#a36926;color:#fff0ca;box-shadow:0 0 0 4px rgba(212,166,75,.12)}
.antler-estimate-row{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:11px;color:rgba(241,232,211,.48);font-size:9px;line-height:1.45;text-align:center}
.antler-estimate-row span{padding:7px 5px;border-radius:7px;background:rgba(255,255,255,.035)}
.antler-estimate-row small{display:block;margin-bottom:3px;color:rgba(237,193,101,.72);font-size:8px;font-weight:800;letter-spacing:.04em}
.antler-progress-message{padding:9px 10px;border-left:2px solid rgba(204,174,91,.65);background:rgba(0,0,0,.12);color:rgba(244,233,209,.68);font-size:11px;line-height:1.6}
.antler-core-actions{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
.antler-core-actions button{min-height:34px;padding:7px 10px;border:1px solid rgba(255,255,255,.13);border-radius:9px;background:rgba(255,255,255,.055);color:#ddd5c6;font-size:10px;font-weight:800;cursor:pointer}
.antler-core-actions button:hover{border-color:rgba(216,190,116,.4);background:rgba(255,255,255,.09)}
.antler-core-actions .antler-action-primary{border-color:rgba(165,200,91,.36);background:rgba(97,128,45,.28);color:#dceca8}
.antler-core-actions .antler-action-harvest{border-color:rgba(229,162,72,.42);background:rgba(156,88,21,.22);color:#edbb71}
.antler-detail-nav{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.antler-detail-nav button{display:flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(255,255,255,.045);color:#ded5c5;font-size:10px;font-weight:800;cursor:pointer}
.antler-detail-nav button:hover{border-color:rgba(216,189,115,.38);background:rgba(255,255,255,.08)}
.antler-detail-nav>span{color:rgba(235,218,184,.36);font-size:9px;font-weight:800;letter-spacing:.1em}
.antler-timeline-section{padding:17px;border:1px solid rgba(255,255,255,.08);border-radius:15px;background:rgba(255,255,255,.025)}
.antler-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:14px}
.antler-growth-page-shell{max-width:none}
#deer-antler-growth-page .profile-dialog-head{margin-bottom:26px}
#deer-antler-growth-page .profile-dialog-head h2{font-size:28px}
#deer-antler-growth-page .profile-dialog-head p{font-size:14px}
#deer-antler-growth-page .antler-growth-core{padding:24px;margin-bottom:24px}
#deer-antler-growth-page .antler-core-kicker{font-size:11px}
#deer-antler-growth-page .antler-core-head h3,
#deer-antler-growth-page .antler-growth-core>h3{font-size:23px}
#deer-antler-growth-page .antler-growth-core>p{font-size:14px}
#deer-antler-growth-page .antler-progress-status{min-height:31px;padding:5px 11px;font-size:12px}
#deer-antler-growth-page .antler-stage-hero{grid-template-columns:minmax(145px,.8fr) 1.8fr;padding:17px}
#deer-antler-growth-page .antler-stage-hero span,
#deer-antler-growth-page .antler-stage-metrics span{font-size:11px}
#deer-antler-growth-page .antler-stage-hero>div:first-child strong{font-size:31px}
#deer-antler-growth-page .antler-stage-metrics strong{font-size:15px}
#deer-antler-growth-page .antler-stage-step{gap:8px;font-size:13px}
#deer-antler-growth-page .antler-stage-node{width:31px;height:31px;font-size:11px}
#deer-antler-growth-page .antler-stage-flow::before{top:15px}
#deer-antler-growth-page .antler-estimate-row{gap:9px;margin-bottom:14px;font-size:12px}
#deer-antler-growth-page .antler-estimate-row span{padding:10px 7px}
#deer-antler-growth-page .antler-estimate-row small{font-size:10px}
#deer-antler-growth-page .antler-progress-message{padding:12px 13px;font-size:14px}
#deer-antler-growth-page .antler-core-actions{gap:10px;margin-top:17px}
#deer-antler-growth-page .antler-core-actions button{min-height:42px;padding:9px 14px;font-size:13px}
#deer-antler-growth-page .antler-timeline-section{padding:22px}
#deer-antler-growth-page .antler-section-head{margin-bottom:18px}
#deer-antler-growth-page .antler-section-head h3{font-size:22px}
#deer-antler-growth-page .antler-section-head>span{font-size:12px}
#deer-antler-growth-page .antler-history-list{gap:12px}
#deer-antler-growth-page .antler-history-item{padding:15px 16px}
#deer-antler-growth-page .antler-history-head{font-size:14px}
#deer-antler-growth-page .antler-history-cycle{font-size:14px}
#deer-antler-growth-page .antler-history-notes{font-size:13px}
#deer-antler-growth-page .antler-history-source{font-size:11px}
#deer-antler-growth-page .antler-event-badge,
#deer-antler-growth-page .antler-harvest-badge{font-size:11px}
#deer-antler-growth-page .antler-empty-state{padding:18px;font-size:14px}

/* 鹿茸週期實際變更日期。 */
.antler-stage-date{
  display:block;
  min-height:16px;
  color:rgba(242,232,212,.32);
  font-size:10px;
  font-weight:600;
  line-height:1.35;
  white-space:nowrap;
}
#deer-antler-growth-page .antler-stage-date{font-size:11px;font-variant-numeric:tabular-nums}
#deer-antler-growth-page .antler-stage-step.is-complete .antler-stage-date{color:#a9c66b}
#deer-antler-growth-page .antler-stage-step.is-current .antler-stage-date{color:#e4bc6b}
.antler-section-head h3{margin:0;color:#eee4d1;font-size:16px}
.antler-section-head>span{padding:4px 7px;border-radius:99px;background:rgba(255,255,255,.05);color:rgba(239,232,216,.42);font-size:9px}
.antler-empty-state{padding:14px;border:1px dashed rgba(255,255,255,.1);border-radius:10px;color:rgba(239,232,216,.42);font-size:11px;text-align:center}

/* Antler record photo summaries and dedicated photo manager. */
.antler-record-photo-summary{
  display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:12px;padding-top:12px;
  border-top:1px solid rgba(255,255,255,.08);
}
.antler-record-photo-overview{min-width:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.antler-record-photo-thumbs{display:flex;align-items:center;gap:7px;min-width:72px;flex-wrap:wrap}
.antler-record-photo-thumb,.antler-record-photo-more{
  width:52px;height:44px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.14);
  border-radius:9px;background:#303129;color:#ded6c5;font-size:9px;font-weight:800;
}
.antler-record-photo-thumb{
  position:relative;padding:0;appearance:none;cursor:zoom-in;transition:border-color .16s ease,transform .16s ease;
}
.antler-record-photo-thumb:hover{border-color:#c9dc7c;transform:translateY(-1px)}
.antler-record-photo-thumb:focus-visible{outline:2px solid #d1e48b;outline-offset:2px}
.antler-record-photo-thumb img{width:100%;height:100%;object-fit:cover}
.antler-record-photo-thumb>span{
  position:absolute;right:3px;bottom:3px;left:3px;overflow:hidden;padding:2px 4px;border-radius:4px;
  background:rgba(8,9,7,.72);color:#fff;font-size:8px;line-height:1.2;text-align:center;text-overflow:ellipsis;white-space:nowrap;
}
.antler-record-photo-summary.is-harvest{align-items:flex-end}
.antler-record-photo-summary.is-harvest .antler-record-photo-thumb,
.antler-record-photo-summary.is-harvest .antler-record-photo-more{width:86px;height:64px}
.antler-record-photo-empty{color:rgba(239,232,216,.42);font-size:11px;white-space:nowrap}
.antler-record-photo-count{color:rgba(239,232,216,.5);font-size:11px;white-space:nowrap}
.antler-record-photo-manage{
  min-height:34px;padding:7px 11px;border:1px solid rgba(187,207,99,.3);border-radius:9px;
  background:rgba(111,132,54,.2);color:#dce9a7;font-size:11px;font-weight:800;cursor:pointer;
}
.antler-record-photo-manage:hover{border-color:rgba(203,222,115,.55);background:rgba(111,132,54,.3)}
[data-protected-image-frame]{position:relative}
[data-protected-image-frame] img[data-protected-image-url]{opacity:0;transition:opacity .18s ease}
[data-protected-image-frame].is-image-loaded img[data-protected-image-url]{opacity:1}
[data-protected-image-frame].is-image-loading::after,
[data-protected-image-frame].is-image-error::after{
  position:absolute;inset:0;z-index:2;display:grid;place-items:center;pointer-events:none;
}
[data-protected-image-frame].is-image-loading::after{
  content:"";width:18px;height:18px;inset:50% auto auto 50%;margin:-9px 0 0 -9px;
  border:2px solid rgba(217,228,168,.24);border-top-color:#cbdc86;border-radius:50%;
  animation:protected-image-spin .75s linear infinite;
}
[data-protected-image-frame].is-image-error::after{
  content:"照片載入失敗";padding:6px;color:#e89a91;font-size:10px;font-weight:800;text-align:center;
}
.antler-record-photo-thumb.is-image-error::after{content:"!";padding:0;font-size:15px}
@keyframes protected-image-spin{to{transform:rotate(360deg)}}
.antler-photo-page-scroll{padding-bottom:42px}
.antler-photo-page-shell{max-width:850px}
.antler-photo-record-context{
  display:grid;grid-template-columns:.75fr .75fr 1.5fr;gap:1px;margin-bottom:18px;overflow:hidden;
  border:1px solid rgba(196,214,108,.18);border-radius:13px;background:rgba(196,214,108,.08);
}
.antler-photo-record-context>div{display:grid;gap:5px;padding:13px 15px;background:rgba(17,18,14,.54)}
.antler-photo-record-context span{color:rgba(239,232,216,.46);font-size:11px}
.antler-photo-record-context strong{color:#eee7da;font-size:14px}
.antler-photo-manager-notice{
  margin-bottom:14px;padding:10px 12px;border:1px solid rgba(152,190,85,.26);border-radius:10px;
  background:rgba(89,124,39,.16);color:#dbe9a8;font-size:13px;
}
.antler-photo-manager-notice[hidden]{display:none}
.antler-photo-manager-error:empty{min-height:0;margin:0}
.antler-photo-manager-error:not(:empty){margin:0 0 14px;padding:10px 12px;border-radius:10px;background:rgba(172,56,48,.12)}
.antler-photo-groups{display:grid;gap:18px}
.antler-photo-group{padding:18px;border:1px solid rgba(255,255,255,.09);border-radius:15px;background:rgba(255,255,255,.025)}
.antler-photo-group-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:14px}
.antler-photo-group-head h3{margin:0 0 5px;color:#eee7da;font-size:18px}
.antler-photo-group-head p{margin:0;color:rgba(239,232,216,.48);font-size:12px;line-height:1.55}
.antler-photo-group-head>span{flex:0 0 auto;padding:4px 9px;border-radius:99px;background:rgba(255,255,255,.06);color:#d9d2c5;font-size:11px;font-weight:800;white-space:nowrap}
.antler-photo-slot-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.antler-photo-slot{min-width:0;aspect-ratio:4/3;border-radius:12px;overflow:hidden}
.antler-photo-slot-empty{
  display:grid;place-content:center;gap:5px;border:1px dashed rgba(196,214,108,.27);background:rgba(196,214,108,.045);
  color:rgba(231,235,203,.6);text-align:center;cursor:pointer;
}
.antler-photo-slot-empty:hover{border-color:rgba(196,214,108,.55);background:rgba(196,214,108,.09)}
.antler-photo-slot-empty>span{font-size:24px;line-height:1}
.antler-photo-slot-empty strong{font-size:12px}
.antler-photo-slot-empty small{font-size:9px;font-weight:600}
.antler-photo-slot-filled{position:relative;border:1px solid rgba(255,255,255,.1);background:#161713}
.antler-photo-thumbnail-button{width:100%;height:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
.antler-photo-thumbnail-button img{width:100%;height:100%;display:block;object-fit:cover}
.antler-photo-slot-meta{
  position:absolute;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:8px;background:linear-gradient(transparent,rgba(7,8,6,.9));pointer-events:none;
}
.antler-photo-slot-meta span{overflow:hidden;color:#f4eee2;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.antler-photo-slot-meta button{
  padding:4px 7px;border:1px solid rgba(244,140,130,.35);border-radius:7px;background:rgba(116,32,27,.7);
  color:#f4aaa2;font-size:9px;font-weight:800;cursor:pointer;pointer-events:auto;
}
.antler-photo-upload-dialog{
  width:min(700px,100%);padding:20px;border:1px solid rgba(255,255,255,.12);border-radius:16px;
  background:#20211c;box-shadow:0 24px 70px rgba(0,0,0,.48);
}
.antler-photo-upload-dialog-head{
  display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px;
}
.antler-photo-upload-dialog-head>div{min-width:0}
.antler-photo-upload-dialog-head span{color:#b8c976;font-size:10px;font-weight:850;letter-spacing:.1em}
.antler-photo-upload-dialog-head h3{margin:5px 0 3px;color:#f0e9dc;font-size:21px}
.antler-photo-upload-dialog-head p{margin:0;color:rgba(239,232,216,.52);font-size:12px}
.antler-photo-upload-dialog-body{
  display:grid;grid-template-columns:minmax(240px,1.1fr) minmax(220px,.9fr);gap:20px;align-items:center;
}
.antler-photo-upload-preview{aspect-ratio:4/3;overflow:hidden;border-radius:11px;background:#151611}
.antler-photo-upload-preview img{width:100%;height:100%;display:block;object-fit:contain}
.antler-photo-upload-details{display:flex;flex-direction:column;justify-content:center;min-width:0}
.antler-photo-upload-details>span{color:#b6c874;font-size:10px;font-weight:850;letter-spacing:.1em}
.antler-photo-upload-details strong{margin:5px 0 8px;color:#eee7da;font-size:20px}
.antler-photo-upload-details p{margin:0 0 12px;color:rgba(239,232,216,.52);font-size:12px;overflow-wrap:anywhere}
.antler-photo-upload-details small{color:rgba(239,232,216,.46);font-size:11px;line-height:1.6}
.antler-photo-upload-error:empty{min-height:0;margin:0}
.antler-photo-upload-error:not(:empty){
  margin:14px 0 0;padding:9px 11px;border-radius:9px;background:rgba(172,56,48,.12);
}
.antler-photo-upload-actions{
  display:flex;justify-content:flex-end;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);
}
.antler-photo-upload-actions button{min-width:96px}
#cancel-antler-photo-upload,
#confirm-antler-photo-upload{border-radius:10px}
.antler-photo-overlay{
  position:absolute;inset:0;z-index:5;display:grid;place-items:center;padding:24px;background:rgba(7,8,6,.76);
}
.antler-photo-overlay[hidden]{display:none}
.antler-photo-preview-dialog,.antler-photo-delete-dialog{
  width:min(620px,100%);padding:20px;border:1px solid rgba(255,255,255,.12);border-radius:16px;
  background:#20211c;box-shadow:0 24px 70px rgba(0,0,0,.48);
}
.antler-photo-preview-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:15px}
.antler-photo-preview-head span,.antler-photo-delete-dialog>span{color:#b8c976;font-size:10px;font-weight:850;letter-spacing:.1em}
.antler-photo-preview-head h3,.antler-photo-delete-dialog h3{margin:5px 0 0;color:#f0e9dc;font-size:21px}
.antler-photo-preview-canvas{height:min(52vh,520px);display:grid;place-items:center;overflow:hidden;border-radius:12px;background:#11120f}
.antler-photo-preview-canvas img{max-width:100%;max-height:100%;object-fit:contain}
.antler-photo-preview-dialog>p,.antler-photo-delete-dialog p{margin:12px 0 0;color:rgba(239,232,216,.52);font-size:12px}
.antler-photo-delete-dialog{width:min(460px,100%)}
.antler-photo-delete-dialog p{margin-bottom:18px;line-height:1.65}
#deer-antler-photo-page.is-busy{cursor:wait}

/* Shared antler photo lightbox. */
body.antler-photo-viewer-open{overflow:hidden}
.antler-photo-viewer{
  position:fixed;inset:0;z-index:1200;display:grid;place-items:center;padding:24px;
  background:rgba(5,7,5,.82);backdrop-filter:blur(4px);
}
.antler-photo-viewer[hidden]{display:none}
.antler-photo-viewer-dialog{
  width:min(1040px,100%);height:min(760px,calc(100dvh - 48px));max-height:calc(100dvh - 48px);
  display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;overflow:hidden;
  border:1px solid rgba(255,255,255,.14);border-radius:18px;background:#1c1f1a;
  box-shadow:0 30px 90px rgba(0,0,0,.56);
}
.antler-photo-viewer-header{
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:18px 20px;
  border-bottom:1px solid rgba(255,255,255,.09);
}
.antler-photo-viewer-header>div{min-width:0}
.antler-photo-viewer-header span{color:#bdd172;font-size:11px;font-weight:850;letter-spacing:.08em}
.antler-photo-viewer-header h2{margin:4px 0 2px;color:#f2ecdf;font-size:22px}
.antler-photo-viewer-header p{margin:0;color:rgba(239,232,216,.55);font-size:12px}
.antler-photo-viewer-close{
  flex:0 0 auto;width:40px;height:40px;border:1px solid rgba(255,255,255,.13);border-radius:10px;
  background:rgba(255,255,255,.05);color:#eee7da;font-size:25px;line-height:1;cursor:pointer;
}
.antler-photo-viewer-close:hover{background:rgba(255,255,255,.1)}
.antler-photo-viewer-stage{
  min-width:0;min-height:0;display:grid;grid-template-columns:48px minmax(0,1fr) 48px;
  align-items:center;gap:12px;overflow:hidden;padding:18px 20px;background:#0e110d;
}
.antler-photo-viewer-image-frame{
  position:relative;width:100%;height:100%;min-height:0;overflow:hidden;border-radius:12px;background:#090b09;
}
.antler-photo-viewer-image-frame img{
  position:absolute;inset:0;width:100%;height:100%;max-width:none;max-height:none;display:block;
  object-fit:contain;object-position:center;
}
.antler-photo-viewer-nav{
  width:44px;height:52px;border:1px solid rgba(255,255,255,.12);border-radius:11px;
  background:rgba(255,255,255,.06);color:#f1ebdf;font-size:32px;line-height:1;cursor:pointer;
}
.antler-photo-viewer-nav:hover:not(:disabled){border-color:rgba(205,224,125,.55);background:rgba(174,199,85,.14)}
.antler-photo-viewer-nav:disabled{opacity:.28;cursor:not-allowed}
.antler-photo-viewer-close:focus-visible,
.antler-photo-viewer-nav:focus-visible,
.antler-photo-viewer-filmstrip-item:focus-visible{outline:2px solid #d1e48b;outline-offset:2px}
.antler-photo-viewer-info{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;margin:0 20px;
  overflow:hidden;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.08);
}
.antler-photo-viewer-info>div{min-width:0;display:grid;gap:4px;padding:10px 12px;background:#20231e}
.antler-photo-viewer-info span{color:rgba(239,232,216,.48);font-size:10px}
.antler-photo-viewer-info strong{overflow:hidden;color:#eee8dc;font-size:13px;text-overflow:ellipsis;white-space:nowrap}
.antler-photo-viewer-footer{min-height:0;padding:10px 20px 12px}
.antler-photo-viewer-footer>span{display:block;margin-bottom:7px;color:rgba(239,232,216,.54);font-size:11px}
.antler-photo-viewer-filmstrip{display:flex;gap:9px;overflow-x:auto;padding:2px 2px 7px}
.antler-photo-viewer-filmstrip-item{
  position:relative;flex:0 0 80px;height:56px;overflow:hidden;padding:0;border:2px solid transparent;border-radius:9px;
  background:#292c26;cursor:pointer;opacity:.62;
}
.antler-photo-viewer-filmstrip-item:hover{opacity:.86}
.antler-photo-viewer-filmstrip-item.is-active{border-color:#c7db78;opacity:1}
.antler-photo-viewer-filmstrip-item img{width:100%;height:100%;display:block;object-fit:cover}
.antler-photo-viewer-filmstrip-item span{
  position:absolute;right:3px;bottom:3px;left:3px;overflow:hidden;padding:2px 4px;border-radius:4px;
  background:rgba(6,8,6,.72);color:#fff;font-size:8px;text-overflow:ellipsis;white-space:nowrap;
}
.section-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:rgba(255,255,255,.35);margin:18px 0 10px}
.section-label:first-child{margin-top:0}
.info-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:15px 0;border-bottom:.5px solid rgba(255,255,255,.06);font-size:16px;
}
.info-row-label{color:rgba(255,255,255,.48)}
.info-row-value{color:#f0e8d8;font-weight:800;text-align:right;font-size:18px}
.desc-box{
  margin-top:10px;padding:14px;border-radius:12px;background:rgba(255,255,255,.045);
  border:.5px solid rgba(255,255,255,.08);color:rgba(255,255,255,.68);font-size:15px;line-height:1.85;
}

/* Sensor cards */
.sensor-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:8px}
.sensor-card{
  background:rgba(255,255,255,.045);border:.5px solid rgba(255,255,255,.08);
  border-radius:12px;padding:13px 14px;position:relative;overflow:hidden;
}
.sensor-card::before{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:var(--accent);opacity:.75}
.sensor-name{font-size:11px;color:rgba(255,255,255,.42);margin-bottom:7px;letter-spacing:.05em}
.sensor-val{font-size:24px;font-weight:800;color:#f0e8d8;line-height:1}
.sensor-unit{font-size:12px;color:rgba(255,255,255,.42);margin-left:2px}
.sensor-status{display:inline-block;font-size:10px;margin-top:8px;padding:2px 8px;border-radius:10px;font-weight:600}
.status-ok{background:rgba(40,160,80,.2);color:#60d090;border:.5px solid rgba(40,160,80,.3)}
.status-warn{background:rgba(220,140,20,.2);color:#e0a040;border:.5px solid rgba(220,140,20,.3)}
.status-bad{background:rgba(220,60,60,.2);color:#e07070;border:.5px solid rgba(220,60,60,.3)}


/* Trend chart */
.trend-wrap{
  margin-top:12px;
  display:grid;
  gap:12px;
}
.trend-card{
  background:rgba(255,255,255,.04);
  border:.5px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:14px 16px;
}
.trend-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  margin-bottom:8px;
  font-size:12px;
  color:rgba(255,255,255,.52);
}
.trend-head strong{
  color:#f0e8d8;
  font-size:13px;
}
.trend-canvas{
  width:100%;
  height:72px;
  display:block;
  border-radius:8px;
  background:rgba(0,0,0,.18);
}
.deer-profile-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.profile-card{
  background:rgba(255,255,255,.045);
  border:.5px solid rgba(255,255,255,.08);
  border-radius:12px;
  padding:14px 16px;
}
.profile-label{
  font-size:11px;
  color:rgba(255,255,255,.42);
  margin-bottom:6px;
}
.profile-value{
  color:#f0e8d8;
  font-size:20px;
  font-weight:800;
}
.profile-note{
  font-size:11px;
  color:rgba(255,255,255,.45);
  margin-top:5px;
  line-height:1.45;
}
.deer-profile-sections{display:grid;gap:12px}
.deer-profile-section,
.deer-profile-notes-section{
  overflow:hidden;border:1px solid rgba(255,255,255,.09);border-radius:14px;
  background:rgba(255,255,255,.03);
}
.deer-profile-section-head{
  min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:14px;
  padding:13px 15px;border-bottom:1px solid rgba(255,255,255,.075);
}
.deer-profile-section-head>div:first-child{min-width:0}
.deer-profile-section-head span{
  display:block;margin-bottom:3px;color:rgba(199,215,117,.58);font-size:9px;
  font-weight:850;letter-spacing:.1em;
}
.deer-profile-section-head h3{margin:0;color:#efe8db;font-size:16px;line-height:1.3}
.deer-profile-section-edit,
.deer-profile-section-actions button{
  min-height:32px;padding:6px 11px;border:1px solid rgba(196,214,108,.28);border-radius:9px;
  background:rgba(111,132,54,.16);color:#dce9a7;font-size:11px;font-weight:800;cursor:pointer;
}
.deer-profile-section-edit:hover,
.deer-profile-section-actions button:hover{
  border-color:rgba(203,222,115,.52);background:rgba(111,132,54,.27);
}
.deer-profile-section-edit:focus-visible,
.deer-profile-section-actions button:focus-visible{outline:2px solid #d1e48b;outline-offset:2px}
.deer-profile-info-grid,
.deer-profile-summary-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin:0;padding:0;
}
.deer-profile-summary-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.deer-profile-info-item{min-width:0;padding:12px 15px;border-top:1px solid rgba(255,255,255,.065)}
.deer-profile-info-item:nth-child(-n+2){border-top:0}
.deer-profile-info-item:nth-child(even){border-left:1px solid rgba(255,255,255,.065)}
.deer-profile-summary-grid .deer-profile-info-item{border-top:0;border-left:1px solid rgba(255,255,255,.065)}
.deer-profile-summary-grid .deer-profile-info-item:first-child{border-left:0}
.deer-profile-info-item dt{margin:0 0 5px;color:rgba(239,232,216,.48);font-size:11px}
.deer-profile-info-item dd{
  margin:0;overflow-wrap:anywhere;color:#f0e8d8;font-size:17px;font-weight:800;line-height:1.35;
}
.deer-profile-info-item small{display:block;margin-top:4px;color:rgba(239,232,216,.44);font-size:10px;line-height:1.45}
.deer-profile-summary-head{align-items:flex-start}
.deer-profile-section-actions{display:flex;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.deer-profile-notes-section{margin-top:12px}
.deer-profile-notes-content{
  min-height:54px;padding:13px 15px;color:rgba(239,232,216,.72);font-size:13px;line-height:1.65;
  white-space:pre-wrap;overflow-wrap:anywhere;
}
.deer-profile-notes-content.is-empty{color:rgba(239,232,216,.38)}
/* Deer tabs and records */
.deer-tabs{
  display:flex;
  gap:8px;
  margin-bottom:14px;
}
.deer-tab{
  flex:1;
  border:none;
  border-radius:10px;
  padding:9px 0;
  background:rgba(255,255,255,.065);
  color:rgba(238,226,207,.65);
  font-size:12px;
  font-weight:700;
  cursor:pointer;
}
.deer-tab.active{
  background:rgba(200,160,96,.26);
  color:#e4bd78;
}
.record-list{
  display:grid;
  gap:10px;
}
.record-item{
  padding:14px 16px;
  border-radius:12px;
  background:rgba(255,255,255,.045);
  border:.5px solid rgba(255,255,255,.08);
}
.record-top{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-bottom:6px;
}
.record-type{
  color:#e4bd78;
  font-size:13px;
  font-weight:800;
}
.record-date{
  color:rgba(255,255,255,.4);
  font-size:12px;
}
.record-text{
  color:rgba(255,255,255,.66);
  font-size:14px;
  line-height:1.7;
}


/* Labels */
#zone-labels{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:5}
.zone-label{
  position:absolute;transform:translate(-50%,-50%);background:rgba(0,0,0,.65);
  border:.5px solid rgba(255,255,255,.18);color:#e2d8c8;font-size:10px;
  padding:3px 9px;border-radius:4px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .25s;
}
.zone-label.visible{opacity:1}
.deer-id-label{
  border-color:rgba(200,216,115,.3);background:rgba(65,78,35,.88);
  color:#e4edb2;font-weight:800;letter-spacing:.04em;box-shadow:0 4px 10px rgba(0,0,0,.24);
}
.zone-name-label{box-shadow:0 4px 10px rgba(0,0,0,.28)}

#controls-hint{
  position:absolute;bottom:20px;left:50%;transform:translateX(-50%);
  display:flex;gap:10px;pointer-events:none;z-index:10;opacity:.92;
}
.hint-pill{
  background:rgba(0,0,0,.55);border:.5px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.55);font-size:10px;padding:4px 11px;border-radius:20px;
}

#load-bar{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  text-align:center;pointer-events:none;z-index:30;
}
#load-bar .spin{
  width:32px;height:32px;border:2px solid rgba(255,255,255,.12);
  border-top-color:#e8dcc8;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 12px;
}
@keyframes spin{to{transform:rotate(360deg)}}
#load-text{font-size:13px;color:rgba(232,220,200,.6)}

/* 餵食紀錄：壓縮頁首，將主要空間留給右側紀錄。 */
#feeding-records-page{
  position:absolute;top:76px;left:18px;right:18px;bottom:20px;z-index:24;
  border:1px solid rgba(197,213,117,.2);border-radius:20px;overflow:hidden;
  background:linear-gradient(155deg,rgba(25,26,21,.99),rgba(14,15,12,.99));
  box-shadow:0 22px 56px rgba(0,0,0,.42);color-scheme:dark;pointer-events:auto;
}
#feeding-records-page[hidden]{display:none}
.feeding-page-shell{height:100%;display:flex;flex-direction:column;gap:9px;padding:14px 22px 18px;overflow:hidden}
.feeding-page-header{display:flex;align-items:center;justify-content:space-between;gap:16px;flex:0 0 auto}
.feeding-page-header .profile-dialog-kicker{margin-bottom:3px;font-size:9px}
.feeding-page-header h2{margin:0 0 3px;color:#f1eadc;font-size:25px;line-height:1.15}
.feeding-page-header p{color:rgba(239,232,216,.52);font-size:12px;line-height:1.4}
.feeding-page-header-actions{display:flex;align-items:center;gap:10px}
.feeding-context-summary{min-width:0;display:flex;align-items:center;gap:12px;padding:7px 11px;border:1px solid rgba(197,213,117,.17);border-radius:10px;background:rgba(255,255,255,.035);text-align:left}
.feeding-context-summary span{color:rgba(239,232,216,.62);font-size:13px;font-weight:750}
.feeding-context-summary strong{padding-left:12px;border-left:1px solid rgba(255,255,255,.1);color:#e6edb8;font-size:14px}
.feeding-page-tabs{display:flex;gap:6px;flex:0 0 auto;padding:3px;border:1px solid rgba(255,255,255,.075);border-radius:10px;background:rgba(0,0,0,.14)}
.feeding-page-tabs button{flex:1;min-height:34px;border:0;border-radius:8px;background:transparent;color:rgba(239,232,216,.48);font-size:13px;font-weight:800;cursor:pointer}
.feeding-page-tabs button.is-active{background:rgba(111,132,57,.3);color:#e5edb1;box-shadow:inset 0 0 0 1px rgba(197,213,117,.2)}
.feeding-page-tabs button:focus-visible{outline:2px solid #d6e38c;outline-offset:2px}
.feeding-tab-panel{min-height:0;flex:1 1 auto}
.feeding-tab-panel[hidden]{display:none}
.feeding-workspace-grid{height:100%;display:grid;grid-template-columns:minmax(300px,32fr) minmax(0,68fr);gap:12px}
.feeding-workspace-card{min-height:0;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.028)}
.feeding-entry-form,.feeding-history-filter-form{overflow-y:auto;padding:16px}
.feeding-entry-form::-webkit-scrollbar,.feeding-history-filter-form::-webkit-scrollbar,.feeding-record-list-wrap::-webkit-scrollbar{width:7px}
.feeding-entry-form::-webkit-scrollbar-thumb,.feeding-history-filter-form::-webkit-scrollbar-thumb,.feeding-record-list-wrap::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:99px}
.feeding-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px}
.feeding-card-head>div>span{display:block;margin-bottom:5px;color:#aebe6f;font-size:10px;font-weight:850;letter-spacing:.14em}
.feeding-card-head h3{margin:0;color:#eee5d6;font-size:21px}
.feeding-card-head p{margin-top:5px;color:rgba(239,232,216,.46);font-size:13px;line-height:1.55}
.feeding-form-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.feeding-form-field{display:grid;gap:7px;min-width:0}
.feeding-form-field-wide{grid-column:1/-1}
.feeding-form-field>span{color:rgba(239,232,216,.66);font-size:13px;font-weight:750}
.feeding-form-field input,.feeding-form-field select,.feeding-form-field textarea{
  width:100%;border:1px solid rgba(255,255,255,.12);border-radius:10px;background:#24241f;
  color:#f0e9dc;padding:10px 11px;font:inherit;font-size:14px;outline:none;
}
.feeding-form-field input,.feeding-form-field select{height:44px}
.feeding-form-field input[readonly]{background:#1d1e1a;color:rgba(240,233,220,.64);cursor:default}
.feeding-form-field textarea{min-height:78px;resize:vertical;line-height:1.55}
.feeding-form-field input:focus,.feeding-form-field select:focus,.feeding-form-field textarea:focus{border-color:rgba(195,214,105,.62);box-shadow:0 0 0 3px rgba(160,185,71,.1)}
.feeding-form-field [aria-invalid="true"]{border-color:#e06f65;box-shadow:0 0 0 3px rgba(224,111,101,.1)}
.feeding-form-hint{margin-top:14px;padding:10px 12px;border:1px solid rgba(197,215,108,.18);border-radius:9px;background:rgba(197,215,108,.055);color:rgba(231,235,203,.7);font-size:12px;line-height:1.55}
.feeding-form-message{min-height:18px;margin-top:9px;font-size:12px;line-height:1.5}
.feeding-form-message.is-error{color:#ef847a}
.feeding-form-message.is-success{color:#91d69d}
.feeding-form-actions{display:flex;justify-content:flex-end;gap:9px;margin-top:12px}
.feeding-form-actions button{min-height:41px;padding:9px 14px;border-radius:9px;font-size:13px;font-weight:800;cursor:pointer}
.feeding-form-actions button:disabled{cursor:not-allowed;opacity:.48}
.feeding-record-panel{display:flex;flex-direction:column;padding:18px 20px;overflow:hidden}
.feeding-record-panel>.feeding-card-head{margin-bottom:12px}
.feeding-record-panel>.feeding-card-head h3{font-size:23px}
.feeding-record-panel>.feeding-card-head p{font-size:14px}
.feeding-record-list-wrap{min-height:0;flex:1 1 auto;overflow-y:auto;padding-right:4px}
.feeding-record-list{display:grid;gap:13px}
.feeding-record-card{padding:17px 18px;border:1px solid rgba(255,255,255,.085);border-radius:13px;background:rgba(0,0,0,.13)}
.feeding-record-card.is-deleted{border-color:rgba(190,91,81,.18);background:rgba(112,45,40,.08);opacity:.7}
.feeding-record-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:14px}
.feeding-record-card-head .feeding-record-time{display:block;color:#f2eadc;font-size:19px;line-height:1.25}
.feeding-record-identity{display:flex;align-items:stretch;gap:8px;margin-top:10px;flex-wrap:wrap}
.feeding-record-identity>span{min-width:145px;padding:8px 11px;border:1px solid rgba(197,213,117,.13);border-radius:9px;background:rgba(114,132,61,.09)}
.feeding-record-identity small{display:block;margin:0 0 3px;color:rgba(239,232,216,.46);font-size:11px}
.feeding-record-identity b{display:block;color:#ece5d6;font-size:16px;line-height:1.35}
.feeding-slot-badge{padding:5px 10px;border:1px solid rgba(197,213,117,.22);border-radius:99px;background:rgba(101,126,51,.18);color:#d5e798;font-size:13px;font-weight:850;white-space:nowrap}
.feeding-record-badges{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.feeding-record-amounts{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.feeding-record-amounts>div{padding:13px 14px;border:1px solid rgba(197,213,117,.08);border-radius:10px;background:rgba(255,255,255,.04)}
.feeding-record-amounts span{display:block;color:rgba(239,232,216,.55);font-size:13px;font-weight:750}
.feeding-record-amounts strong{display:block;margin-top:5px;color:#e0eba8;font-size:24px;line-height:1.2}
.feeding-record-meta{display:flex;flex-wrap:wrap;gap:7px 16px;margin-top:12px;color:rgba(239,232,216,.6);font-size:14px;line-height:1.55}
.feeding-record-note{margin-top:11px;padding-top:10px;border-top:1px solid rgba(255,255,255,.07);color:rgba(239,232,216,.72);font-size:14px;line-height:1.6}
.feeding-record-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:11px;padding-top:10px;border-top:1px solid rgba(255,255,255,.06)}
.feeding-record-actions button{min-height:38px;padding:7px 14px;border:1px solid rgba(197,213,117,.22);border-radius:8px;background:rgba(104,124,55,.15);color:#dce9a1;font-size:13px;font-weight:800;cursor:pointer}
.feeding-record-actions button:hover{border-color:rgba(211,225,137,.42);background:rgba(104,124,55,.28)}
.feeding-record-actions button.is-danger{border-color:rgba(229,103,92,.28);background:rgba(145,45,38,.14);color:#ee9d95}
.feeding-record-actions button.is-danger:hover{border-color:rgba(238,124,114,.5);background:rgba(169,53,45,.28)}
.feeding-record-deleted-note{margin-top:11px;padding:11px 12px;border:1px solid rgba(214,111,100,.18);border-radius:9px;background:rgba(139,52,44,.1);color:rgba(238,185,177,.78);font-size:13px;line-height:1.65}
.feeding-history-filter-fields{grid-template-columns:1fr}
.feeding-filter-panel{
  display:grid;grid-template-columns:repeat(5,minmax(135px,1fr));gap:14px;
  flex:0 0 auto;padding:18px;border:1px solid rgba(255,255,255,.08);border-radius:15px;
  background:rgba(255,255,255,.032);
}
.feeding-filter-field{display:grid;gap:7px;min-width:0}
.feeding-filter-field>span{color:rgba(239,232,216,.65);font-size:13px;font-weight:750}
.feeding-filter-field input,.feeding-filter-field select{
  width:100%;height:44px;padding:0 11px;border:1px solid rgba(255,255,255,.12);border-radius:10px;
  background:#24241f;color:#f0e9dc;font:inherit;font-size:14px;outline:none;
}
.feeding-filter-field input:focus,.feeding-filter-field select:focus{border-color:rgba(195,214,105,.62);box-shadow:0 0 0 3px rgba(160,185,71,.1)}
.feeding-filter-actions{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:2px}
.feeding-filter-actions>div{display:flex;gap:10px}
.feeding-filter-actions button{min-height:42px;padding:9px 16px;border-radius:10px;font-size:14px;font-weight:800;cursor:pointer}
.feeding-deleted-toggle{display:flex;align-items:center;gap:9px;color:rgba(239,232,216,.62);font-size:13px;cursor:pointer}
.feeding-deleted-toggle input{width:18px;height:18px;accent-color:#8ea54b}
.feeding-history-panel{
  min-height:0;display:flex;flex:1 1 auto;flex-direction:column;padding:20px;
  border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.025);
}
.feeding-history-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:15px;flex:0 0 auto}
.feeding-history-head h3{margin:0 0 5px;color:#eee5d6;font-size:21px}
.feeding-history-head p{color:rgba(239,232,216,.46);font-size:13px}
.feeding-history-status{padding:5px 10px;border-radius:99px;background:rgba(255,255,255,.055);color:#bfcf82;font-size:14px;font-weight:800;white-space:nowrap}
.feeding-history-status.is-error{border:1px solid rgba(225,107,96,.28);background:rgba(153,52,44,.15);color:#ef9188}
.feeding-history-content{min-height:0;flex:1 1 auto;overflow:auto;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(0,0,0,.12)}
.feeding-history-content::-webkit-scrollbar{width:7px;height:7px}
.feeding-history-content::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:99px}
.feeding-history-table{width:100%;min-width:980px;border-collapse:collapse;font-size:14px}
.feeding-history-table th{
  position:sticky;top:0;z-index:1;padding:12px 13px;border-bottom:1px solid rgba(255,255,255,.1);
  background:#25251f;color:rgba(239,232,216,.57);font-size:12px;letter-spacing:.04em;text-align:left;white-space:nowrap;
}
.feeding-history-table td{padding:13px;border-bottom:1px solid rgba(255,255,255,.065);color:rgba(239,232,216,.73);vertical-align:top}
.feeding-history-table tbody tr:last-child td{border-bottom:0}
.feeding-history-table tbody tr:hover{background:rgba(153,175,80,.055)}
.feeding-history-table tr.is-deleted{opacity:.58;background:rgba(149,59,52,.08)}
.feeding-record-primary{display:block;color:#eee6d8;font-size:14px;font-weight:800;white-space:nowrap}
.feeding-record-secondary{display:block;margin-top:4px;color:rgba(239,232,216,.4);font-size:12px;line-height:1.45}
.feeding-amount{color:#dce8a2;font-weight:800;white-space:nowrap}
.feeding-record-state{display:inline-flex;padding:4px 9px;border-radius:99px;background:rgba(84,137,56,.15);color:#a9d38d;font-size:13px;font-weight:800;white-space:nowrap}
.feeding-record-state.is-deleted{background:rgba(157,65,55,.16);color:#e69b92}
.feeding-delete-confirmation{position:absolute;inset:0;z-index:4;display:grid;place-items:center;padding:24px;background:rgba(7,7,6,.72);backdrop-filter:blur(5px)}
.feeding-delete-confirmation[hidden]{display:none}
.feeding-delete-dialog{width:min(520px,100%);padding:22px;border:1px solid rgba(229,103,92,.28);border-radius:16px;background:linear-gradient(155deg,#27231f,#171714);box-shadow:0 24px 70px rgba(0,0,0,.5)}
.feeding-delete-dialog .feeding-card-head{margin-bottom:17px}
.feeding-delete-dialog .feeding-form-actions{margin-top:15px}
.feeding-empty-state{min-height:190px;display:grid;place-content:center;justify-items:center;gap:8px;padding:28px;text-align:center}
.feeding-empty-state strong{color:#e9e1d3;font-size:17px}
.feeding-empty-state p{max-width:520px;color:rgba(239,232,216,.47);font-size:13px;line-height:1.65}
.feeding-empty-state button{margin-top:5px;padding:9px 14px;border:1px solid rgba(197,215,108,.34);border-radius:9px;background:#687d39;color:#f5f8df;font-size:13px;font-weight:800;cursor:pointer}
.feeding-pagination{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:14px;flex:0 0 auto}
.feeding-pagination button{min-width:86px;padding:9px 13px;border:1px solid rgba(255,255,255,.12);border-radius:9px;background:rgba(255,255,255,.055);color:#e3dccf;font-size:14px;font-weight:750;cursor:pointer}
.feeding-pagination button:disabled{cursor:not-allowed;opacity:.35}
.feeding-pagination span{min-width:110px;color:rgba(239,232,216,.58);font-size:14px;text-align:center}
body.feeding-records-view-mode #c{pointer-events:none}
body.feeding-records-view-mode #left-sidebar,
body.feeding-records-view-mode #info-panel,
body.feeding-records-view-mode #zone-labels,
body.feeding-records-view-mode #controls-hint,
body.feeding-records-view-mode #load-bar{visibility:hidden;pointer-events:none}

/* 全站閱讀性：放大總覽以外頁面的資訊、履歷與表單文字。 */
#farm-sub{font-size:11px}
.top-view-label{font-size:11px}
.nav-chip{font-size:11px}
.nav-chip strong{font-size:14px}
#view-selector{font-size:13px}
.view-select-arrow{font-size:10px}

.sensor-board-title{font-size:22px}
.sensor-mini-name{font-size:12px}
.sensor-mini-val{font-size:28px}
.sensor-mini-unit{font-size:11px}
.sensor-mini-status{font-size:10px}
.farm-alert-state{font-size:17px}
.farm-alert-message{font-size:13px}
.sensor-trend-title{font-size:12px}
.sensor-trend-title strong{font-size:13px}

body:not(.farm-overview-mode) #panel-badge{font-size:12px}
body:not(.farm-overview-mode) #panel-title{font-size:28px}
body:not(.farm-overview-mode) #panel-subtitle{font-size:16px}
#add-deer-profile-button,#add-deer-measurement-button,#add-deer-antler-record-button,#open-feeding-records-button{font-size:13px}

.section-label{font-size:13px}
.info-row{font-size:17px}
.info-row-value{font-size:19px}
.desc-box{font-size:16px}
.sensor-name{font-size:12px}
.sensor-val{font-size:27px}
.sensor-unit{font-size:13px}
.sensor-status{font-size:11px}
.trend-head{font-size:13px}
.trend-head strong{font-size:14px}
.profile-label{font-size:13px}
.profile-value{font-size:22px}
.profile-note{font-size:13px;line-height:1.6}
.deer-tab{padding:11px 0;font-size:14px}
.record-type{font-size:15px}
.record-date{font-size:13px}
.record-text{font-size:15px}

#deer-form-zone-preview span{font-size:11px}
#deer-form-zone-preview strong{font-size:15px}
.profile-dialog-kicker{font-size:11px}
.profile-dialog-head h2{font-size:28px}
.profile-dialog-head p{font-size:14px}
.profile-form-grid{gap:17px}
.profile-form-field{gap:8px}
.profile-form-field>span{font-size:14px}
.profile-form-field input,.profile-form-field select,.profile-form-field textarea{padding:11px 12px;font-size:16px}
.profile-form-field input,.profile-form-field select{height:46px}
.profile-form-field textarea{min-height:92px;line-height:1.65}
.profile-form-toggle{padding:14px}
.profile-form-toggle span{font-size:14px}
.profile-form-toggle small{font-size:12px;line-height:1.6}
.profile-form-hint,.profile-form-error{font-size:13px}
.profile-form-actions button{padding:11px 18px;font-size:14px}
.antler-form-context span{font-size:12px}
.antler-form-context strong{font-size:18px}
.antler-action-selector legend{font-size:14px}
.antler-action-option{min-height:86px;padding:14px}
.antler-action-option strong{font-size:14px}
.antler-action-option small{font-size:12px}
.profile-created-notice{font-size:13px}
.measurement-history-head,.measurement-history-values,.antler-history-head,.antler-history-cycle{font-size:14px}
.measurement-history-notes,.antler-history-notes{font-size:13px}
.antler-harvest-badge,.antler-history-source{font-size:11px}
.antler-event-badge{font-size:10px}

#deer-antler-growth-page .profile-dialog-head h2{font-size:30px}
#deer-antler-growth-page .profile-dialog-head p{font-size:15px}
#deer-antler-growth-page .antler-core-kicker{font-size:12px}
#deer-antler-growth-page .antler-core-head h3,
#deer-antler-growth-page .antler-growth-core>h3{font-size:25px}
#deer-antler-growth-page .antler-growth-core>p{font-size:15px}
#deer-antler-growth-page .antler-progress-status{font-size:13px}
#deer-antler-growth-page .antler-stage-hero span,
#deer-antler-growth-page .antler-stage-metrics span{font-size:12px}
#deer-antler-growth-page .antler-stage-metrics strong{font-size:16px}
#deer-antler-growth-page .antler-stage-step{font-size:14px}
#deer-antler-growth-page .antler-stage-node{font-size:12px}
#deer-antler-growth-page .antler-stage-date{font-size:12px}
#deer-antler-growth-page .antler-estimate-row{font-size:13px}
#deer-antler-growth-page .antler-estimate-row small{font-size:11px}
#deer-antler-growth-page .antler-progress-message{font-size:15px}
#deer-antler-growth-page .antler-core-actions button{font-size:14px}
#deer-antler-growth-page .antler-section-head h3{font-size:23px}
#deer-antler-growth-page .antler-section-head>span{font-size:13px}
#deer-antler-growth-page .antler-history-head,
#deer-antler-growth-page .antler-history-cycle{font-size:15px}
#deer-antler-growth-page .antler-history-notes{font-size:14px}
#deer-antler-growth-page .antler-history-source,
#deer-antler-growth-page .antler-event-badge,
#deer-antler-growth-page .antler-harvest-badge{font-size:12px}

.zone-label{font-size:11px}
.hint-pill{font-size:11px}
#load-text{font-size:14px}

/* 預設使用低成本半透明面板，避免靜態頁面額外啟用即時背景模糊。 */
#top-bar,
#sensor-dashboard,
#info-panel,
#deer-profile-create-page,#deer-measurement-page,#deer-antler-record-page,#deer-antler-photo-page,#deer-antler-growth-page,#deer-archive-history-page{backdrop-filter:none}

@media(min-width:901px) and (max-width:1400px){
  .top-view-control .view-select-wrap{width:165px}
  .top-view-label{display:none}
  #left-sidebar{width:320px;left:12px}
  #sensor-dashboard{padding:14px}
  #info-panel{width:420px;right:12px}
  #panel-header{padding:20px 22px 16px 58px}
  #panel-content{padding:20px 22px 28px}
  #panel-title{font-size:24px}
  .profile-value{font-size:20px}
  #deer-profile-create-page,#deer-measurement-page,#deer-antler-record-page,#deer-antler-photo-page,#deer-antler-growth-page,#deer-archive-history-page{right:12px;width:clamp(520px,52vw,680px)}
  #deer-archive-history-page{right:18px;width:calc(60vw - 27px)}
  body.deer-archive-history-zone-mode #deer-archive-history-page{right:12px;width:clamp(520px,52vw,680px)}
}

@media(max-width:900px){
  #top-bar{padding:0 12px}
  #system-status-chip,#update-time-chip{display:none}
  #farm-title{font-size:17px}
  #brand-logo-wrap{width:42px;height:42px;flex-basis:42px}
  .top-view-control{padding-left:7px}
  .top-view-control .view-select-wrap{width:160px}
  .top-view-label{display:none}
  #left-sidebar{left:10px;right:10px;top:74px;bottom:calc(52vh + 12px);width:auto;gap:10px;overflow:hidden}
  #sensor-dashboard{padding:12px;overflow-y:auto}
  #info-panel{width:calc(100vw - 20px);right:10px;left:10px;top:auto;height:52vh}
  #panel-header{padding-left:56px}
  #deer-profile-create-page,#deer-measurement-page,#deer-antler-record-page,#deer-antler-photo-page,#deer-antler-growth-page,#deer-archive-history-page{left:10px;right:10px;top:74px;bottom:10px;width:auto}
  #deer-archive-history-page{left:auto;width:calc(60vw - 15px)}
  body.deer-archive-history-zone-mode #deer-archive-history-page{left:10px;right:10px;width:auto}
  #deer-form-zone-preview{display:none}
  body.farm-overview-mode #c{top:74px;left:10px;width:calc(40vw - 15px)!important;height:calc(100vh - 84px)!important}
  body.farm-overview-mode #info-panel{top:74px;right:10px;bottom:10px;left:auto;width:calc(60vw - 15px);height:auto}
}
@media(max-width:560px){
  #login-page{padding:14px}
  .admin-login-card{padding:25px 20px;border-radius:19px}
  .admin-login-brand{align-items:flex-start;gap:13px;margin-bottom:24px}
  .admin-login-logo-wrap{width:58px;height:58px;flex-basis:58px;border-radius:16px}
  .admin-login-brand h1{font-size:24px}
  #top-bar{height:60px;padding:0 9px}
  #brand{gap:8px}
  #brand-logo-wrap{width:38px;height:38px;flex-basis:38px;border-radius:11px}
  #farm-title{font-size:15px;white-space:nowrap}
  #farm-sub{display:none}
  .top-view-control{padding:3px 5px}
  .top-view-control .view-select-wrap{width:122px}
  .nav-chip{height:32px;padding:0 9px}
  .nav-chip-label{display:none}
  .sensor-mini-grid{grid-template-columns:1fr 1fr}
  .deer-profile-create-scroll{padding:20px 16px 24px}
  .profile-form-grid{grid-template-columns:1fr}
  .profile-form-field-wide{grid-column:auto}
  .profile-dialog-head h2{font-size:25px}
  .antler-form-context{grid-template-columns:1fr}
  .antler-action-selector{grid-template-columns:1fr}
  .antler-action-option{min-height:62px}
  .antler-quality-issue-grid{grid-template-columns:1fr 1fr}
  .antler-harvest-photo-picker-grid{grid-template-columns:1fr}
  .antler-photo-record-context{grid-template-columns:1fr}
  .antler-photo-slot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
  .antler-photo-slot{aspect-ratio:4/3}
  .antler-photo-upload-modal{padding:12px}
  .antler-photo-upload-dialog{padding:17px}
  .antler-photo-upload-dialog-body{grid-template-columns:1fr;gap:14px}
  .antler-photo-upload-preview{max-height:38vh}
  .antler-photo-upload-actions{align-items:stretch;flex-direction:column-reverse}
  .antler-photo-upload-actions button{width:100%}
  .antler-record-photo-summary{align-items:stretch;flex-direction:column}
  .antler-record-photo-manage{width:100%}
  .antler-stage-hero{grid-template-columns:1fr}
  .antler-stage-metrics>div:first-child{padding-left:0;border-left:0}
  .antler-estimate-row{grid-template-columns:1fr;text-align:left}
  .profile-form-actions{align-items:stretch;flex-direction:column-reverse}
  .profile-form-action-group{width:100%;margin-left:0}
  .profile-form-action-group button{flex:1}
  .deer-archive-history-shell{padding:20px 16px 22px}
  #deer-archive-history-page{left:10px;width:auto}
  .deer-archive-history-layout{grid-template-columns:1fr;grid-template-rows:minmax(150px,34%) minmax(0,66%)}
  .deer-archive-count-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:700px){
  .deer-profile-info-grid,
  .deer-profile-summary-grid{grid-template-columns:1fr}
  .deer-profile-info-item,
  .deer-profile-info-item:nth-child(-n+2),
  .deer-profile-info-item:nth-child(even),
  .deer-profile-summary-grid .deer-profile-info-item{
    border-top:1px solid rgba(255,255,255,.065);border-left:0;
  }
  .deer-profile-info-item:first-child,
  .deer-profile-summary-grid .deer-profile-info-item:first-child{border-top:0}
  .deer-profile-summary-head{align-items:stretch;flex-direction:column}
  .deer-profile-section-actions{justify-content:stretch}
  .deer-profile-section-actions button{flex:1}
  .antler-record-photo-summary{align-items:stretch;flex-direction:column}
  .antler-record-photo-manage{align-self:flex-start}
  .antler-photo-viewer{padding:0}
  .antler-photo-viewer-dialog{width:100%;height:100dvh;max-height:none;border:0;border-radius:0}
  .antler-photo-viewer-header{padding:14px 15px}
  .antler-photo-viewer-header h2{font-size:19px}
  .antler-photo-viewer-stage{
    min-height:0;grid-template-columns:38px minmax(0,1fr) 38px;gap:6px;padding:10px;
  }
  .antler-photo-viewer-image-frame{height:100%}
  .antler-photo-viewer-nav{width:36px;height:46px;font-size:27px}
  .antler-photo-viewer-info{grid-template-columns:repeat(2,minmax(0,1fr));margin:0 10px}
  .antler-photo-viewer-footer{padding:11px 10px 13px}
  .antler-photo-viewer-filmstrip-item{flex-basis:74px;height:54px}
}

@media(max-width:480px){
  #top-status>.nav-chip,.admin-account-chip{display:none}
  #admin-logout-button{height:32px;padding:0 9px}
  .top-view-control .view-select-wrap{width:132px}
}

@media(max-width:1100px){
  .overview-metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .overview-summary-row{grid-template-columns:1fr}
}

@media(max-width:700px){
  body.farm-overview-mode #c{
    top:64px;
    left:10px;
    width:calc(100vw - 20px)!important;
    height:34vh!important;
  }
  body.farm-overview-mode #info-panel{
    top:calc(34vh + 74px);
    right:10px;
    bottom:10px;
    left:10px;
    width:auto;
    height:auto;
  }
  body.farm-overview-mode #panel-header{padding:16px 18px 13px}
  body.farm-overview-mode #panel-content{padding:14px 16px 20px}
  body.farm-overview-mode #panel-title{font-size:24px}
  body.farm-overview-mode #panel-subtitle{font-size:13px}
  .overview-metric-card{padding:14px}
  .overview-metric-head span{font-size:12px}
  .overview-metric-card>strong{font-size:26px}
  .overview-count-grid span{font-size:10px}
  .overview-count-grid strong{font-size:23px}
  .overview-section-head h3{font-size:19px}
  .overview-zone-head>strong{font-size:15px}
  .overview-occupancy-badge{font-size:10px}
  .overview-zone-presence strong{font-size:13px}
  .overview-trend-grid,.overview-zone-grid{grid-template-columns:1fr}
  .overview-section-head>span{display:none}
  body.farm-overview-mode #controls-hint{display:none}
  body.farm-overview-mode #load-bar{left:50%;top:22vh}
}

@media(max-width:1100px){
  .feeding-filter-panel{grid-template-columns:repeat(3,minmax(150px,1fr))}
}

@media(max-width:900px){
  .feeding-tab-panel{overflow-y:auto}
  .feeding-workspace-grid{height:auto;grid-template-columns:1fr}
  .feeding-entry-form,.feeding-history-filter-form{overflow:visible}
  .feeding-record-panel{min-height:430px}
}

@media(max-width:700px){
  #feeding-records-page{top:74px;left:10px;right:10px;bottom:10px}
  .feeding-page-shell{gap:15px;padding:20px 16px}
  .feeding-page-header{align-items:stretch;flex-direction:column}
  .feeding-page-header-actions{align-items:center;justify-content:space-between}
  .feeding-context-summary{min-width:0;flex:1;text-align:left}
  .feeding-page-header h2{font-size:25px}
  .feeding-page-header p{font-size:13px}
  .feeding-form-fields{grid-template-columns:1fr}
  .feeding-form-field-wide{grid-column:auto}
  .feeding-entry-form,.feeding-history-filter-form,.feeding-record-panel{padding:14px}
  .feeding-filter-panel{grid-template-columns:1fr;padding:14px}
  .feeding-filter-actions{align-items:stretch;flex-direction:column}
  .feeding-filter-actions>div{display:grid;grid-template-columns:1fr 1fr}
  .feeding-history-panel{padding:14px}
  .feeding-history-head{align-items:flex-start;flex-direction:column}
  .feeding-history-table{min-width:900px}
  .feeding-pagination{justify-content:center}
}
