:root{
  --bg:#1c1a1f; --bg-panel:#252229; --bg-panel-2:#2e2a33; --bg-hover:#35303b;
  --border:#3c3642; --border-soft:#322d38;
  --text:#ece7ea; --text-dim:#a89fae; --text-faint:#6f6777;
  --lavender:#a897c9; --clay:#c98b6e; --sage:#8fac8a; --amber:#d3ab61; --rose:#c07a8e;
  --font-mono:'JetBrains Mono', ui-monospace, Menlo, monospace;
  --font-sans:'Inter', system-ui, sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{background:var(--bg); color:var(--text); font-family:var(--font-sans); line-height:1.5; min-height:100vh; -webkit-font-smoothing:antialiased;}
::selection{background:var(--lavender); color:#1c1a1f;}

/* ---- auth screen ---- */
.auth-screen{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:20px;}
.auth-box{max-width:340px; width:100%; background:var(--bg-panel); border:1px solid var(--border-soft); border-radius:12px; padding:28px 24px; text-align:center;}
.auth-box .brand{font-family:var(--font-mono); font-size:18px; font-weight:700; margin-bottom:14px;}
.auth-box .subhint{margin-bottom:16px;}
.auth-msg{font-family:var(--font-mono); font-size:11.5px; color:var(--text-faint); margin-top:10px; min-height:14px;}

/* ---- topbar ---- */
.topbar{padding:18px 20px 14px; border-bottom:1px solid var(--border-soft); background:linear-gradient(180deg,#211e25 0%, var(--bg) 100%);}
.topbar-inner{max-width:980px; margin:0 auto; display:flex; align-items:baseline; justify-content:space-between; flex-wrap:wrap; gap:6px;}
.brand{font-family:var(--font-mono); font-size:18px; font-weight:700; letter-spacing:-.2px;}
.brand .dim{color:var(--text-faint); font-weight:400;}
.brand .cursor{display:inline-block; width:8px; height:14px; background:var(--lavender); margin-left:2px; vertical-align:-2px; animation:blink 1.1s steps(1) infinite;}
@keyframes blink{50%{opacity:0;}}
.tagline{font-family:var(--font-mono); font-size:11.5px; color:var(--text-faint);}
.topbar-right{display:flex; align-items:center; gap:10px;}
.datestamp{font-family:var(--font-mono); font-size:11px; color:var(--text-faint);}

/* ---- nav ---- */
nav.catnav{max-width:980px; margin:0 auto; display:flex; flex-wrap:wrap; gap:4px; padding:14px 20px 0;}
.tab{font-family:var(--font-mono); font-size:12px; white-space:nowrap; background:none; border:1px solid transparent; color:var(--text-dim); padding:8px 12px; border-radius:7px 7px 0 0; cursor:pointer; display:flex; align-items:center; gap:7px;}
.tab .dot{width:6px; height:6px; border-radius:50%; background:var(--text-faint); flex-shrink:0;}
.tab:hover{background:var(--bg-panel); color:var(--text);}
.tab.active{background:var(--bg-panel); color:var(--text); border-color:var(--border-soft); border-bottom-color:var(--bg-panel);}
.tab.active .dot{background:var(--sage); box-shadow:0 0 6px var(--sage);}

.pagenav-wrap{max-width:980px; margin:0 auto; padding:10px 20px 0;}
.page-tiles{display:flex; flex-wrap:wrap; gap:6px;}
.page-tile{font-family:var(--font-mono); font-size:12px; background:var(--bg-panel); color:var(--text-dim); border:1px solid var(--border-soft); border-radius:7px; padding:8px 12px; cursor:pointer; text-align:left;}
.page-tile:hover{background:var(--bg-hover); color:var(--text);}
.page-tile.active{background:var(--bg-panel-2); color:var(--text); border-color:var(--lavender);}
@media(max-width:520px){.page-tiles{flex-direction:column; gap:5px;} .page-tile{font-size:11.5px; padding:8px 10px; white-space:normal;}}

main{max-width:980px; margin:0 auto; padding:14px 20px 80px;}
.panel-box{background:var(--bg-panel); border:1px solid var(--border-soft); border-radius:10px; padding:24px 22px;}

h2{font-family:var(--font-mono); font-size:15px; margin:0 0 4px; display:flex; align-items:center; gap:8px;}
.subhint{color:var(--text-faint); font-size:12.5px; margin:0 0 18px;}
.section-block{margin-bottom:26px;}
.section-block:last-child{margin-bottom:4px;}
.group-title{font-family:var(--font-mono); font-size:11px; text-transform:uppercase; letter-spacing:.06em; color:var(--text-dim); margin:0 0 10px; display:flex; align-items:center; justify-content:space-between;}
.group-title-main{padding-right:10px;}
.group-title .count{color:var(--text-faint); font-weight:400; text-transform:none; letter-spacing:0;}
.group-keep-hint{font-family:var(--font-mono); font-size:10.5px; color:var(--text-faint); margin:-6px 0 10px;}

.progress-row{display:flex; align-items:center; gap:10px; margin-bottom:16px;}
.progress-track{flex:1; height:6px; background:var(--bg-panel-2); border-radius:4px; overflow:hidden; border:1px solid var(--border-soft);}
.progress-fill{height:100%; background:linear-gradient(90deg,var(--lavender),var(--sage)); width:0%; transition:width .25s ease;}
.progress-label{font-family:var(--font-mono); font-size:11px; color:var(--text-faint); white-space:nowrap;}

.gami-row{display:flex; align-items:center; gap:14px; background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:10px 13px;}
.gami-level{font-family:var(--font-mono); font-size:12px; color:var(--lavender); white-space:nowrap;}
.gami-streak{font-family:var(--font-mono); font-size:12px; color:var(--amber); white-space:nowrap;}

.companion-card{display:flex; align-items:center; gap:8px; background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:8px 13px; margin-top:8px; width:fit-content;}
/* Native cell is 192x208 (see assets/companion/pet-manifest.json); displayed at 96x104 (half
   scale, the atlas README's smallest recommended integer-ish size) to stay small/quiet per
   ticket 016. Antialiased illustration art, not pixel art — image-rendering stays auto. */
.companion-sprite{width:96px; height:104px; background-repeat:no-repeat; image-rendering:auto; flex-shrink:0;}
.companion-glyph{font-family:var(--font-mono); font-size:15px; color:var(--sage);}
.companion-sidekick{font-family:var(--font-mono); font-size:12px; color:var(--clay); margin-left:4px;}
.companion-status{font-family:var(--font-mono); font-size:11px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.04em;}

.sidequest-card{display:flex; align-items:center; gap:8px; flex-wrap:wrap; background:var(--bg-panel-2); border:1px solid var(--border-soft); border-left:3px solid var(--clay); border-radius:8px; padding:10px 12px;}
.sidequest-text{flex:1; min-width:180px;}
.sidequest-text[readonly]{background:transparent; border-color:transparent; color:var(--text-dim); cursor:default;}
.sidequest-actions{display:flex; gap:6px;}

.item, .focus-done-row{display:flex; align-items:flex-start; gap:10px; padding:8px; border-radius:6px; cursor:pointer; font-size:13.5px;}
.item:hover, .focus-done-row:hover{background:var(--bg-hover);}
.item input[type=checkbox], .focus-done-row input[type=checkbox]{appearance:none; width:16px; height:16px; min-width:16px; margin-top:2px; border:1.5px solid var(--text-faint); border-radius:4px; cursor:pointer; position:relative; background:transparent;}
.item input[type=checkbox]:checked, .focus-done-row input[type=checkbox]:checked{background:var(--sage); border-color:var(--sage);}
.item input[type=checkbox]:checked::after, .focus-done-row input[type=checkbox]:checked::after{content:''; position:absolute; left:4px; top:1px; width:4px; height:8px; border:solid #1c1a1f; border-width:0 2px 2px 0; transform:rotate(45deg);}
.item span.done{color:var(--text-faint); text-decoration:line-through;}
.focus-done-row{padding:6px 8px; margin-bottom:8px; color:var(--text-dim);}
.focus-done-row span{padding-top:1px;}

.btn{font-family:var(--font-mono); font-size:11px; background:var(--bg-panel-2); color:var(--text-dim); border:1px solid var(--border); padding:7px 12px; border-radius:6px; cursor:pointer;}
.btn:hover{background:var(--bg-hover); color:var(--text);}
.btn.accent{border-color:var(--lavender); color:var(--lavender);}
.btn:disabled{opacity:.55; cursor:not-allowed;}
.btn:disabled:hover{background:var(--bg-panel-2); color:var(--text-dim);}

.info{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-left:3px solid var(--lavender); border-radius:6px; padding:11px 13px; font-size:12.5px; color:var(--text-dim); margin-bottom:18px;}
.warn{border-left-color:var(--rose);}
.warn strong{color:var(--rose);}

table.ref{width:100%; border-collapse:collapse; font-size:12.5px; margin-bottom:6px;}
table.ref th{text-align:left; font-family:var(--font-mono); font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--text-faint); border-bottom:1px solid var(--border); padding:6px 8px;}
table.ref td{border-bottom:1px solid var(--border-soft); padding:8px; vertical-align:top; color:var(--text-dim);}
table.ref td.safe{color:var(--sage);} table.ref td.avoid{color:var(--rose);}
table.ref tr:last-child td{border-bottom:none;}

.zone-grid{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
@media(max-width:640px){.zone-grid{grid-template-columns:1fr;} .daily-grid{grid-template-columns:1fr !important;}}
.zone-card{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:14px 15px;}
.zone-card h3{font-family:var(--font-mono); font-size:12.5px; margin:0 0 8px;}
.zone-card ul{margin:0; padding-left:18px; font-size:12.5px; color:var(--text-dim);}
.zone-card li{margin-bottom:5px;}

textarea.note{width:100%; min-height:70px; background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:7px; color:var(--text); font-family:var(--font-sans); font-size:13px; padding:10px 12px; resize:vertical;}
textarea.note:focus{outline:none; border-color:var(--lavender);}
.text-input{width:100%; background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:7px; color:var(--text); font-family:var(--font-sans); font-size:13px; padding:9px 11px;}
.text-input:focus{outline:none; border-color:var(--lavender);}

.stat-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); gap:10px;}
.stat-card{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:12px 13px; cursor:pointer;}
.stat-card:hover{border-color:var(--lavender);}
.stat-card .label{font-family:var(--font-mono); font-size:10.5px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.04em; margin-bottom:6px;}
.stat-card .value{font-family:var(--font-mono); font-size:18px;}
.stat-card .value .of{color:var(--text-faint); font-size:13px;}
.keydate-card{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-left:3px solid var(--amber); border-radius:8px; padding:12px 13px;}
.keydate-count{font-family:var(--font-mono); font-size:16px; color:var(--amber); margin-bottom:2px;}
.keydate-label{font-size:13.5px; color:var(--text);}
.keydate-date,.keydate-empty{font-family:var(--font-mono); font-size:11px; color:var(--text-faint); margin-top:4px;}
.deadline-card{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-left:3px solid var(--rose); border-radius:8px; padding:12px 13px;}
.deadline-count{font-family:var(--font-mono); font-size:18px; color:var(--rose); margin-bottom:2px;}
.deadline-count.overdue{color:var(--amber);}
.deadline-label{font-size:13.5px; color:var(--text);}
.deadline-date,.deadline-empty{font-family:var(--font-mono); font-size:11px; color:var(--text-faint); margin-top:4px;}

.footer-note{max-width:980px; margin:24px auto 0; padding:0 20px 30px; color:var(--text-faint); font-size:11.5px; font-family:var(--font-mono);}

/* addable list */
.al-row{display:flex; align-items:center; gap:8px; margin-bottom:8px; flex-wrap:wrap;}
.al-row.al-done .al-field{color:var(--text-faint); text-decoration:line-through;}
.al-row .al-field{flex:1; min-width:110px;}
.al-row .al-mood{display:inline-flex; gap:4px; font-size:17px;}
.al-image{display:flex; align-items:center; gap:8px; flex-wrap:wrap; width:100%; margin-top:2px;}
.al-image-preview{width:74px; height:52px; background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:6px; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.al-image-preview .subhint{margin:0; padding:6px; text-align:center;}
.al-image-img{width:100%; height:100%; object-fit:cover; display:block;}
.al-image-pick input,.daily-image-actions input{display:none;}
.al-del{background:none; border:none; color:var(--text-faint); font-size:16px; cursor:pointer; padding:4px 8px;}
.al-del:hover{color:var(--rose);}
.al-check{width:16px; height:16px; accent-color:var(--sage); flex-shrink:0;}
.al-group{margin-bottom:18px;}
.al-group-title{font-family:var(--font-mono); font-size:12px; color:var(--text-dim); text-transform:uppercase; letter-spacing:.04em; margin:0 0 8px;}
.al-ref-select{flex:1; min-width:150px;}

/* project tracker */
.project-card{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:10px; padding:14px 15px; margin-bottom:14px;}
.project-card-head{display:flex; align-items:center; gap:8px; margin-bottom:10px; flex-wrap:wrap;}
.project-title{flex:1; min-width:140px; font-family:var(--font-mono);}
.project-priority{font-family:var(--font-mono); font-size:11px; background:var(--bg-panel); color:var(--text-dim); border:1px solid var(--border-soft); border-radius:6px; padding:7px 8px;}
.project-notes{min-height:44px; margin-top:10px;}
.project-image-actions{display:flex; align-items:center; gap:8px; margin-top:8px; flex-wrap:wrap;}
.project-image-actions input{display:none;}
.project-image-attach{width:34px; height:30px; padding:0; text-align:center;}
.project-image-hint{font-family:var(--font-mono); font-size:10.5px; color:var(--text-faint);}
.project-images{display:flex; gap:10px; flex-wrap:wrap; margin-top:10px;}
.project-image-item{position:relative; width:min(190px,100%);}
.project-image-thumb{width:100%; aspect-ratio:4 / 3; background:var(--bg); border:1px solid var(--border); border-radius:6px; padding:0; overflow:hidden; cursor:pointer; display:flex; align-items:center; justify-content:center;}
.project-image-thumb:hover{border-color:var(--lavender);}
.project-image-img{width:100%; height:100%; object-fit:cover; display:block;}
.project-image-remove{position:absolute; top:5px; right:5px; width:24px; height:24px; border-radius:999px; border:1px solid var(--border); background:rgba(28,26,31,.9); color:var(--text-dim); font-family:var(--font-mono); font-size:12px; line-height:1; cursor:pointer;}
.project-image-remove:hover{color:var(--rose); border-color:var(--rose);}
.project-tasks{margin-top:10px;}
.project-task-row{display:flex; align-items:center; gap:8px; margin-bottom:6px;}
.project-task-row .project-task-check{width:16px; height:16px; accent-color:var(--sage); flex-shrink:0;}
.project-task-row .project-task-text{flex:1;}
.project-task-del, .project-del{background:none; border:none; color:var(--text-faint); font-size:16px; cursor:pointer; padding:4px 8px;}
.project-task-del:hover, .project-del:hover{color:var(--rose);}

/* form */
.form-grid{display:flex; flex-direction:column; gap:14px;}
.form-field label{display:block; font-family:var(--font-mono); font-size:11px; color:var(--text-faint); text-transform:uppercase; letter-spacing:.04em; margin-bottom:6px;}

/* month notes grid */
.month-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:12px;}
@media(max-width:640px){.month-grid{grid-template-columns:1fr 1fr;}}
.month-cell textarea{min-height:60px;}

/* calendar */
.cal-year-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:14px;}
@media(max-width:760px){.cal-year-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:480px){.cal-year-grid{grid-template-columns:1fr;}}
.cal-month{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:10px;}
.cal-month-title{font-family:var(--font-mono); font-size:11.5px; margin-bottom:8px; color:var(--text);}
.cal-grid{display:grid; grid-template-columns:repeat(7,1fr); gap:2px; text-align:center;}
.cal-dow{font-family:var(--font-mono); font-size:9.5px; color:var(--text-faint); padding:2px 0;}
.cal-cell{font-size:11px; color:var(--text-dim); padding:4px 0; border-radius:4px;}
.cal-cell.empty{visibility:hidden;}
.cal-date{position:relative; width:100%; min-height:24px; border:1px solid transparent; background:none; font-family:var(--font-sans); cursor:pointer;}
button.cal-date{appearance:none;}
.cal-date:hover{background:var(--bg-hover); color:var(--text);}
.cal-date:focus-visible{outline:2px solid var(--lavender); outline-offset:1px;}
.cal-date.has-daily-entry{border-color:var(--border); color:var(--text);}
.cal-entry-dot{position:absolute; left:50%; bottom:2px; width:4px; height:4px; border-radius:50%; background:var(--sage); transform:translateX(-50%);}
.cal-keydate-corner{position:absolute; top:2px; right:2px; width:0; height:0; border-top:6px solid var(--amber); border-left:6px solid transparent;}
.cal-wrap{max-width:320px; margin-bottom:6px;}

/* daily/weekly/monthly planner */
.daily-nav{display:flex; align-items:center; gap:10px; margin-bottom:18px; flex-wrap:wrap;}
.daily-title{font-family:var(--font-mono); font-size:13px; flex:1; text-align:center; min-width:160px;}
.daily-grid{display:grid; grid-template-columns:1fr 1fr; gap:24px;}
.priority-row{display:flex; align-items:center; gap:8px; margin-bottom:6px;}
.priority-row .text-input{flex:1;}
.priority-done{appearance:none; width:16px; height:16px; min-width:16px; border:1.5px solid var(--text-faint); border-radius:4px; cursor:pointer; position:relative; background:transparent;}
.priority-done:checked{background:var(--sage); border-color:var(--sage);}
.priority-done:checked::after{content:''; position:absolute; left:4px; top:1px; width:4px; height:8px; border:solid #1c1a1f; border-width:0 2px 2px 0; transform:rotate(45deg);}
.mission-success{align-items:center; gap:10px; justify-content:space-between; background:var(--bg-panel-2); border:1px solid var(--sage); border-radius:8px; padding:9px 12px; margin-bottom:10px; color:var(--sage); font-family:var(--font-mono); font-size:12px; animation:mission-glow .6s ease;}
@keyframes mission-glow{from{box-shadow:0 0 0 3px rgba(143,172,138,.35);} to{box-shadow:0 0 0 0 rgba(143,172,138,0);}}
.pomodoro-box{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:10px; margin-top:10px;}
.pomodoro-controls{display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px;}
.pomodoro-controls label{font-family:var(--font-mono); font-size:11px; color:var(--text-faint); display:flex; align-items:center; gap:6px;}
.pomodoro-controls input{width:72px; padding:6px 8px;}
.pomodoro-panel{border-top:1px solid var(--border-soft); padding-top:8px; min-height:44px;}
.pomodoro-time{font-family:var(--font-mono); font-size:20px; color:var(--lavender);}
.pomodoro-time.done{color:var(--sage);}
.pomodoro-task,.pomodoro-idle{font-size:12.5px; color:var(--text-dim);}
.daily-image-box{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:10px; display:flex; gap:10px; align-items:flex-start; flex-wrap:wrap;}
.daily-image-grid{display:flex; gap:10px; flex-wrap:wrap; flex:1; min-width:min(280px,100%);}
.daily-image-item{position:relative; width:min(170px,100%);}
.daily-image-preview{width:min(220px,100%); aspect-ratio:4 / 3; background:var(--bg); border:1px solid var(--border); border-radius:6px; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.daily-image-item .daily-image-preview{width:100%; cursor:pointer; padding:0;}
.daily-image-item .daily-image-preview:hover{border-color:var(--lavender);}
.daily-image-preview .subhint{margin:0; padding:8px; text-align:center;}
.daily-image-img{width:100%; height:100%; object-fit:cover; display:block;}
.daily-image-remove{position:absolute; top:5px; right:5px; width:24px; height:24px; border-radius:999px; border:1px solid var(--border); background:rgba(28,26,31,.9); color:var(--text-dim); font-family:var(--font-mono); font-size:12px; line-height:1; cursor:pointer;}
.daily-image-remove:hover{color:var(--rose); border-color:var(--rose);}
.daily-image-actions{display:flex; gap:8px; flex-wrap:wrap; align-items:center;}
.daily-image-hint{font-family:var(--font-mono); font-size:10.5px; color:var(--text-faint);}
.schedule-list{display:flex; flex-direction:column; gap:6px;}
.schedule-row{display:flex; align-items:center; gap:8px;}
.schedule-time{font-family:var(--font-mono); font-size:11px; color:var(--text-faint); width:44px; flex-shrink:0;}
.water-row, .mood-row, .dot-row{display:flex; gap:8px; font-size:20px;}
.water-cup, .mood-pick, .dot-pick, .star-pick{cursor:pointer; opacity:.5; transition:opacity .15s, transform .1s;}
.water-cup{color:var(--lavender);}
.dot-pick{color:var(--sage); font-size:16px;}
.star-pick{color:var(--amber); font-size:18px;}
.mood-pick.picked, .dot-pick.picked, .star-pick.picked, .water-cup{opacity:1;}
.mood-pick{opacity:.4;}
.mood-pick.picked{opacity:1; transform:scale(1.15);}

/* vision board */
.vision-grid{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:14px; margin-top:14px;}
.vision-card{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:8px; display:flex; flex-direction:column; gap:6px;}
.vision-img-wrap{width:100%; aspect-ratio:1; background:#1c1a1f; border-radius:6px; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.vision-img{width:100%; height:100%; object-fit:cover;}

/* feed */
.feed-composer{margin-bottom:20px;}
.feed-composer-row{display:flex; align-items:center; gap:10px; margin-top:8px; flex-wrap:wrap;}
.feed-composer-row input[type=file]{font-size:11px; color:var(--text-faint); max-width:180px;}
.feed-doodle{margin-top:10px; background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:10px;}
.feed-doodle-toolbar{display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:8px; flex-wrap:wrap;}
.feed-tool-group{display:flex; align-items:center; gap:6px; flex-wrap:wrap;}
.doodle-swatch{width:24px; height:24px; border-radius:50%; border:1px solid var(--border); background:var(--swatch); cursor:pointer; padding:0;}
.doodle-swatch:hover,.doodle-swatch.active{outline:2px solid var(--text-dim); outline-offset:2px;}
.doodle-brush{width:31px; height:28px; padding:0; text-align:center;}
.doodle-brush.active,.doodle-tool.active{border-color:var(--lavender); color:var(--lavender);}
.feed-doodle-canvas{display:block; width:100%; aspect-ratio:5 / 2; max-height:260px; background:var(--bg-panel-2); border:1px solid var(--border); border-radius:6px; cursor:crosshair; touch-action:none;}
.feed-post{background:var(--bg-panel-2); border:1px solid var(--border-soft); border-radius:8px; padding:12px 14px; margin-bottom:10px; position:relative;}
.feed-time{font-family:var(--font-mono); font-size:10.5px; color:var(--text-faint); margin-bottom:6px;}
.feed-body{font-size:13.5px; white-space:pre-wrap; margin-bottom:8px;}
.feed-img{max-width:100%; border-radius:6px; display:block; margin-bottom:8px; cursor:zoom-in;}
.feed-img:focus-visible{outline:2px solid var(--lavender); outline-offset:2px;}
.feed-del{position:absolute; top:10px; right:12px; background:none; border:none; color:var(--text-faint); font-family:var(--font-mono); font-size:10px; cursor:pointer;}
.feed-del:hover{color:var(--rose);}
@media(max-width:520px){
  .feed-doodle-toolbar{align-items:flex-start; flex-direction:column;}
  .feed-doodle-canvas{aspect-ratio:4 / 3;}
}

/* week grid (meal planner) */
.week-grid-wrap{overflow-x:auto;}
table.week-grid-table{width:100%; border-collapse:collapse;}
table.week-grid-table th{font-family:var(--font-mono); font-size:10.5px; color:var(--text-faint); text-transform:uppercase; padding:6px; text-align:left;}
table.week-grid-table td{padding:4px; min-width:120px;}
.wg-day{font-family:var(--font-mono); font-size:11px; color:var(--text-dim); white-space:nowrap;}

/* shared image zoom modal */
.media-modal{position:fixed; inset:0; z-index:50; background:rgba(12,11,14,.92); display:flex; align-items:center; justify-content:center; padding:22px; touch-action:none;}
.media-modal-inner{position:relative; width:100%; height:100%; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.media-modal-img{max-width:100%; max-height:100%; object-fit:contain; transform-origin:center; transition:transform .05s linear;}
.media-modal-close{position:absolute; top:8px; right:8px; z-index:1; width:34px; height:34px; border-radius:999px; border:1px solid var(--border); background:var(--bg-panel); color:var(--text-dim); font-family:var(--font-mono); cursor:pointer;}
.media-modal-close:hover{color:var(--text); border-color:var(--lavender);}