/* Weekly journal — scoped to the Log tab and its entry sheet. */
#panel-log { --log-ink: #202820; --log-orange: #e75536; --log-paper: #faf9f5; }
#panel-log.on .log-hero, #panel-log.on #log-nudge, #panel-log.on .log-section-head { animation: logReveal .45s cubic-bezier(.2,.8,.2,1) backwards; }
#panel-log.on #log-nudge { animation-delay: .07s; }
#panel-log.on .log-section-head { animation-delay: .12s; }
@keyframes logReveal { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }

#panel-log .log-hero { border-radius: 23px; background: var(--log-orange); color: #fff; overflow: hidden; padding: 22px 27px 0; margin-bottom: 15px; position: relative; isolation: isolate; }
#panel-log .log-hero::after { content: ''; position: absolute; width: 275px; height: 275px; border: 1px solid rgba(255,255,255,.24); border-radius: 50%; right: -65px; top: -85px; box-shadow: 0 0 0 48px rgba(255,255,255,.045), 0 0 0 98px rgba(255,255,255,.03); z-index: -1; pointer-events: none; }
#panel-log .log-hero-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#panel-log .log-eyebrow, #panel-log .log-hero-index, #panel-log .log-section-index { font-size: 10px; font-weight: 800; letter-spacing: .15em; }
#panel-log .log-eyebrow { display: flex; align-items: center; gap: 8px; }
#panel-log .log-eyebrow-line { width: 17px; height: 2px; background: currentColor; }
#panel-log .log-hero-index { color: rgba(255,255,255,.65); }
#panel-log .log-hero-main { display: flex; justify-content: space-between; align-items: flex-end; gap: 15px; padding: 29px 0 30px; }
#panel-log .log-hero-copy { min-width: 0; position: relative; z-index: 1; }
#panel-log .log-hero h1 { font: 400 clamp(51px, 8.5vw, 78px)/.85 'Bebas Neue', Impact, sans-serif; letter-spacing: .015em; }
#panel-log .log-hero h1 em { font-style: normal; color: var(--log-ink); }
#panel-log .log-hero-copy p { font-size: 12px; line-height: 1.55; max-width: 350px; margin-top: 16px; color: #fff2ea; }
#panel-log .log-hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 18px; margin-top: 22px; }
#panel-log .log-hero-actions button { font: 700 12px 'DM Sans', sans-serif; cursor: pointer; transition: transform .22s, background .22s, color .22s; }
#panel-log .log-hero-primary { display: inline-flex; align-items: center; gap: 22px; height: 44px; padding: 0 15px; border-radius: 10px; border: 0; color: #fff; background: var(--log-ink); }
#panel-log .log-hero-primary span { font-size: 18px; font-weight: 400; }
#panel-log .log-hero-primary:hover { background: #3c4c3d; transform: translateY(-2px); }
#panel-log .log-hero-secondary { background: none; border: 0; color: #fff; padding: 8px 0; }
#panel-log .log-hero-secondary span { margin-left: 5px; font-size: 16px; }
#panel-log .log-hero-secondary:hover { color: var(--log-ink); transform: translateX(3px); }
#panel-log .log-hero-actions button:active { transform: scale(.97); }
#panel-log button:focus-visible { outline: 3px solid #202820; outline-offset: 3px; }
#panel-log .log-hero-art { flex: 0 0 154px; height: 178px; border: 1px solid rgba(255,255,255,.55); border-radius: 80px 80px 13px 13px; display: flex; align-items: center; justify-content: center; transform: rotate(6deg); position: relative; transition: transform .36s cubic-bezier(.2,.8,.2,1); }
#panel-log .log-hero-art:hover { transform: rotate(0deg) translateY(-3px); }
#panel-log .log-hero-art span { font: 400 38px/.77 'Bebas Neue', Impact, sans-serif; letter-spacing: .03em; text-align: center; color: #fff8f3; }
#panel-log .log-hero-art b { position: absolute; bottom: -14px; right: -10px; display: grid; place-items: center; width: 43px; height: 43px; border-radius: 50%; font: 400 25px 'DM Sans', sans-serif; color: var(--log-ink); background: #ffe7d8; }
#panel-log .stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 0 -27px; background: var(--log-ink); padding: 0 27px; }
#panel-log .stat { display: flex; align-items: baseline; gap: 10px; padding: 16px 8px 18px 0; border: 0; border-radius: 0; text-align: left; box-shadow: none; background: none; }
#panel-log .stat + .stat { border-left: 1px solid rgba(255,255,255,.16); padding-left: 25px; }
#panel-log .stat-n { font: 400 32px/1 'Bebas Neue', Impact, sans-serif; letter-spacing: .02em; color: #fff; margin: 0; }
#panel-log .stat-date { font-size: 24px; white-space: nowrap; }
#panel-log .stat-l { color: #aebaae; text-transform: none; font-size: 11px; letter-spacing: 0; }

