/* Polished v4g — fixes: daily render when locked, retro hidden until report, column labels */
:root{
  --bg:#0a0a0a; --card:#121212; --ink:#e6f1ff; --muted:#9fb0c3;
  --green:#00FF00; --blue:#4169E1; --red:#FF4500; --line:#252525; --chip:#161616;
  --shadow:0 14px 40px rgba(0,0,0,.45); --radius:16px; --btnr:10px;
}
*{box-sizing:border-box; min-width:0}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font:15px/1.6 system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial}
.container{max-width:920px;margin:0 auto;padding:8px 12px 12px}

.app-header{position:sticky;top:0;z-index:10;display:flex;justify-content:space-between;align-items:end;gap:12px;
  padding:6px 12px;background:#151515;backdrop-filter:blur(10px);border-bottom:1px solid #252525}
.app-header h1{margin:0;font-size:18px;letter-spacing:.2px;color:var(--green)}
.small{font-size:12px}.muted{color:var(--muted)} .nowrap{white-space:nowrap}

.pill-btn{padding:8px 14px;border-radius:var(--btnr);border:1px solid var(--line);background:var(--chip);color:var(--ink);cursor:pointer}
.pill-btn.primary{background:var(--green);color:#001700;border-color:transparent}
.pill-btn[disabled]{opacity:.45;filter:grayscale(60%);pointer-events:none}

.badge{background:#141414;border:1px solid var(--line);padding:4px 8px;border-radius:var(--btnr);white-space:nowrap}
.badge.invert{background:var(--green);color:#001700;border-color:transparent}
.badge.premium-badge{background:#ffd166;color:#000;font-weight:700;border-color:#ffd166;box-shadow:0 0 0 1px #000 inset}

.info-box{
  background:#111;
  border:1px solid #2f2f2f;
  border-radius:10px;
  padding:10px 12px;
  color:#e6e6e6;
  margin:8px 0 12px;
  font-size:13px;
}

.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin:16px 0;box-shadow:var(--shadow)}
.card-head{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
.card-head h2{margin:0;font-size:18px;order:1}
.card-head .period{flex-basis:100%;order:2}
.card-head .context-row{flex-basis:100%;order:3}
.card-head .context-editor{flex-basis:100%;order:3;margin-top:4px}
.context-editor .ctx-row{display:flex;flex-wrap:wrap;gap:8px}
.context-editor .ctx-field{display:flex;flex-direction:column;font-size:12px;min-width:120px}
.context-editor .ctx-label{margin-bottom:2px;color:var(--muted)}
.context-editor select{background:#111;border:1px solid #333;color:var(--ink);border-radius:6px;padding:2px 6px;font-size:12px}
.ctx-sleep-inputs{display:flex;gap:4px;align-items:center}.ctx-unit{font-size:12px;color:var(--muted);margin:0 2px}


.card-head .actions{display:flex;gap:8px;align-items:center;margin-left:auto;order:4}

h2{margin:0;font-size:18px}

.vstack{display:flex;flex-direction:column}.hstack{display:flex;align-items:center}
.gap12{gap:12px}.gap8{gap:8px}.end{justify-content:flex-end}

.sparkline{width:100%;height:44px}
.today-block{background:#151515;border:1px solid var(--line);border-radius:14px;padding:10px}
.today-title{margin-bottom:6px}
.delta-row{display:flex;justify-content:space-between;align-items:center;margin-top:2px}
.delta{font-variant-numeric:tabular-nums;color:var(--blue)}.delta.neg{color:var(--red)}
.setlist{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.setpill{background:#141414;border:1px solid var(--line);padding:4px 8px;border-radius:var(--btnr);font-size:12px}
.setlist .pill{background:#141414;border:1px solid var(--line);padding:4px 8px;border-radius:var(--btnr);font-size:12px}


.ppr-summary-row{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:6px;
  font-size:13px;
  color:#cce7d4;
}
.ppr-trend-arrow{
  font-size:18px;
  line-height:1;
}
.ppr-trend-arrow.up{color:var(--green);}
.ppr-trend-arrow.down{color:#ff5b5b;}
.ppr-trend-arrow.flat{color:var(--muted);}
.ppr-trend-arrow.none{color:var(--muted);}
.ppr-summary{
  flex:1;
  min-width:0;
  white-space:nowrap;
  text-overflow:ellipsis;
  overflow:hidden;
}

.ppr-score-grid{
  display:flex;
  gap:6px;
  margin-bottom:4px;
}
.ppr-score-item{
  flex:1;
  padding:4px 6px;
  border-radius:6px;
  background:#111;
  border:1px solid #2a2d33;
  display:flex;
  flex-direction:column;
  gap:2px;
}
.ppr-score-label{
  font-size:11px;
  color:var(--muted);
}
.ppr-score-value{
  font-size:14px;
  font-weight:600;
  color:#eafff2;
}
.subrange-row{
  display:flex;
  justify-content:flex-start;
  margin-bottom:8px;
}
.ppr-wrap{display:grid;grid-template-columns:140px 1fr;gap:16px;align-items:center;margin:.5rem 0 1rem}
.ppr-circle{
  width:140px;
  height:140px;
  border-radius:50%;
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  background:conic-gradient(from 0deg, #1c1c1c 0deg 360deg);
}
.ppr-circle::before{
  content:"";
  position:absolute;
  inset:18px;
  border-radius:50%;
  background:#050505;
}
.ppr-circle span{position:relative;font-size:38px;font-weight:900;letter-spacing:1px;text-shadow:0 0 8px rgba(0,0,0,.85)}
.ppr-circle small{color:var(--muted)}
.ppr-why{background:#141414;border:1px solid var(--line);border-radius:12px;padding:10px}

.segmented{display:flex;background:#141414;border:1px solid var(--line);border-radius:var(--btnr);padding:3px}
.segmented button{background:transparent;border:none;color:#a9bad0;padding:6px 10px;border-radius:var(--btnr);cursor:pointer}
.segmented button.active{background:var(--green);color:#001700;font-weight:700}

.grid.comp-grid{display:grid;grid-template-columns:1fr;gap:12px}
.comp-card{background:#151515;border:1px solid var(--line);border-radius:12px;padding:10px}
.comp-card .label{display:flex;justify-content:space-between;align-items:center}

.grid.bp-grid{display:grid;grid-template-columns:1fr;gap:12px}
@media(min-width:680px){.grid.bp-grid{grid-template-columns:1fr 1fr}}
@media(min-width:920px){.grid.bp-grid{grid-template-columns:1fr 1fr 1fr}}
.bp-card{background:#151515;border:1px solid var(--line);border-radius:12px;padding:10px;min-width:0}
.bp-head{display:flex;justify-content:space-between;align-items:center;gap:8px}
.toggle{background:#131313;border:1px solid var(--line);border-radius:var(--btnr);padding:6px 8px;cursor:pointer;color:#fff}
.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:12px;margin-top:8px;display:none;max-height:220px}
table{width:100%;border-collapse:collapse;font-size:14px;min-width:560px}
th,td{padding:8px 10px;border-bottom:1px solid #1a2639;white-space:nowrap}
thead th{position:sticky;top:0;background:#141414;text-align:left}

.ai-box{margin-top:10px;background:#141414;border:1px solid var(--line);border-radius:12px;padding:10px;color:#cce7d4;box-shadow:inset 0 0 0 1px rgba(0,255,0,.08)}

.calorie-box{background:#151515;border:1px solid var(--line);border-radius:12px;padding:10px;margin-bottom:10px}
.modal{position:fixed;inset:0;z-index:20;display:none;align-items:center;justify-content:center;}
.modal.show{display:flex;}
.modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.65);}
.modal-dialog{position:relative;background:#111;border:1px solid #2f2f2f;border-radius:12px;box-shadow:0 18px 42px rgba(0,0,0,.6);padding:16px;min-width:280px;max-width:90%;z-index:1;}
.modal-header{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;}
.modal-title{font-size:16px;font-weight:700;}
.modal-body{font-size:14px;color:#d9e6ff;}
.modal-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px;}
.modal-close-btn{background:none;border:1px solid #333;color:var(--ink);border-radius:6px;padding:4px 8px;cursor:pointer;}
.cal-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:6px}
.cal-grid label{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cal-grid input,.cal-grid select{width:120px;background:#121212;border:1px solid var(--line);border-radius:var(--btnr);padding:6px;color:#fff}
.cal-ai .chk{display:flex;align-items:center;gap:6px}
.kpi{background:#141414;border:1px solid var(--line);border-radius:12px;padding:10px;min-width:120px;margin-top:8px}
.kpi .v{font-weight:800}

.day-card{background:#151515;border:1px solid var(--line);border-radius:12px;padding:10px}
.item-header{display:grid;grid-template-columns:1.4fr .7fr .6fr .6fr;gap:8px;color:var(--muted);font-size:12px;margin-top:4px}
.item-row{display:grid;grid-template-columns:1.4fr .7fr .6fr .6fr;gap:8px;align-items:center;margin-top:6px}
.item-row input{width:100%;background:#121212;border:1px solid var(--line);border-radius:var(--btnr);padding:8px;color:var(--ink)}

.toast{position:fixed;right:14px;bottom:84px;background:#112a18;color:#d5ffe0;border:1px solid #1d8e3d;padding:10px 12px;border-radius:10px;display:none}
.toast.show{display:block}

.container>.card:first-of-type{margin-top:4px}

/* --- Read-Only weekly plan block --- */
#sec-next-ro .day-row{display:flex;align-items:center;gap:12px;}
#sec-next-ro .day-label{min-width:2.5rem;font-weight:600;opacity:.9;}
#sec-next-ro .plan-text{flex:1;}
#sec-next-ro .pill{display:inline-block;padding:.15rem .5rem;border-radius:999px;border:1px solid rgba(0,255,0,.35);}


/* ---- 次週の提案：曜日コメント ---- */
.day-comment-wrap{
  margin-top:10px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

/* ===== FREEログ不足 teaser: blur only variable parts (DO NOT blur titles/labels) ===== */

/* Weekly: PPR circle + delta + numeric values + sparklines + range buttons */
#week-content.blurred .ppr-circle,
#week-content.blurred #ppr-summary-row,
#week-content.blurred .ppr-score-value,
#week-content.blurred #range-switch,
#week-content.blurred #comp-grid,
#week-content.blurred #bp-grid{
  filter: blur(6px);
  opacity: 0.55;
}

/* disable interactions only on blurred variable parts (titles remain clickable if any) */
#week-content.blurred #range-switch,
#week-content.blurred #comp-grid,
#week-content.blurred #bp-grid{
  pointer-events: none;
  user-select: none;
}

/* Retro (今週の振り返り): blur only the content box, not the section title */
#sec-retro.blurred #retro-box{
  filter: blur(6px);
  opacity: 0.55;
  pointer-events: none;
  user-select: none;
}

/* Proposal (次週の提案): blur only the editable inputs, textareas, selects, and buttons (keep headings/hints visible) */
#sec-proposal.blurred #proposal-editor input,
#sec-proposal.blurred #proposal-editor textarea,
#sec-proposal.blurred #proposal-editor select,
#sec-proposal.blurred #proposal-editor button,
#sec-proposal.blurred .hstack button {
  filter: blur(6px);
  opacity: 0.55;
  pointer-events: none;
  user-select: none;
}
.day-comment-label{
  font-size:12px;
  color:var(--muted);
}
.day-comment{
  width:100%;
  min-height:56px;
  padding:6px 8px;
  border-radius:var(--btnr);
  border:1px solid var(--line);
  background:#121212;
  color:var(--ink);
  font-size:12px;
  resize:vertical;
}
.comment-warning{
  font-size:11px;
  color:#ffc857;
}

/* AI 週次レポート（今週の振り返り） */
.ai-report-head {
  font-weight: 600;
  margin-bottom: 6px;
}

.ai-report-body {
  line-height: 1.7;
  white-space: pre-line;
}


/* AIレポート生成中の簡易スピナー */
.ai-loading{
  position: relative;
}
.ai-loading::after{
  content: "";
  display: inline-block;
  width: 0.8em;
  height: 0.8em;
  margin-left: 0.4em;
  border-radius: 50%;
  border: 2px solid currentColor;
  border-top-color: transparent;
  animation: ai-spin 0.8s linear infinite;
  vertical-align: -0.15em;
}
@keyframes ai-spin{
  to{ transform: rotate(360deg); }
}

/* 週次AIレポート表示時のフェードイン */
.ai-enter{
  animation: ai-fade-in 0.35s ease-out;
}

@keyframes ai-fade-in{
  from{
    opacity: 0;
    transform: translateY(6px);
  }
  to{
    opacity: 1;
    transform: translateY(0);
  }
}



/* --- FREE only: fixed CTA bar (upgrade) --- */
.upgrade-sticky{
  position:fixed;
  left:12px;
  right:12px;
  bottom:12px;
  z-index:999;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:rgba(18,18,18,0.92);
  backdrop-filter: blur(10px);
}
.upgrade-sticky-text{
  flex:1 1 auto;
  font-size:13px;
  line-height:1.25;
  color:var(--ink);
  opacity:0.95;
}
#upgrade-sticky-btn{
  flex:0 0 auto;
  white-space:nowrap;
}
.upgrade-sticky-close{
  flex:0 0 auto;
  width:32px;
  height:32px;
  border-radius:10px;
  border:1px solid var(--line);
  background:transparent;
  color:var(--ink);
  cursor:pointer;
  font-size:18px;
  line-height:1;
}
.upgrade-sticky-close:hover{ background:rgba(255,255,255,0.06); }
