/* Shared surfaces. Keep existing geometry, image crops, drag behavior and writing canvases. */
:root {
  --flow-raised-surface: linear-gradient(145deg,#2c2f35,#1d1f24 68%,#191b1f);
  --flow-panel-shadow: inset 0 1px 0 #ffffff18, inset 0 0 0 1px #ffffff0d, 0 4px 8px #0006, 0 16px 28px -8px #000b;
}
:where(.app-shell, #modal) :is(.card,.task-list,.event-card,.scorecard-block,.area-scorecard,.together-list,.life-routine-row) {
  background:var(--flow-raised-surface);
  box-shadow:var(--flow-panel-shadow);
}
:where(.app-shell) :is(.area-card,.area-header,.rhythm-card,.library-collection,.resource-card,.build-together-card,.kingdom-vision,.focus-card) {
  box-shadow:var(--flow-panel-shadow);
}
.app-shell .area-card { border:1px solid #bca66e72; }
.app-shell .area-card .area-name { text-shadow:0 2px 9px #000d; }
.app-shell .goal-card { border:1px solid #ffd16b; box-shadow:var(--flow-panel-shadow); }
.app-shell .board .task-list { background:transparent; box-shadow:none; overflow:visible; }
.app-shell .board .board-card { background:var(--flow-raised-surface); box-shadow:var(--flow-panel-shadow); }
.app-shell .scorecard-routine { box-shadow:inset 0 1px 0 #ffffff0d,0 4px 10px #0005; }
.app-shell .record-row>.note-card { background:var(--flow-raised-surface); box-shadow:var(--flow-panel-shadow); border-radius:12px; }
/* The note editor itself stays a clean black writing surface. */
#note-screen,[contenteditable] { --flow-writing-surface:#000; }

/* Add bloom to every actual gold border, preserving each component's existing shadow. */
[data-flow-gold="panel"] {
  box-shadow:var(--flow-base-shadow,0 0 0 0 transparent),0 0 6px #ffd16b70,0 0 18px #ffc24f38,0 0 30px #efb2391c !important;
}
[data-flow-gold="control"] {
  box-shadow:var(--flow-base-shadow,0 0 0 0 transparent),0 0 5px #ffd16b65,0 0 12px #efb23930 !important;
}

/* A focused goal workspace: goal and progress first, one primary next action. */
#modal.goal-dialog { width:min(640px,calc(100% - 24px)); max-width:640px; }
#modal.goal-dialog .sheet { padding:0; }
#modal.goal-dialog .sheet>header { margin:0; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:4; padding:16px 20px 12px; border-bottom:1px solid #ffffff12; }
#modal.goal-dialog #modal-title { font-size:18px; line-height:1.35; letter-spacing:-.02em; }
#modal.goal-dialog #modal-body { padding:18px 20px 24px; }
.goal-focus { padding:20px; background:linear-gradient(135deg,#30291c,#1d1e22 65%); border:1px solid #ffd16b; border-radius:18px; box-shadow:var(--flow-panel-shadow); margin:0 0 20px; }
.goal-focus-top { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:12px; }
.goal-focus-state { color:#ead2a1; font-size:12px; text-align:right; }
.goal-focus h3 { font-size:clamp(22px,5.6vw,30px); line-height:1.22; overflow-wrap:anywhere; letter-spacing:-.035em; }
.goal-focus-date { display:block; margin-top:8px; font-size:13px; color:#c9c1b2; }
.goal-focus-progress { display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin:20px 0 10px; }
.goal-focus-progress strong { font-size:36px; line-height:1; color:#ffdc8b; letter-spacing:-.045em; }
.goal-focus-progress small { text-align:right; color:#d1c7b3; font-size:13px; line-height:1.4; }
.goal-focus .gold-goal-track { margin:0; }
.goal-focus .goal-primary-action { margin-top:18px; width:100%; min-height:48px; font-size:16px; font-weight:750; }
.goal-values { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:16px 0 0; }
.goal-values span { display:block; font-size:11px; color:#bcb6aa; }
.goal-values b { display:block; font-size:15px; color:#f4ebda; overflow-wrap:anywhere; margin-top:4px; }
.goal-view-tools { display:flex; justify-content:flex-end; margin:0 0 8px; }
.goal-section { margin:20px 0; }
.goal-section h3 { font-size:18px; margin-bottom:10px; }
.goal-section .goal-targets { display:grid; gap:8px; }
.goal-section .task-row { border-radius:12px; background:var(--flow-raised-surface); box-shadow:inset 0 1px 0 #ffffff10,0 5px 12px #0005; }
.goal-section .task-title { font-weight:650; }
.goal-section .task-row>.icon-btn { color:#b7b0a3; }
.goal-milestone-item { display:flex; gap:12px; align-items:flex-start; background:var(--flow-raised-surface); border-radius:12px; padding:13px 14px; margin:8px 0; }
.goal-milestone-item>span:first-child { display:grid; place-items:center; border:1px solid #8b8067; border-radius:50%; width:25px; height:25px; flex:0 0 25px; color:#ffda7c; }
.goal-milestone-item.is-done>span:first-child { border-color:#ffcf61; background:#ffcf6120; }
.goal-milestone-item b { display:block; font-size:15px; line-height:1.45; overflow-wrap:anywhere; }
.goal-milestone-item small { display:block; color:#bab5aa; font-size:13px; margin-top:4px; white-space:pre-wrap; overflow-wrap:anywhere; }
.goal-fold { border-top:1px solid #ffffff16; margin-top:14px; padding-top:4px; }
.goal-fold>summary { min-height:48px; padding:12px 0; color:#e2cfaa; font-size:14px; font-weight:650; cursor:pointer; }
.goal-fold p { font-size:14px; line-height:1.6; color:#c1bdb5; white-space:pre-wrap; overflow-wrap:anywhere; }
.goal-add-step { border:1px solid #ba96504d; border-radius:14px; padding:0 14px; background:#202125; margin:14px 0; }
.goal-add-step>summary { color:#ffda80; }
.goal-add-step form { padding:0 0 14px; }
.goal-add-step .form-actions { margin-top:12px; }
.goal-add-step [type=submit] { flex:1; }
.goal-empty-next { color:#c8c1b4; font-size:14px; line-height:1.55; padding:4px 0 10px; }
.goal-body .linked-actions { margin:0; padding:0; border:0; }
.goal-body .linked-actions>.btn { display:block; width:100%; text-align:left; margin:8px 0; }
.goal-body .linked-actions .fields { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }

/* Goal editor. Native fields and save handlers are retained in a simpler structure. */
.goal-editor-intro { margin:0 0 18px; font-size:14px; color:#c8c1b4; line-height:1.55; }
 #modal.goal-dialog .goal-editor fieldset.form-section { border:0; border-radius:0; padding:0; margin:0 0 24px; background:transparent; box-shadow:none; min-width:0; }
 #modal.goal-dialog .goal-editor fieldset.form-section>legend { font-size:17px; font-weight:750; padding:0; margin:0 0 12px; color:#f5eedf; }
 #modal.goal-dialog .goal-editor .field { margin:0 0 14px; min-width:0; }
 #modal.goal-dialog .goal-editor .field>span { display:block; color:#dcd4c5; font-size:14px; line-height:1.4; margin-bottom:7px; }
 #modal.goal-dialog .goal-editor :is(input:not([type=radio]):not([type=checkbox]),select,textarea) { width:100%; font-size:16px; min-height:48px; background:#15171b; border-color:#ffffff24; }
 #modal.goal-dialog .goal-editor :is(input,select,textarea):focus { border-color:#ffcf61; outline:2px solid #ffcf6155; outline-offset:2px; }
 #modal.goal-dialog .goal-editor textarea { min-height:88px; }
.goal-track-choices { display:grid; gap:9px; }
.goal-track-choice { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid #ffffff24; border-radius:12px; background:#22252a; cursor:pointer; min-height:64px; }
.goal-track-choice:has(input:checked) { border-color:#ffcf61; background:linear-gradient(130deg,#373020,#252529); }
.goal-track-choice input { width:20px; height:20px; flex:0 0 20px; accent-color:#ffcf61; margin:0; }
.goal-track-choice b { display:block; font-size:15px; font-weight:750; color:#f5eedf; }
.goal-track-choice small { display:block; font-size:13px; line-height:1.4; margin-top:3px; color:#c0bcb3; }
.goal-track-help { margin:12px 0 0; color:#c7bdab; font-size:13px; line-height:1.5; }
 #modal.goal-dialog .goal-editor .goal-numeric { margin-top:16px; }
 #modal.goal-dialog .goal-editor .goal-numeric>.fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; }
 #modal.goal-dialog .goal-editor .goal-numeric .field[data-goal-field=current] { grid-column:1/-1; }
 #modal.goal-dialog .goal-editor .goal-numeric input[name=current] { font-size:26px; font-weight:750; color:#ffdf96; min-height:60px; }
 #modal.goal-dialog .goal-editor .goal-milestones { margin-top:14px; }
 #modal.goal-dialog .goal-editor .step-edit-row { background:#202227; border-color:#ffffff20; border-radius:13px; margin:9px 0; padding:10px 12px; }
 #modal.goal-dialog .goal-editor .step-title-row { align-items:center; gap:9px; }
 #modal.goal-dialog .goal-editor .step-title-row [data-step-title] { font-size:16px; line-height:1.35; width:100%; background:#15171b; padding:10px; }
 #modal.goal-dialog .goal-editor .step-title-row [data-step-done] { flex:0 0 22px; }
 #modal.goal-dialog .goal-editor .step-title-row [data-step-action=remove] { flex:0 0 44px; }
 #modal.goal-dialog .goal-editor .milestone-extra { margin-top:5px; }
 #modal.goal-dialog .goal-editor .milestone-extra summary { font-size:13px; color:#c8b587; min-height:44px; padding:10px 0; }
 #modal.goal-dialog .goal-editor .milestone-extra textarea { margin:0; }
 #modal.goal-dialog .goal-editor .milestone-extra .step-order { margin-top:4px; }
 #modal.goal-dialog .goal-editor .milestone-check-view { display:flex; align-items:center; gap:12px; min-height:48px; font-size:16px; font-weight:650; }
 #modal.goal-dialog .goal-editor .milestone-check-view>span { overflow-wrap:anywhere; }
 #modal.goal-dialog .goal-editor .milestone-check-view input { width:24px; height:24px; accent-color:#ffcf61; }
 #modal.goal-dialog .goal-editor .goal-extra-fields { margin:10px 0 20px; }
 #modal.goal-dialog .goal-editor .form-actions { gap:10px; padding:14px 0 0; margin:16px 0 0; border-top:1px solid #ffffff14; }
 #modal.goal-dialog .goal-editor .form-actions button { min-height:48px; font-size:15px; }
 #modal.goal-dialog .goal-editor .form-actions [type=submit] { flex:1; font-weight:800; }
 #modal.goal-dialog .goal-editor .goal-danger-zone { margin-top:18px; }
 #modal.goal-dialog .goal-editor .goal-danger-zone>summary { color:#bab4a9; font-size:13px; }
 #modal.goal-dialog .goal-editor .form-error:not(:empty) { background:#3b2425; color:#ffd3cf; border-radius:10px; padding:12px; margin-top:12px; line-height:1.5; }
 #modal.goal-dialog .goal-editor .goal-progress-context { padding:15px; margin-bottom:18px; border:1px solid #e8bd6659; border-radius:14px; background:#26231d; }
 #modal.goal-dialog .goal-editor .goal-progress-context strong { display:block; font-size:19px; line-height:1.35; color:#f6eddd; overflow-wrap:anywhere; }
 #modal.goal-dialog .goal-editor .goal-progress-context p { font-size:13px; line-height:1.55; color:#ccbfa6; margin-top:7px; }
 #modal.goal-dialog .goal-editor.mode-progress .goal-numeric { margin-top:0; }
 #modal.goal-dialog .goal-editor.mode-progress .goal-numeric>.fields { display:block; }
 #modal.goal-dialog .goal-editor.mode-progress .goal-milestones { margin:0; }
 #modal.goal-dialog .goal-editor.mode-progress .steps-builder { margin:0; }
@media(max-width:600px) {
  #modal.goal-dialog { width:calc(100% - 16px); max-width:100%; margin:0 auto; border-radius:18px; }
  #modal.goal-dialog .sheet>header { margin:0; display:flex; align-items:center; justify-content:space-between; position:sticky; top:0; z-index:4; padding:13px 16px 10px; }
  #modal.goal-dialog #modal-body { padding:16px 16px calc(22px + env(safe-area-inset-bottom)); }
  .goal-focus { padding:17px; }
}
@media(prefers-reduced-motion:reduce) { .goal-track-choice { transition:none; } }
@media(forced-colors:active) {
  [data-flow-gold] { box-shadow:none!important; outline:1px solid CanvasText; }
  .goal-track-choice:has(input:checked) { outline:2px solid Highlight; }
}

#modal.goal-dialog .goal-editor>.goal-fold { margin:12px 0; padding:0 12px; background:#1b1e22; border:1px solid #ffffff1f; }
#modal.goal-dialog .goal-editor>.goal-danger-zone { margin-top:18px; }
#modal.goal-dialog .goal-add-step .form-actions { max-width:none; }

/* Goal action editor: ordered, detailed and explicit. */
#modal.goal-dialog .goal-task-targets{margin:4px 0 22px;padding-top:4px}
#modal.goal-dialog .goal-task-targets>.section-heading{margin:8px 0 4px}
#modal.goal-dialog .goal-task-targets>.section-heading h3{font-size:17px;margin:0}
#modal.goal-dialog .goal-task-targets>.small-note{margin:0 0 9px;color:#bcb5a8;font-size:12px;line-height:1.45}
.goal-target-edit-list{display:grid;gap:9px}
.goal-target-edit-row{display:grid;grid-template-columns:36px minmax(0,1fr);gap:8px;padding:10px;border:1px solid #ffffff1c;border-radius:13px;background:#202227;transition:opacity .15s,transform .15s,border-color .15s}
.goal-target-edit-row.goal-row-dragging,.goal-milestones .step-edit-row.goal-row-dragging{opacity:.8;transform:scale(.99);border-color:#e5bb595f}
.goal-target-drag,.goal-step-drag{display:grid;place-items:center;align-self:start;width:36px;height:46px;padding:0;border:0;background:transparent;color:#d3bd83;font-size:23px;line-height:1;cursor:grab;touch-action:none}
.goal-target-drag:active,.goal-step-drag:active{cursor:grabbing;color:#ffda7d}
.goal-target-edit-fields{min-width:0}
#modal.goal-dialog .goal-target-edit-fields>input[data-goal-target-title]{min-height:46px;font-size:16px;font-weight:650}
#modal.goal-dialog .goal-target-edit-fields>textarea{min-height:66px;margin-top:7px;resize:vertical;font-size:15px;line-height:1.4}
.goal-target-date{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px;color:#bbb4a6;font-size:12px}
#modal.goal-dialog .goal-target-date input{width:auto;min-width:142px;min-height:40px;font-size:13px}
.goal-target-remove{grid-column:2;justify-self:start;min-height:36px;padding:4px 0;color:#e7a59f;font-size:12px}
#modal.goal-dialog .goal-editor .goal-milestones .step-title-row{display:grid;grid-template-columns:36px 22px minmax(0,1fr) auto;gap:7px}
#modal.goal-dialog .goal-editor .goal-milestones .goal-step-drag{grid-column:1}
#modal.goal-dialog .goal-editor .goal-milestones .goal-step-remove{flex:auto;min-width:0;width:auto;padding:4px 6px;color:#e7a59f;font-size:11px}
#modal.goal-dialog .goal-editor .goal-milestones .goal-step-details{display:block;width:calc(100% - 44px);margin:7px 0 2px 44px;min-height:64px}
@media(max-width:420px){
  .goal-target-edit-row{grid-template-columns:32px minmax(0,1fr);padding:9px 8px}
  .goal-target-drag,.goal-step-drag{width:32px}
  #modal.goal-dialog .goal-editor .goal-milestones .step-title-row{grid-template-columns:32px 22px minmax(0,1fr) auto}
  #modal.goal-dialog .goal-editor .goal-milestones .goal-step-details{width:calc(100% - 39px);margin-left:39px}
}