#panel-log #log-nudge { margin-bottom: 29px; }
#panel-log .nudge { --nudge-color: #526f56; position: relative; border: 1px solid #dbe2d7; background: #f1f4eb; border-radius: 15px; padding: 15px 16px; margin: 0; gap: 13px; overflow: hidden; }
#panel-log .nudge::before { content: ''; position: absolute; width: 4px; top: 0; bottom: 0; left: 0; background: var(--nudge-color); }
#panel-log .nudge-icon { width: 40px; height: 40px; border-radius: 11px; background: #e3ebdc; color: var(--nudge-color); }
#panel-log .nudge-head { color: var(--log-ink); font-size: 14px; margin-bottom: 3px; }
#panel-log .nudge-sub { color: #6e786e; font-size: 11px; }
#panel-log .nudge-btn { background: var(--log-ink); color: #fff; border-radius: 9px; height: 38px; padding: 0 14px; }
#panel-log .nudge-btn:hover { background: #3c4c3d; }
#panel-log .nudge-start { --nudge-color: var(--log-orange); background: #fff4ed; border-color: #f2d5c7; }
#panel-log .nudge-start .nudge-icon { background: #ffe4d7; }
#panel-log .nudge-late { --nudge-color: #ba6631; background: #fff7ec; border-color: #f1dfca; }
#panel-log .nudge-late .nudge-icon { background: #fbe9d0; }
#panel-log .nudge-ready { --nudge-color: #437852; }
#panel-log .nudge-good { --nudge-color: #437852; }
#panel-log .nudge-wait { --nudge-color: #647268; }

