*{box-sizing:border-box}
:root{
  --bg:#f7f3ee; --panel:#fffaf5; --card:#ffffff; --ink:#2b2118; --muted:#74685d; --line:#eadfd2;
  --primary:#7c3f2b; --primary-dark:#5f2f20; --accent:#d97745; --good:#e8f5e9; --warn:#fff4dc; --bad:#fde8e4; --info:#edf6f7;
  --radius:24px;
}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:radial-gradient(circle at top left,rgba(217,119,69,.14),transparent 30rem),radial-gradient(circle at bottom right,rgba(124,63,43,.08),transparent 34rem),var(--bg);color:var(--ink)}
button,input,textarea,select{font:inherit}.hidden{display:none!important}
.app-shell{min-height:100vh;display:grid;grid-template-columns:310px 1fr;gap:24px;padding:22px}
.sidebar,.phone,.card,.session-row,.signal-card{background:rgba(255,250,245,.94);border:1px solid var(--line);border-radius:32px;box-shadow:0 16px 38px rgba(67,45,31,.07)}
.sidebar{padding:20px;min-height:calc(100vh - 44px);position:sticky;top:22px}
.brand-block{display:flex;align-items:center;gap:12px;margin-bottom:18px}.brand-mark,.hero-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:18px;background:linear-gradient(145deg,#fff4e8,#f3d7c4);font-size:24px}.brand{font-size:1.35rem;font-weight:900;letter-spacing:-.04em}.muted{color:var(--muted)}.small{font-size:.86rem}.tiny{font-size:.74rem;color:var(--muted)}
.nav{display:flex;flex-direction:column;gap:8px;margin:18px 0}.nav button,.outline,.primary,.segmented button{border:1px solid var(--line);border-radius:18px;padding:12px 14px;background:#fffaf5;cursor:pointer}.nav button{text-align:left;color:#5f5349}.nav button.active,.segmented button.active,.primary{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff;border-color:var(--primary-dark);font-weight:800}.logout-button,.danger-outline{border-color:#efb7ad!important;background:#fde8e4!important;color:#8a2f20!important}
.main{min-width:0;display:block}.screen{width:100%;max-width:820px;margin:0 auto}.phone{max-width:450px;margin:0 auto;overflow:hidden}.phone.wide{max-width:790px}.access-phone{max-width:460px}
.app-product-header{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 auto 16px;max-width:820px;padding:14px 16px;border:1px solid var(--line);border-radius:22px;background:rgba(255,250,245,.88)}.app-product-title{font-weight:900;letter-spacing:-.04em}.app-product-version{color:var(--muted);font-size:.82rem}
header{padding:20px 20px 16px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#fffaf5,#fbf3eb)}header h1{margin:.2rem 0;font-size:1.45rem;letter-spacing:-.04em}header p{margin:.2rem 0;color:var(--muted)}.hero-header{text-align:center;padding:32px 22px 22px}.hero-icon{width:64px;height:64px;margin:0 auto 12px;border-radius:24px;font-size:32px}.hero-header h1{font-size:2rem}
.card{border-radius:var(--radius);padding:16px;margin:14px 16px}.access-card{background:#fffdf9}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px}.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
label{display:flex;flex-direction:column;gap:7px;font-weight:700;font-size:.92rem;margin-bottom:13px}input,textarea,select{width:100%;border:1px solid #d9c9b8;border-radius:16px;padding:12px 13px;background:#fffdfb;color:var(--ink);outline:none}input:focus,textarea:focus,select:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(217,119,69,.15)}textarea{min-height:88px;resize:vertical}.full{width:100%}.outline{background:#fffaf5;color:var(--ink)}.or-divider{text-align:center;color:var(--muted);font-size:.86rem;margin:12px 0}
.consent-card,.notice-card,.notice{background:var(--info);border-color:#cde5e7}.checkbox-row{display:grid;grid-template-columns:22px 1fr;align-items:start;gap:10px;font-weight:600}.checkbox-row input{width:18px;height:18px;margin-top:2px}
.status-cards{display:flex;flex-direction:column;gap:10px;margin-top:20px}.status-card{background:#fffaf5;border:1px solid var(--line);border-radius:22px;padding:13px}.pill{border-radius:999px;padding:5px 10px;font-size:.75rem;font-weight:800}.pill.ready{background:var(--primary);color:#fff}.pill.removed{background:#f0ebe5;color:#5f5349}.pill.active{background:var(--warn);color:#7a4b16}
.segmented{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 16px;background:#efe7df;padding:5px;border-radius:20px}.segmented button{border:0;border-radius:16px;box-shadow:none}
.summary-box{border-radius:18px;padding:12px;min-height:78px}.heat-high{background:var(--bad)}.heat-mid{background:var(--warn)}.heat-low{background:var(--good)}.summary-value{font-size:1.28rem;font-weight:850;letter-spacing:-.04em}.session-row{padding:14px;margin:0 16px 12px;border-radius:22px}
.qr-canvas,.qr-fallback-img{display:block;width:220px!important;height:220px!important;margin:16px auto;padding:12px;border-radius:20px;background:white;border:1px solid var(--line)}.access-code-display{font-size:1.8rem;font-weight:900;letter-spacing:.14em;text-align:center;background:#fffdfb;border:1px dashed var(--line);border-radius:20px;padding:16px;margin:12px 0}
.modal-backdrop{position:fixed;inset:0;z-index:9999;background:rgba(43,33,24,.58);display:flex;align-items:center;justify-content:center;padding:18px}.modal-card{width:min(760px,100%);max-height:min(88vh,900px);overflow:auto;background:#fffaf5;border-radius:28px;box-shadow:0 28px 80px rgba(67,45,31,.28);border:1px solid var(--line)}.modal-header{position:sticky;top:0;background:rgba(255,250,245,.95);border-bottom:1px solid var(--line);padding:18px;display:flex;justify-content:space-between}.modal-body{padding:18px}.edit-site-card{border:1px solid var(--line);background:#fffdf9;border-radius:22px;padding:14px;margin-bottom:12px}
.readiness-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:0 16px 12px}.readiness-card,.signal-card{border-radius:18px;padding:12px;margin:0 16px 12px}.readiness-card.ready,.signal-card.ready{background:var(--good);border-color:#b7dfbd}.readiness-card.removed,.signal-card.removed{background:#f0ebe5}.signal-card.attention{background:var(--warn);border-color:#f1d19b}.signal-message{margin:8px 0 12px;color:#4f453d;font-weight:700}.prose-card{line-height:1.55;background:#fffdf9}.prose-card h2{margin:0 0 12px}.prose-card p{margin:0 0 14px;color:#4f453d}
.more-menu{display:grid;gap:10px}.bottom-nav{display:none}

@media(max-width:900px){
 body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
 .app-shell{display:block!important;padding:10px!important;min-height:100dvh}.sidebar{display:none!important}.main{display:block!important;width:100%}.screen{max-width:none!important;width:100%}.phone,.phone.wide,.access-phone{width:100%!important;max-width:none!important;border-radius:24px!important;margin:0 auto!important}.card,.session-row,.segmented,.readiness-strip,.signal-card{margin-left:10px!important;margin-right:10px!important}.app-product-header{margin:0 0 10px!important;border-radius:20px!important}.grid2,.grid3,.readiness-strip{grid-template-columns:1fr!important}input,textarea,select,button{font-size:16px}
 .bottom-nav{position:fixed;left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));z-index:9998;display:grid;grid-template-columns:repeat(5,1fr);gap:6px;padding:8px;border:1px solid var(--line);border-radius:24px;background:rgba(255,250,245,.96);box-shadow:0 18px 42px rgba(67,45,31,.18);backdrop-filter:blur(12px)}.bottom-nav.hidden{display:none!important}.bottom-nav button{min-height:46px;border:0;border-radius:18px;background:transparent;color:var(--muted);font-size:.78rem;font-weight:800;padding:6px 4px}.bottom-nav button.active{background:linear-gradient(135deg,var(--primary),var(--primary-dark));color:#fff}
}
@media(min-width:901px){.bottom-nav{display:none!important}}
@media print{.sidebar,.nav,.bottom-nav,button,.segmented{display:none!important}.app-shell{display:block;padding:0;background:white}.phone{box-shadow:none;max-width:none;border:0}.screen.hidden{display:none!important}}


/* v1.2 editable palette system */
:root {
  --theme-bg: var(--bg);
  --theme-panel: var(--panel);
  --theme-card: #ffffff;
  --theme-ink: var(--ink);
  --theme-muted: var(--muted);
  --theme-line: var(--line);
  --theme-primary: var(--primary);
  --theme-primary-dark: var(--primary-dark);
  --clinical-blood: #b42318;
  --clinical-healing: #e88b9a;
  --clinical-serous: #f2d06b;
  --clinical-clear: #dff4ea;
  --clinical-cloudy: #f3b65f;
  --clinical-green: #5a9f66;
  --clinical-neutral: #f4ede7;
  --chart-drain-1: #7c3f2b;
  --chart-drain-2: #2f6f73;
  --chart-drain-3: #8a6f2a;
  --chart-drain-4: #8057a2;
  --chart-threshold: #b42318;
}
.palette-preview{display:grid;grid-template-columns:repeat(8,1fr);gap:5px;margin:8px 0 14px}
.palette-preview span{height:18px;border-radius:999px;border:1px solid rgba(43,33,24,.15)}
.delete-warning{background:var(--warn);border:1px solid #f1d19b;border-radius:16px;padding:10px;margin:10px 0;color:#5b3a05;font-size:.86rem}


/* v1.3.1 version sync */
.app-product-version {
  color: var(--muted, #74685d);
  font-size: .82rem;
}
.version-ok {
  color: #2d6f4d;
  font-weight: 800;
}
.version-mismatch {
  color: #b42318;
  font-weight: 800;
}


/* v1.3.3 logo integration + access page hardening */
.logo-mark,
.logo-hero {
  overflow: hidden;
  background: transparent !important;
  box-shadow: none !important;
}

.logo-mark img,
.logo-hero img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.brand-mark.logo-mark {
  width: 58px;
  height: 58px;
  border-radius: 16px;
}

.small-logo {
  width: 42px !important;
  height: 42px !important;
}

.hero-icon.logo-hero {
  width: 86px;
  height: 86px;
  margin: 0 auto 10px;
}

.access-phone {
  position: relative;
}

.access-illustration {
  display: flex;
  justify-content: center;
  align-items: end;
  gap: 14px;
  margin: 6px auto 12px;
  pointer-events: none;
  user-select: none;
}

.access-illustration img {
  display: block;
  object-fit: contain;
  filter: drop-shadow(0 16px 20px rgba(67,45,31,.14));
}

.cup-illustration {
  width: min(34vw, 145px);
  max-height: 150px;
}

.bulb-illustration {
  width: min(28vw, 120px);
  max-height: 190px;
  opacity: .94;
}

@media (max-width: 600px) {
  .hero-icon.logo-hero {
    width: 74px;
    height: 74px;
  }

  .access-illustration {
    gap: 8px;
    margin-top: 2px;
  }

  .cup-illustration {
    width: 112px;
  }

  .bulb-illustration {
    width: 96px;
  }
}


/* v1.3.4 restore History clinical value colors */
:root {
  --clinical-blood: var(--clinical-blood, #b42318);
  --clinical-healing: var(--clinical-healing, #e88b9a);
  --clinical-serous: var(--clinical-serous, #f2d06b);
  --clinical-clear: var(--clinical-clear, #dff4ea);
  --clinical-cloudy: var(--clinical-cloudy, #f3b65f);
  --clinical-green: var(--clinical-green, #5a9f66);
  --clinical-neutral: var(--clinical-neutral, #f4ede7);
}

.clinical-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  width: fit-content;
  border-radius: 999px;
  padding: 4px 9px;
  margin-top: 6px;
  font-size: .72rem;
  font-weight: 850;
  letter-spacing: .01em;
  color: #2b2118;
  border: 1px solid rgba(43, 33, 24, .12);
}

.clinical-dot {
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: currentColor;
  box-shadow: 0 0 0 2px rgba(255,255,255,.7);
}

.clinical-blood {
  background: #fde8e4 !important;
  color: #9b1c12 !important;
  border-color: color-mix(in srgb, #b42318 35%, var(--line, #eadfd2)) !important;
}

.clinical-healing {
  background: #fdecef !important;
  color: #9e4252 !important;
  border-color: color-mix(in srgb, #e88b9a 45%, var(--line, #eadfd2)) !important;
}

.clinical-serous {
  background: #fff4dc !important;
  color: #785b08 !important;
  border-color: color-mix(in srgb, #f2d06b 55%, var(--line, #eadfd2)) !important;
}

.clinical-clear {
  background: #e8f5e9 !important;
  color: #2d6f4d !important;
  border-color: color-mix(in srgb, #dff4ea 70%, var(--line, #eadfd2)) !important;
}

.clinical-cloudy {
  background: #fff0d4 !important;
  color: #8a4d08 !important;
  border-color: color-mix(in srgb, #f3b65f 55%, var(--line, #eadfd2)) !important;
}

.clinical-green {
  background: #e2f0e4 !important;
  color: #2d6f3c !important;
  border-color: color-mix(in srgb, #5a9f66 45%, var(--line, #eadfd2)) !important;
}

.clinical-neutral {
  background: #f4ede7 !important;
  color: var(--muted, #74685d) !important;
}

.summary-box.clinical-blood,
.summary-box.clinical-healing,
.summary-box.clinical-serous,
.summary-box.clinical-clear,
.summary-box.clinical-cloudy,
.summary-box.clinical-green,
.summary-box.clinical-neutral {
  border-width: 1px;
}

.clinical-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  margin: 0 16px 14px;
}

.threshold-note {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 6px 16px 12px;
  padding: 8px 11px;
  border-radius: 999px;
  background: rgba(90, 159, 102, .10);
  color: #315f41;
  font-size: .78rem;
  font-weight: 800;
}

.threshold-note::before {
  content: "";
  width: 26px;
  height: 0;
  border-top: 2px dashed var(--chart-threshold, #b42318);
}


/* v1.3.5 cosmetic polish */
.brand-mark.logo-mark {
  width: 132px !important;
  height: 132px !important;
  border-radius: 24px;
}

.small-logo {
  width: 96px !important;
  height: 96px !important;
}

.hero-icon.logo-hero {
  width: 190px !important;
  height: 190px !important;
  margin: 0 auto 10px;
}

.access-illustration {
  gap: 22px;
  margin: 12px auto 18px;
}

.cup-illustration {
  width: min(58vw, 320px) !important;
  max-height: 330px !important;
}

.bulb-illustration {
  width: min(40vw, 230px) !important;
  max-height: 340px !important;
}

#quickLogForm details {
  margin-bottom: 1.15rem;
}

.save-entry-button {
  margin-top: .25rem;
}

.readiness-card strong {
  margin-right: .45em;
}

.version-status {
  margin-left: 4px;
}

.version-mismatch {
  color: #b42318;
  font-weight: 800;
}

@media (max-width: 600px) {
  .brand-mark.logo-mark {
    width: 96px !important;
    height: 96px !important;
  }

  .small-logo {
    width: 72px !important;
    height: 72px !important;
  }

  .hero-icon.logo-hero {
    width: 150px !important;
    height: 150px !important;
  }

  .cup-illustration {
    width: 220px !important;
  }

  .bulb-illustration {
    width: 150px !important;
  }
}


/* v1.4 edit history + restore */
.edit-history-card {
  border: 1px solid var(--line, #eadfd2);
  background: #fffdf9;
  border-radius: 22px;
  padding: 14px;
  margin: 14px 0;
}

.revision-panel {
  margin-top: 12px;
  display: grid;
  gap: 10px;
}

.revision-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  border: 1px solid var(--line, #eadfd2);
  background: #fffaf5;
  border-radius: 18px;
  padding: 10px;
}