#panel-log .log-section-head { display: flex; align-items: flex-end; gap: 16px; margin-bottom: 20px; }
#panel-log .log-section-index { color: var(--log-orange); }
#panel-log .log-section-head h2 { font: 400 36px/1 'Bebas Neue', Impact, sans-serif; letter-spacing: .025em; margin: 8px 0 5px; }
#panel-log .log-section-head h2 span { vertical-align: top; font: 800 11px 'DM Sans', sans-serif; letter-spacing: .04em; color: var(--log-orange); margin-left: 6px; }
#panel-log .log-section-head p { font-size: 12px; color: #849084; }
#panel-log .log-section-rule { flex: 1; border-bottom: 1px solid #d6ded4; margin-bottom: 7px; }
#panel-log #cards-list { position: relative; padding-left: 22px; }
#panel-log #cards-list::before { content: ''; position: absolute; left: 5px; top: 20px; bottom: 20px; width: 1px; background: #d5ded2; }
#panel-log .wcard { position: relative; border: 1px solid #dde3da; border-radius: 17px; background: #fff; padding: 20px; margin-bottom: 15px; box-shadow: none; animation: logCardIn .42s cubic-bezier(.2,.8,.2,1) backwards; animation-delay: calc(var(--log-order) * 45ms); transition: border-color .2s, box-shadow .2s, transform .2s; }
@keyframes logCardIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
#panel-log .wcard::before { content: ''; position: absolute; left: -22px; top: 27px; width: 11px; height: 11px; border-radius: 50%; border: 3px solid #e75536; background: #f7f6f4; }
#panel-log .wcard:hover { border-color: #b7c9b8; box-shadow: 0 10px 28px rgba(32,40,32,.07); transform: translateY(-2px); }
#panel-log .wcard-featured { border-color: #e6baa9; }
#panel-log .wcard-topline { display: flex; justify-content: space-between; color: #8d988b; font-size: 9px; letter-spacing: .12em; font-weight: 800; line-height: 1; }
#panel-log .wcard-latest { color: var(--log-orange); }
#panel-log .wcard-hdr { display: flex; align-items: center; gap: 14px; margin: 8px 0 18px; }
#panel-log .wbadge { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; flex: 1; min-width: 0; }
#panel-log .wnum { background: none; padding: 0; font: 400 36px/1 'Bebas Neue', Impact, sans-serif; letter-spacing: .02em; color: var(--log-ink); }
#panel-log .wdate { color: #7e8b7d; font-size: 12px; }
#panel-log .wactions { gap: 7px; }
#panel-log .icon-btn { width: 38px; height: 38px; border: 1px solid #e1e7dd; border-radius: 10px; background: #f8faf5; color: #5b6b5b; }
#panel-log .icon-btn:hover { background: #e8f0e4; color: var(--log-ink); border-color: #b9c9b6; }
#panel-log .icon-btn.del:hover { border-color: #e7aea1; background: #fff0eb; color: #b74a32; }
#panel-log .wcard-measure-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; border-top: 1px solid #e7ece4; padding-top: 15px; margin-bottom: 10px; color: #879286; font-size: 9px; letter-spacing: .12em; font-weight: 800; }
#panel-log .wmeas { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 8px; }
#panel-log .chip { display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; min-height: 74px; gap: 9px; padding: 11px; background: #f4f6f0; border: 1px solid transparent; border-radius: 10px; transition: background .18s, border-color .18s; }
#panel-log .chip:hover { background: #fff; border-color: #d6e0d3; }
#panel-log .chip-top { display: flex; align-items: center; gap: 6px; min-width: 0; }
#panel-log .chip-icon { display: grid; place-items: center; flex: 0 0 15px; color: #748774; }
#panel-log .chip-icon svg { width: 15px; height: 15px; fill: currentColor; }
#panel-log .chip-lbl { color: #728071; font-size: 10px; line-height: 1.2; }
#panel-log .chip-val { color: var(--log-ink); font: 400 25px/1 'Bebas Neue', Impact, sans-serif; }
#panel-log .chip-unit { font-size: 10px; color: #879486; }

#panel-log #empty-state { margin-left: 22px; padding: 35px 20px 40px; background: #fff; border: 1px dashed #c7d3c3; border-radius: 17px; }
#panel-log #empty-state .empty-icon { width: 64px; height: 64px; background: #ffece3; border-radius: 17px; margin-bottom: 16px; transform: rotate(-6deg); }
#panel-log #empty-state .empty-icon span { font: 400 31px 'Bebas Neue', Impact, sans-serif; color: var(--log-orange); }
#panel-log #empty-state h2 { font-size: 29px; color: var(--log-ink); }
#panel-log #empty-state p { font-size: 12px; color: #7e8b7d; }
#panel-log #empty-state button { margin-top: 17px; height: 42px; border: 0; border-radius: 10px; padding: 0 15px; background: var(--log-ink); color: #fff; font: 700 12px 'DM Sans', sans-serif; cursor: pointer; transition: transform .2s, background .2s; }
#panel-log #empty-state button:hover { background: #3c4c3d; transform: translateY(-2px); }

/* The entry sheet shares the journal's clean measurement rows. */
#overlay .modal { background: #fafbf7; border-radius: 23px 23px 0 0; }
#overlay .modal-hdr { padding: 17px 21px; border-bottom-color: #e0e7dd; }
#overlay .modal-title { font-size: 29px; color: #202820; }
#overlay .modal-body { padding: 18px 21px 12px; }
#overlay .field label { color: #667866; }
#overlay .field select, #overlay .field input[type=date] { border-color: #d8e1d6; background-color: #fff; }
#overlay .field select:focus, #overlay .field input[type=date]:focus { border-color: #e75536; box-shadow: 0 0 0 3px rgba(231,85,54,.12); }
#overlay .mrow { background: #f2f5ee; border: 1px solid #e4ebe0; min-height: 62px; border-radius: 11px; }
#overlay .mrow:focus-within { border-color: #e75536; background: #fff; }
#overlay .mrow-icon { width: 35px; height: 35px; border-radius: 9px; background: #ffe7dc; }
#overlay .mrow-icon svg { width: 19px; height: 19px; fill: #df5b3d; opacity: 1; }
#overlay .minp { background: #fff; border: 1px solid #dfe6da; border-radius: 8px; padding: 0 7px; width: 62px; text-align: center; }
#overlay .modal-foot { border-top-color: #e0e7dd; background: #fafbf7; }
#overlay .modal-foot .btn-save { background: #202820; box-shadow: none; }
#overlay .modal-foot .btn-save:hover { background: #3c4c3d; }

@media (min-width: 768px) { #overlay .modal { border-radius: 23px; } }
@media (max-width: 600px) {
  #panel-log .log-hero { padding: 19px 19px 0; border-radius: 19px; }
  #panel-log .log-hero-index { display: none; }
  #panel-log .log-hero-main { padding: 29px 0 26px; }
  #panel-log .log-hero h1 { font-size: clamp(47px, 12vw, 64px); }
  #panel-log .log-hero-copy p { max-width: 240px; font-size: 11px; }
  #panel-log .log-hero-actions { margin-top: 18px; gap: 5px 14px; }
  #panel-log .log-hero-primary { height: 40px; padding: 0 11px; gap: 9px; }
  #panel-log .log-hero-secondary { font-size: 11px !important; }
  #panel-log .log-hero-art { flex-basis: 99px; height: 126px; margin-left: -9px; }
  #panel-log .log-hero-art span { font-size: 26px; }
  #panel-log .log-hero-art b { width: 31px; height: 31px; font-size: 19px; bottom: -10px; right: -6px; }
  #panel-log .stats { margin: 0 -19px; padding: 0 19px; }
  #panel-log .stat { flex-direction: column; gap: 2px; padding: 13px 4px 15px 0; }
  #panel-log .stat + .stat { padding-left: 13px; }
  #panel-log .stat-n { font-size: 29px; }
  #panel-log .stat-date { font-size: 23px; }
  #panel-log .stat-l { font-size: 9px; }
  #panel-log .nudge { flex-wrap: wrap; padding: 14px 15px; }
  #panel-log .nudge-body { flex-basis: calc(100% - 56px); }
  #panel-log .nudge-btn { margin-left: 53px; }
  #panel-log .log-section-head h2 { font-size: 31px; }
  #panel-log .wcard { padding: 15px; }
  #panel-log .wmeas { grid-template-columns: repeat(2, minmax(0,1fr)); }
  #panel-log .chip { min-height: 67px; }
}
@media (max-width: 370px) {
  #panel-log .log-hero-art { display: none; }
  #panel-log .log-hero-copy p { max-width: 100%; }
  #panel-log .nudge-btn { margin-left: 0; width: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  #panel-log.on .log-hero, #panel-log.on #log-nudge, #panel-log.on .log-section-head, #panel-log .wcard, #overlay.on, #overlay .modal { animation: none !important; }
  #panel-log .log-hero-actions button, #panel-log .log-hero-art, #panel-log .wcard, #panel-log .chip, #panel-log #empty-state button { transition: none !important; }
}