/* Clineo — Diyetisyen v2 (1 Eki 2026): Bugün, kontrol kartı, liste stüdyosu, takip, paketler, besinler.
   p2 tema değişkenlerine bağlı (koyu tema kendiliğinden); p2 kapalıysa açık tema varsayılanları. */
.dyt, .dyt-modal, #nav {
  --d-ink: var(--p2-ink, #0e1f3b); --d-ink2: var(--p2-ink-2, #3d4d66); --d-muted: var(--p2-muted, #5d6c82);
  --d-blue: var(--p2-blue, #1b5faa); --d-blue-d: var(--p2-blue-deep, #12457f); --d-blue-s: var(--p2-blue-soft, #e3eefa); --d-on-blue: var(--p2-on-blue, #fff);
  --d-ice: var(--p2-ice, #eef4fb); --d-bg: var(--p2-ice-2, #f6f9fd); --d-surface: var(--p2-surface, #fff);
  --d-line: var(--p2-line, #dce5f0); --d-line2: var(--p2-line-soft, #e9eff7);
  --d-ok: var(--p2-ok, #1b7a57); --d-ok-s: var(--p2-ok-soft, #e4f4ec);
  --d-warn: var(--p2-warn, #8f5500); --d-warn-s: var(--p2-warn-soft, #fdf1dc);
  --d-bad: var(--p2-bad, #b23a33); --d-bad-s: var(--p2-bad-soft, #fbe8e6);
  --d-violet: #55409a; --d-violet-s: #efe9fb;
  --d-neo: var(--p2-neo-a, #10284c);
  --d-head: var(--p2-head, "Poppins", "Segoe UI", system-ui, sans-serif);
  --d-body: var(--p2-body, "Work Sans", "Segoe UI", system-ui, sans-serif);
  --d-water: #3a8fd6;
}
html[data-theme="dark"] .dyt, html[data-theme="dark"] .dyt-modal { --d-violet: #c3b4f2; --d-violet-s: #2a2247; --d-water: #6fb3ef; }
html[data-theme="dark"]:not([data-ui="p2"]) .dyt, html[data-theme="dark"]:not([data-ui="p2"]) .dyt-modal {
  --d-ink: #e6edf7; --d-ink2: #b6c3d6; --d-muted: #93a3ba; --d-blue: #6aa8ec; --d-blue-d: #93c1f3; --d-blue-s: #16304f; --d-on-blue: #0a1526;
  --d-ice: #142640; --d-bg: #0f1e34; --d-surface: #0f1d33; --d-line: #213656; --d-line2: #1a2c47;
  --d-ok: #4cc393; --d-ok-s: #10301f; --d-warn: #f0b358; --d-warn-s: #33260f; --d-bad: #f08a83; --d-bad-s: #3a1717;
}

.dyt { color: var(--d-ink); font: 400 15px/1.5 var(--d-body); padding-bottom: 28px; }
.dyt *, .dyt-modal * { box-sizing: border-box; }
.dyt h1, .dyt h2, .dyt h3, .dyt-modal h4 { font-family: var(--d-head); margin: 0; letter-spacing: -.02em; color: var(--d-ink); }
.dyt p { margin: 0; }
.dyt button, .dyt input, .dyt select, .dyt textarea { font: inherit; color: inherit; }
.dyt button { cursor: pointer; }
.dyt :focus-visible, .dyt-modal :focus-visible { outline: 2.5px solid var(--d-blue); outline-offset: 2px; border-radius: 8px; }
.dyt .num, .dyt-modal .num { font-variant-numeric: tabular-nums; }
.dyt .ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dyt .muted { color: var(--d-muted); }
.dyt-empty { padding: 26px 14px; text-align: center; color: var(--d-muted); font-size: 14px; }
.dyt-empty b { display: block; color: var(--d-ink); font: 600 15px/1.3 var(--d-head); margin-bottom: 4px; }

/* düğmeler */
.dbtn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 12px; border: 1px solid var(--d-line); background: var(--d-surface); font: 500 14px/1 var(--d-head); color: var(--d-ink); white-space: nowrap; text-decoration: none; transition: border-color .15s, color .15s, background .15s; }
.dbtn:hover { border-color: var(--d-blue); color: var(--d-blue); }
.dbtn.p { background: var(--d-blue); border-color: var(--d-blue); color: var(--d-on-blue); box-shadow: 0 8px 20px -10px rgba(27,95,170,.7); }
.dbtn.p:hover { background: var(--d-blue-d); color: var(--d-on-blue); }
.dbtn.sm { min-height: 36px; padding: 0 12px; font-size: 13px; border-radius: 10px; }
.dbtn.gh { border-color: transparent; background: none; color: var(--d-blue); padding-left: 4px; padding-right: 4px; }
.dbtn.gh:hover { text-decoration: underline; }
.dbtn.danger:hover { border-color: var(--d-bad); color: var(--d-bad); }
.dbtn[disabled] { opacity: .5; cursor: default; pointer-events: none; }
.dlnk { border: 0; background: none; padding: 0; color: var(--d-blue); font-weight: 500; text-decoration: none; cursor: pointer; }
.dlnk:hover { text-decoration: underline; }

/* üst başlık */
.dyt-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; flex-wrap: wrap; margin-bottom: 20px; }
.dyt-top h1 { font-size: 27px; font-weight: 600; line-height: 1.15; }
.dyt-top p { color: var(--d-ink2); margin-top: 6px; }
.dyt-top p b { color: var(--d-ink); font-weight: 600; }
.dyt-tools { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dyt-find { position: relative; }
.dyt-find label { display: flex; align-items: center; gap: 8px; background: var(--d-surface); border: 1px solid var(--d-line); border-radius: 14px; padding: 0 12px; min-height: 44px; min-width: 280px; }
.dyt-find label:focus-within { border-color: var(--d-blue); }
.dyt-find input { border: 0; outline: 0; background: none; flex: 1; min-width: 0; }
.dyt-find input::placeholder { color: var(--d-muted); }
.dyt-find ul { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 6px); list-style: none; margin: 0; padding: 6px; background: var(--d-surface); border: 1px solid var(--d-line); border-radius: 14px; box-shadow: 0 18px 40px -18px rgba(14,31,59,.35); }
.dyt-find li button { width: 100%; text-align: left; border: 0; background: none; border-radius: 10px; padding: 10px 12px; font-size: 14px; color: var(--d-ink); }
.dyt-find li button:hover, .dyt-find li button.on { background: var(--d-ice); }

/* ızgara */
.dyt-grid { display: grid; grid-template-columns: 286px minmax(0, 1fr) 300px; gap: 20px; align-items: start; }
.dcard { background: var(--d-surface); border: 1px solid var(--d-line); border-radius: 18px; }
.deyebrow { font: 600 11.5px/1 var(--d-head); letter-spacing: .12em; text-transform: uppercase; color: var(--d-muted); }

/* gün şeridi */
.dday { padding: 16px 12px 12px; position: sticky; top: 86px; }
.dday-h { display: flex; justify-content: space-between; align-items: baseline; padding: 0 6px 10px; }
.dday-nav { display: flex; gap: 4px; align-items: center; }
.dday-nav button { width: 30px; height: 30px; border-radius: 9px; border: 1px solid var(--d-line); background: var(--d-surface); color: var(--d-ink2); display: grid; place-items: center; }
.dday-nav button:hover { border-color: var(--d-blue); color: var(--d-blue); }
.dday-nav span { font-size: 13px; color: var(--d-muted); min-width: 64px; text-align: center; }
.dslots { list-style: none; margin: 0; padding: 0; position: relative; }
.dslots::before { content: ""; position: absolute; left: 62px; top: 16px; bottom: 16px; width: 2px; background: var(--d-line2); }
.dslot { width: 100%; display: grid; grid-template-columns: 44px 20px minmax(0, 1fr); gap: 8px; align-items: start; padding: 9px 6px; border-radius: 12px; position: relative; border: 0; background: none; text-align: left; color: inherit; }
.dslot:hover { background: var(--d-bg); }
.dslot .t { font: 500 13.5px/20px var(--d-body); color: var(--d-muted); font-variant-numeric: tabular-nums; }
.ddot { width: 12px; height: 12px; border-radius: 50%; margin: 4px 0 0 4px; background: var(--d-surface); border: 2px solid var(--d-line); position: relative; z-index: 1; }
.ddot.ok { background: var(--d-ok); border-color: var(--d-ok); }
.ddot.warn { border-color: var(--d-warn); background: var(--d-warn-s); }
.ddot.miss { background: #a9b5c5; border-color: #a9b5c5; }
.ddot.next { background: var(--d-blue); border-color: var(--d-blue); box-shadow: 0 0 0 5px rgba(27,95,170,.16); }
@media (prefers-reduced-motion: no-preference) { .ddot.next { animation: dyt-pulse 2.4s ease-in-out infinite; } }
@keyframes dyt-pulse { 0%,100% { box-shadow: 0 0 0 3px rgba(27,95,170,.22); } 50% { box-shadow: 0 0 0 8px rgba(27,95,170,.05); } }
.dslot b { display: block; font-weight: 600; font-size: 14.5px; line-height: 20px; }
.dslot small { display: block; color: var(--d-muted); font-size: 13px; line-height: 1.4; }
.dslot small.w { color: var(--d-warn); }
.dslot.sel { background: var(--d-ice); box-shadow: inset 0 0 0 1.5px var(--d-blue); }
.dslot.sel b { color: var(--d-blue-d); }
.dslot.miss b { color: var(--d-muted); text-decoration: line-through; text-decoration-thickness: 1px; }
.dkind { display: inline-block; font: 600 11px/1 var(--d-body); padding: 3px 7px; border-radius: 99px; background: var(--d-line2); color: var(--d-ink2); margin-left: 4px; vertical-align: 1px; }
.dkind.first { background: var(--d-violet-s); color: var(--d-violet); }
.don { display: inline-flex; align-items: center; gap: 4px; color: var(--d-blue); font-weight: 500; }
.don svg { width: 14px !important; height: 14px !important; }
.dday-f { margin-top: 10px; padding: 12px 6px 2px; border-top: 1px solid var(--d-line2); display: flex; gap: 12px; flex-wrap: wrap; font-size: 13px; color: var(--d-ink2); }
.dday-f span { display: inline-flex; align-items: center; gap: 6px; }
.dday-f i { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.dday-add { margin-top: 10px; width: 100%; }

/* kontrol kartı — genişliğe göre kendi içinde düzenlenir (container query) */
.dbrief { padding: 22px 24px 20px; min-height: 420px; container-type: inline-size; container-name: dbrief; }
.dwho { display: flex; gap: 16px; align-items: center; flex-wrap: wrap; }
.dav { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; font: 600 17px/1 var(--d-head); background: var(--d-blue-s); color: var(--d-blue); flex: none; }
.dwho h2 { font-size: 24px; font-weight: 600; line-height: 1.15; }
.dwho h2 button { border: 0; background: none; padding: 0; color: inherit; font: inherit; letter-spacing: inherit; }
.dwho h2 button:hover { color: var(--d-blue); }
.dwho p { color: var(--d-ink2); font-size: 14px; margin-top: 3px; }
.dpkg { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; font: 600 14px/1 var(--d-head); color: var(--d-blue-d); background: var(--d-blue-s); padding: 10px 14px; border-radius: 99px; border: 0; }
.dpkg.none { background: var(--d-bg); color: var(--d-ink2); border: 1px dashed var(--d-line); }
.dpkg.low { background: var(--d-warn-s); color: var(--d-warn); }
.dflags { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 14px; }
.dflag { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; padding: 6px 10px; border-radius: 99px; border: 1px solid var(--d-line); background: var(--d-surface); color: var(--d-ink2); }
.dflag b { color: var(--d-ink); font-weight: 600; }
.dflag.a { background: var(--d-warn-s); border-color: transparent; color: var(--d-warn); }
.dflag.a b { color: var(--d-warn); }
.dflag.add { border-style: dashed; color: var(--d-blue); cursor: pointer; }
.dmodebar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 16px; }
.dmodebar p { font-size: 13px; color: var(--d-muted); flex: 1; min-width: 200px; }
.dseg { display: inline-flex; gap: 4px; padding: 4px; background: var(--d-bg); border: 1px solid var(--d-line2); border-radius: 12px; }
.dseg button { display: inline-flex; align-items: center; gap: 8px; border: 0; background: none; border-radius: 9px; padding: 0 14px; min-height: 38px; font: 500 13.5px/1 var(--d-head); color: var(--d-ink2); }
.dseg button[aria-pressed="true"] { background: var(--d-surface); color: var(--d-blue-d); box-shadow: 0 1px 2px rgba(14,31,59,.08), 0 0 0 1px var(--d-line); }

.dscale { margin-top: 18px; display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 22px; padding: 18px; border-radius: 16px; background: var(--d-bg); border: 1px solid var(--d-line2); }
.denter h3 { font-size: 17px; font-weight: 600; }
.denter .src { font-size: 12.5px; color: var(--d-muted); margin: 2px 0 12px; }
.dfields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.dfld { display: flex; flex-direction: column; gap: 6px; font-size: 13px; color: var(--d-ink2); font-weight: 500; }
.dfld .box { display: flex; align-items: baseline; gap: 6px; background: var(--d-surface); border: 1.5px solid var(--d-line); border-radius: 12px; padding: 8px 12px; min-height: 56px; }
.dfld .box:focus-within { border-color: var(--d-blue); }
.dfld input { border: 0; outline: 0; background: none; width: 100%; min-width: 0; font: 600 25px/1.2 var(--d-head); letter-spacing: -.02em; color: var(--d-ink); font-variant-numeric: tabular-nums; }
.dfld input::placeholder { color: #a9b5c5; }
.dfld em { font-style: normal; color: var(--d-muted); font-size: 14px; }
.dfields.more { margin-top: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dfields.more .box { min-height: 44px; padding: 6px 10px; }
.dfields.more input { font-size: 17px; }
.dmore { display: inline-block; margin-top: 10px; font-size: 13.5px; }
.ddelta { margin-top: 12px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--d-ink2); }
.ddelta b { font-weight: 600; }
.ddelta .dn { color: var(--d-ok); }
.ddelta .up { color: var(--d-warn); }
.dcomplete { display: flex; align-items: flex-start; gap: 8px; margin-top: 14px; font-size: 13.5px; color: var(--d-ink2); cursor: pointer; }
.dcomplete input { width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--d-blue); flex: none; }
.dsave { margin-top: 12px; display: flex; gap: 8px; flex-wrap: wrap; }
.dtrend { min-width: 0; }
.dtrend-h { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; }
.dtrend-h strong { font: 600 15px/1 var(--d-head); }
.dtrend-h span { font-size: 13px; color: var(--d-muted); }
.dtrend-h span.w { color: var(--d-warn); font-weight: 500; }
.dchart { position: relative; height: 160px; margin: 16px 0 6px; }
.dchart svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.dpt { position: absolute; width: 9px; height: 9px; border-radius: 50%; background: var(--d-surface); border: 2px solid var(--d-blue); transform: translate(-50%, -50%); }
.dpt.rep { border-style: dashed; border-color: var(--d-violet); }
.dpt.last { background: var(--d-blue); width: 12px; height: 12px; box-shadow: 0 0 0 4px rgba(27,95,170,.15); }
.dpv { position: absolute; transform: translate(-50%, -165%); font: 600 11.5px/1 var(--d-body); color: var(--d-ink2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dgoal-l { position: absolute; right: 0; font-size: 11.5px; color: var(--d-ok); font-weight: 600; transform: translateY(-130%); }
.daxis { display: flex; justify-content: space-between; font-size: 11.5px; color: var(--d-muted); }
.dprog { margin-top: 12px; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; font-size: 13.5px; color: var(--d-ink2); align-items: center; }
.dprog em { font-style: normal; font-weight: 600; color: var(--d-ink); }
.dbar { grid-column: 1 / -1; height: 8px; border-radius: 8px; background: var(--d-line2); overflow: hidden; display: block; }
.dbar i { display: block; height: 100%; border-radius: 8px; background: var(--d-blue); }
.dsafety { margin-top: 10px; font-size: 13px; color: var(--d-warn); background: var(--d-warn-s); border-radius: 10px; padding: 8px 12px; }
.dkpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.dkpi { background: var(--d-surface); border: 1px solid var(--d-line2); border-radius: 12px; padding: 10px 12px; }
.dkpi span { display: block; font-size: 12px; color: var(--d-muted); }
.dkpi strong { display: block; font: 600 19px/1.2 var(--d-head); letter-spacing: -.02em; margin-top: 2px; font-variant-numeric: tabular-nums; }
.dkpi small { font-size: 12px; color: var(--d-ok); font-weight: 600; }
.dkpi small.n { color: var(--d-muted); font-weight: 500; }

.dqs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 18px; border-top: 1px solid var(--d-line2); }
.dq { padding: 18px 20px 18px 0; min-width: 0; }
.dq:nth-child(even) { padding: 18px 0 18px 20px; border-left: 1px solid var(--d-line2); }
.dq:nth-child(n+3) { border-top: 1px solid var(--d-line2); }
.dq-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.dq h3 { font-size: 17px; font-weight: 600; }
.dq .src { font-size: 12.5px; color: var(--d-muted); margin-bottom: 10px; }
.dlst { display: flex; flex-direction: column; gap: 7px; font-size: 14px; color: var(--d-ink2); }
.dlst div { display: flex; justify-content: space-between; gap: 10px; }
.dlst b { color: var(--d-ink); font-weight: 600; }
.dnote-w { margin-top: 10px; font-size: 13.5px; color: var(--d-warn); background: var(--d-warn-s); border-radius: 10px; padding: 8px 12px; }
.dnote-i { margin-top: 10px; font-size: 13.5px; color: var(--d-ink2); background: var(--d-bg); border-radius: 10px; padding: 8px 12px; }
.dpips { display: flex; gap: 6px; margin: 2px 0 10px; flex-wrap: wrap; }
.dpip { width: 34px; display: flex; flex-direction: column; align-items: center; gap: 5px; font-size: 11.5px; color: var(--d-muted); }
.dpip i { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: var(--d-ok-s); color: var(--d-ok); font-style: normal; font-size: 11px; font-weight: 600; }
.dpip i.half { background: var(--d-warn-s); color: var(--d-warn); }
.dpip i.no { background: var(--d-surface); border: 1.5px dashed #b9c6d6; color: transparent; }
.dpip svg { width: 14px !important; height: 14px !important; }
.dwater { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; font-size: 13.5px; color: var(--d-ink2); align-items: center; margin-bottom: 10px; }
.dwater em { font-style: normal; font-weight: 600; color: var(--d-ink); }
.dwater .dbar i { background: var(--d-water); }
.dquote { font-size: 14px; color: var(--d-ink2); border-radius: 10px; background: var(--d-bg); padding: 9px 12px; }
.dquote b { color: var(--d-ink); font-weight: 600; }
.dlab { width: 100%; border-collapse: collapse; font-size: 14px; }
.dlab th { text-align: left; font-weight: 500; color: var(--d-muted); font-size: 12.5px; padding: 0 6px 6px 0; }
.dlab td { padding: 6px 6px 6px 0; border-top: 1px solid var(--d-line2); color: var(--d-ink2); font-variant-numeric: tabular-nums; }
.dlab td:first-child { color: var(--d-ink); font-weight: 500; }
.dlab .good { color: var(--d-ok); font-weight: 600; }
.dlab .bad { color: var(--d-warn); font-weight: 600; }
.dplan { display: flex; flex-direction: column; gap: 2px; }
.dplan label { display: flex; gap: 10px; align-items: flex-start; font-size: 14.5px; color: var(--d-ink2); cursor: pointer; padding: 5px 0; }
.dplan label.done span { text-decoration: line-through; color: var(--d-muted); }
.dplan input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--d-blue); flex: none; }
.dadd { display: flex; gap: 6px; margin-top: 6px; }
.dadd input { flex: 1; min-width: 0; border: 1px solid var(--d-line); border-radius: 10px; padding: 0 10px; min-height: 36px; background: var(--d-surface); }
.dfoot { margin-top: 4px; padding-top: 16px; border-top: 1px solid var(--d-line2); display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dfoot .pay { font-size: 14px; color: var(--d-ink2); margin-right: auto; }
.dfoot .pay b { color: var(--d-ink); font-weight: 600; }

/* sağ ray */
.drail { display: flex; flex-direction: column; gap: 14px; }
.dtodo { padding: 14px 16px 6px; }
.dtodo h3 { font-size: 15.5px; font-weight: 600; margin: 2px 0 2px; display: flex; align-items: center; gap: 8px; }
.dtodo h3 .n { margin-left: auto; font: 600 12px/1 var(--d-body); padding: 4px 8px; border-radius: 99px; background: var(--d-warn-s); color: var(--d-warn); }
.dtodo h3 .n.b { background: var(--d-blue-s); color: var(--d-blue); }
.dtodo h3 .n.z { background: var(--d-line2); color: var(--d-muted); }
.dtodo .why { font-size: 12.5px; color: var(--d-muted); margin-bottom: 4px; }
.dtodo ul { list-style: none; margin: 0; padding: 0; }
.dtodo li { display: flex; align-items: center; gap: 10px; padding: 9px 0; border-top: 1px solid var(--d-line2); }
.dtodo li .who { flex: 1; min-width: 0; font-size: 14px; color: var(--d-ink2); border: 0; background: none; text-align: left; padding: 0; }
.dtodo li .who b { color: var(--d-ink); font-weight: 600; display: block; }
.dtodo li .who:hover b { color: var(--d-blue); }
.dtodo li .who small { display: block; font-size: 12.5px; color: var(--d-muted); }
.dtodo li label { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; cursor: pointer; }
.dtodo li label input { width: 17px; height: 17px; accent-color: var(--d-blue); flex: none; }
.dkg { font: 600 14px/1 var(--d-head); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dkg.dn { color: var(--d-ok); }
.dkg.up { color: var(--d-warn); }
.dtodo .all { display: flex; gap: 8px; padding: 10px 0 8px; border-top: 1px solid var(--d-line2); flex-wrap: wrap; }
.dtodo .none { font-size: 13.5px; color: var(--d-muted); padding: 6px 0 10px; }
.dneo { background: var(--d-neo); color: #fff; border-radius: 18px; padding: 16px 18px; }
.dneo .h { display: flex; align-items: center; gap: 10px; font: 600 15px/1 var(--d-head); }
.dneo .h span { width: 26px; height: 26px; border-radius: 50%; background: #fff; color: var(--d-neo); display: grid; place-items: center; font: 700 12px/1 var(--d-head); }
.dneo p { font-size: 13.5px; color: #c6d3e8; margin: 10px 0 12px; }
.dneo .chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dneo .chips button { border: 1px solid rgba(255,255,255,.22); background: rgba(255,255,255,.06); color: #fff; border-radius: 99px; padding: 8px 12px; font-size: 13px; min-height: 36px; }
.dneo .chips button:hover { background: rgba(255,255,255,.14); }
.dweek { padding: 16px; }
.dweek h3 { font-size: 15.5px; font-weight: 600; }
.dwk { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.dwk div { background: var(--d-bg); border-radius: 12px; padding: 12px; }
.dwk strong { display: block; font: 600 22px/1.1 var(--d-head); font-variant-numeric: tabular-nums; }
.dwk span { font-size: 12.5px; color: var(--d-muted); }
.dyt-legacy { margin-top: 20px; text-align: center; font-size: 13px; color: var(--d-muted); }

/* modal formları */
.dyt-modal { color: var(--d-ink); font: 400 14.5px/1.5 var(--d-body); }
.dyt-modal .row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.dyt-modal .row.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dyt-modal label.f { display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 500; color: var(--d-ink2); margin-bottom: 12px; }
.dyt-modal label.f input, .dyt-modal label.f select, .dyt-modal label.f textarea { border: 1.5px solid var(--d-line); border-radius: 10px; padding: 9px 11px; background: var(--d-surface); color: var(--d-ink); font: inherit; min-height: 42px; }
.dyt-modal label.f textarea { min-height: 80px; resize: vertical; }
.dyt-modal label.f input:focus, .dyt-modal label.f select:focus, .dyt-modal label.f textarea:focus { border-color: var(--d-blue); outline: 0; }
.dyt-modal .hint { font-size: 12.5px; color: var(--d-muted); margin: -4px 0 12px; }
.dyt-modal .chipset { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.dyt-modal .chipset label { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--d-line); border-radius: 99px; padding: 6px 12px; font-size: 13px; cursor: pointer; background: var(--d-surface); }
.dyt-modal .chipset label:has(input:checked) { background: var(--d-warn-s); border-color: transparent; color: var(--d-warn); font-weight: 600; }
.dyt-modal .chipset input { accent-color: var(--d-warn); }
.dyt-modal .presets { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 14px; }
.dyt-modal .presets button { border: 1px solid var(--d-line); background: var(--d-surface); border-radius: 10px; padding: 8px 12px; font: 500 13px/1.2 var(--d-head); color: var(--d-ink); cursor: pointer; text-align: left; }
.dyt-modal .presets button:hover { border-color: var(--d-blue); color: var(--d-blue); }
.dyt-modal .presets button small { display: block; font: 400 12px/1.3 var(--d-body); color: var(--d-muted); }
.dyt-modal h4 { font-size: 14px; font-weight: 600; margin: 4px 0 10px; }

/* menü rozetleri */
#nav .dyt-cnt { margin-left: auto; font: 600 11.5px/1 var(--d-body); background: var(--d-warn-s); color: var(--d-warn); padding: 3px 7px; border-radius: 99px; min-width: 20px; text-align: center; }
#nav .dyt-cnt.b { background: var(--d-blue-s); color: var(--d-blue); }
#nav .dyt-cnt[hidden] { display: none; }
#nav button .lbl { flex: 1; min-width: 0; }

/* sayfa (takip / paketler / besinler / listeler) */
.dpage-h { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.dpage-h h1 { font-size: 25px; font-weight: 600; }
.dpage-h p { color: var(--d-ink2); margin-top: 4px; font-size: 14px; }
.dtabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.dtabs button { border: 1px solid var(--d-line); background: var(--d-surface); border-radius: 99px; padding: 0 14px; min-height: 36px; font: 500 13.5px/1 var(--d-head); color: var(--d-ink2); }
.dtabs button[aria-pressed="true"] { background: var(--d-ink); border-color: var(--d-ink); color: var(--d-surface); }
.dtabs button span { margin-left: 6px; opacity: .75; }
.dtbl-w { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--d-line); border-radius: 16px; background: var(--d-surface); }
.dtbl { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 640px; }
.dtbl th { text-align: left; font: 500 12.5px/1.2 var(--d-body); color: var(--d-muted); padding: 12px 14px; border-bottom: 1px solid var(--d-line); white-space: nowrap; background: var(--d-bg); }
.dtbl td { padding: 11px 14px; border-top: 1px solid var(--d-line2); vertical-align: middle; color: var(--d-ink2); }
.dtbl tr:first-child td { border-top: 0; }
.dtbl td b { color: var(--d-ink); font-weight: 600; }
.dtbl td .who { border: 0; background: none; padding: 0; color: var(--d-ink); font-weight: 600; text-align: left; }
.dtbl td .who:hover { color: var(--d-blue); }
.dtbl .acts { display: flex; gap: 6px; justify-content: flex-end; flex-wrap: wrap; }
.dtbl input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--d-blue); }
.dpill { display: inline-flex; align-items: center; gap: 6px; font: 600 12px/1 var(--d-body); padding: 5px 9px; border-radius: 99px; background: var(--d-line2); color: var(--d-ink2); white-space: nowrap; }
.dpill.ok { background: var(--d-ok-s); color: var(--d-ok); }
.dpill.w { background: var(--d-warn-s); color: var(--d-warn); }
.dpill.b { background: var(--d-blue-s); color: var(--d-blue-d); }
.dpill.v { background: var(--d-violet-s); color: var(--d-violet); }
.dmini-bar { display: inline-block; width: 90px; height: 6px; border-radius: 6px; background: var(--d-line2); overflow: hidden; vertical-align: middle; margin-right: 8px; }
.dmini-bar i { display: block; height: 100%; background: var(--d-blue); }
.dstats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.dstat { background: var(--d-surface); border: 1px solid var(--d-line); border-radius: 16px; padding: 14px 16px; }
.dstat span { font-size: 12.5px; color: var(--d-muted); }
.dstat strong { display: block; font: 600 24px/1.15 var(--d-head); margin-top: 4px; font-variant-numeric: tabular-nums; }

/* hasta kartı sekmesi içinde */
.dyt.in-tab { padding: 16px 0 24px; }
.dyt.in-tab .dbrief { border: 1px solid var(--d-line); }

/* =================== LİSTE STÜDYOSU =================== */
.dst { margin: -4px 0 0; }
.dst-bar { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; background: var(--d-surface); border: 1px solid var(--d-line); border-radius: 18px; padding: 12px 16px; }
.dst-bar .back { display: inline-flex; align-items: center; gap: 6px; font: 500 14px/1 var(--d-head); min-height: 40px; border: 0; background: none; color: var(--d-blue); padding: 0 6px 0 0; }
.dst-ttl { flex: 1; min-width: 220px; display: flex; flex-direction: column; gap: 2px; }
.dst-ttl input { border: 0; outline: 0; background: none; font: 600 20px/1.25 var(--d-head); letter-spacing: -.02em; color: var(--d-ink); padding: 0; min-width: 0; width: 100%; border-bottom: 1.5px dashed transparent; }
.dst-ttl input:hover, .dst-ttl input:focus { border-bottom-color: var(--d-line); }
.dst-ttl p { font-size: 13px; color: var(--d-muted); }
.dst-ttl p b { color: var(--d-warn); font-weight: 600; }
.dst-targets { position: sticky; top: 84px; z-index: 5; margin: 12px 0 0; padding: 12px 16px; background: var(--d-surface); border: 1px solid var(--d-line); border-radius: 16px; box-shadow: 0 10px 24px -20px rgba(14,31,59,.4); }
.dst-tg { display: grid; grid-template-columns: 1.35fr repeat(4, minmax(0, 1fr)) auto; gap: 16px; align-items: center; }
.dt { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 5px 8px; align-items: baseline; min-width: 0; }
.dt span { font-size: 12.5px; color: var(--d-muted); font-weight: 500; white-space: nowrap; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.dt b { font: 600 15px/1 var(--d-head); font-variant-numeric: tabular-nums; white-space: nowrap; }
.dt b small { font: 500 12px/1 var(--d-body); color: var(--d-muted); }
.dt .tr { grid-column: 1 / -1; height: 7px; border-radius: 7px; background: var(--d-line2); overflow: hidden; }
.dt .tr i { display: block; height: 100%; border-radius: 7px; background: var(--d-blue); transition: width .25s ease; }
.dt.big b { font-size: 19px; }
.dt.over b { color: var(--d-warn); }
.dt.over .tr i { background: #c98a1a; }
.dt.ok .tr i { background: var(--d-ok); }
.dt .hint { grid-column: 1 / -1; font-size: 11.5px; color: var(--d-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dt.over .hint { color: var(--d-warn); }
.dst-tg .dbtn { align-self: center; }
.dst-wrap { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 18px; align-items: start; margin-top: 14px; }
.dst-days { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; margin-bottom: 12px; }
.dst-days button.d { min-width: 52px; min-height: 40px; border-radius: 10px; border: 1px solid var(--d-line); background: var(--d-surface); font: 500 13.5px/1 var(--d-head); color: var(--d-ink2); position: relative; }
.dst-days button.d[aria-pressed="true"] { background: var(--d-blue); border-color: var(--d-blue); color: var(--d-on-blue); }
.dst-days button.d i { position: absolute; right: 5px; top: 5px; width: 6px; height: 6px; border-radius: 50%; background: var(--d-line); }
.dst-days button.d i.f { background: var(--d-ok); }
.dst-days .sp { flex: 1; }
.dmeals { display: flex; flex-direction: column; gap: 12px; }
.dmeal { padding: 14px 16px 10px; }
.dmh { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.dmh .nm { border: 0; outline: 0; background: none; font: 600 16.5px/1.2 var(--d-head); color: var(--d-ink); width: 150px; padding: 2px 0; border-bottom: 1.5px dashed transparent; }
.dmh .nm:hover, .dmh .nm:focus { border-bottom-color: var(--d-line); }
.dmh .tm { font: 500 13px/1 var(--d-body); color: var(--d-ink2); background: var(--d-bg); border: 1px solid var(--d-line2); border-radius: 8px; padding: 6px 8px; min-height: 32px; }
.dmh .k { margin-left: auto; font: 600 14px/1 var(--d-head); font-variant-numeric: tabular-nums; }
.dmh .k small { font: 500 12.5px/1 var(--d-body); color: var(--d-muted); }
.dmh .mx { display: flex; gap: 2px; }
.dmh .mx button { width: 30px; height: 30px; border-radius: 8px; border: 0; background: none; color: var(--d-muted); display: grid; place-items: center; }
.dmh .mx button:hover { background: var(--d-bg); color: var(--d-ink); }
.dmh .mx button.del:hover { color: var(--d-bad); }
.dmh .mx svg { width: 15px !important; height: 15px !important; }
.dopts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 10px; }
.dopts.one { grid-template-columns: 1fr; }
.dopts.three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dopt { border: 1px solid var(--d-line2); border-radius: 14px; padding: 8px 10px 6px; background: var(--d-bg); min-width: 0; container: dopt / inline-size; }
.dopt.tgt { border-color: var(--d-blue); box-shadow: 0 0 0 2px rgba(27,95,170,.12); background: var(--d-surface); }
.dopt-h { display: flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--d-muted); margin-bottom: 2px; }
.dopt-h b { font: 600 12px/1 var(--d-head); letter-spacing: .06em; color: var(--d-blue-d); background: var(--d-blue-s); border-radius: 6px; padding: 4px 7px; }
.dopt-h input { border: 0; outline: 0; background: none; font-size: 12.5px; color: var(--d-ink2); flex: 1; min-width: 0; }
.dopt-h span { font-variant-numeric: tabular-nums; white-space: nowrap; }
.dopt-h .x { width: 24px; height: 24px; border: 0; background: none; color: var(--d-muted); border-radius: 6px; display: grid; place-items: center; }
.dopt-h .x:hover { color: var(--d-bad); background: var(--d-surface); }
.dopt-h .x svg { width: 13px !important; height: 13px !important; }
.ditems { list-style: none; margin: 0; padding: 0; }
.dit { display: grid; grid-template-columns: minmax(0, 1fr) 56px 104px 50px 22px; gap: 6px; align-items: center; padding: 5px 0; border-top: 1px solid var(--d-line2); font-size: 13.5px; }
.dit:first-child { border-top: 0; }
.dit .f { color: var(--d-ink); font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dit .f small { display: block; font-weight: 400; font-size: 11.5px; color: var(--d-muted); overflow: hidden; text-overflow: ellipsis; }
.dit input, .dit select { width: 100%; min-width: 0; border: 1px solid var(--d-line); border-radius: 8px; padding: 0 6px; min-height: 30px; background: var(--d-surface); font-size: 13px; color: var(--d-ink); }
.dit input.q { text-align: right; font-variant-numeric: tabular-nums; }
.dit .kc { text-align: right; color: var(--d-ink2); font-variant-numeric: tabular-nums; }
.dit .x { width: 22px; height: 22px; border: 0; background: none; color: var(--d-muted); border-radius: 6px; display: grid; place-items: center; padding: 0; }
.dit .x:hover { background: var(--d-surface); color: var(--d-bad); }
.dit .x svg { width: 13px !important; height: 13px !important; }
.dit.al { background: var(--d-warn-s); margin: 0 -6px; padding: 5px 6px; border-radius: 10px; border-top-color: transparent; }
.dal { grid-column: 1 / -1; display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--d-warn); }
.dal svg { width: 14px !important; height: 14px !important; }
.dal button { margin-left: auto; border: 1px solid currentColor; background: var(--d-surface); border-radius: 8px; padding: 3px 9px; font-size: 12px; color: var(--d-warn); min-height: 26px; }
.daddrow { display: flex; gap: 10px; margin-top: 6px; flex-wrap: wrap; }
.daddrow button { border: 0; background: none; color: var(--d-blue); font-weight: 500; font-size: 13px; padding: 4px 0; }
.dmnote { width: 100%; margin-top: 6px; border: 1px dashed var(--d-line); border-radius: 10px; padding: 7px 10px; font-size: 13px; background: none; color: var(--d-ink2); resize: vertical; min-height: 34px; }
.dmnote:focus { border-style: solid; border-color: var(--d-blue); outline: 0; }
.daddmeal { width: 100%; border: 1.5px dashed var(--d-line); background: none; border-radius: 16px; min-height: 52px; font: 500 14px/1 var(--d-head); color: var(--d-blue); }
.daddmeal:hover { border-color: var(--d-blue); background: var(--d-surface); }
.dplannote { margin-top: 12px; padding: 14px 16px; }
.dplannote textarea { width: 100%; border: 1.5px solid var(--d-line); border-radius: 12px; padding: 10px 12px; min-height: 70px; background: var(--d-surface); color: var(--d-ink); resize: vertical; }
.dst-side { display: flex; flex-direction: column; gap: 14px; position: sticky; top: 178px; max-height: calc(100vh - 330px); min-height: 360px; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.dsearch { padding: 14px; }
.dsearch h3, .dmini h3 { font-size: 15.5px; font-weight: 600; margin-bottom: 8px; display: flex; align-items: center; gap: 8px; }
.dsearch h3 span { margin-left: auto; font: 500 12px/1 var(--d-body); color: var(--d-muted); }
.dsbox { display: flex; align-items: center; gap: 8px; border: 1.5px solid var(--d-line); border-radius: 12px; padding: 0 12px; min-height: 44px; background: var(--d-surface); }
.dsbox:focus-within { border-color: var(--d-blue); }
.dsbox input { border: 0; outline: 0; flex: 1; min-width: 0; background: none; }
.dsrc { display: flex; gap: 6px; flex-wrap: wrap; margin: 10px 0 6px; }
.dsrc button { border: 1px solid var(--d-line); background: var(--d-surface); border-radius: 99px; padding: 0 11px; min-height: 30px; font-size: 12.5px; color: var(--d-ink2); }
.dsrc button[aria-pressed="true"] { background: var(--d-ink); border-color: var(--d-ink); color: var(--d-surface); }
.dres { list-style: none; margin: 0; padding: 0; max-height: 300px; overflow-y: auto; }
.dres li button { width: 100%; display: flex; align-items: center; gap: 10px; padding: 8px 6px; border: 0; border-top: 1px solid var(--d-line2); border-radius: 10px; background: none; text-align: left; color: inherit; }
.dres li:first-child button { border-top: 0; }
.dres li button:hover, .dres li button.sel { background: var(--d-ice); border-top-color: transparent; }
.dres li div { flex: 1; min-width: 0; }
.dres b { display: block; font-weight: 500; font-size: 14px; }
.dres small { display: block; font-size: 12px; color: var(--d-muted); }
.dbadge { font: 600 10.5px/1 var(--d-body); letter-spacing: .04em; padding: 4px 6px; border-radius: 6px; flex: none; }
.dbadge.tk { background: var(--d-ok-s); color: var(--d-ok); }
.dbadge.my { background: var(--d-violet-s); color: var(--d-violet); }
.dbadge.al { background: var(--d-warn-s); color: var(--d-warn); }
.dportion { margin-top: 10px; padding: 12px; border-radius: 14px; background: var(--d-bg); border: 1px solid var(--d-line2); }
.dportion h4 { font: 600 14px/1.3 var(--d-head); margin: 0 0 8px; }
.dportion .row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dportion .qty { width: 72px; min-height: 40px; border: 1.5px solid var(--d-line); border-radius: 10px; padding: 0 10px; font: 600 16px/1 var(--d-head); background: var(--d-surface); color: var(--d-ink); }
.dportion select { min-height: 40px; border: 1.5px solid var(--d-line); border-radius: 10px; padding: 0 10px; background: var(--d-surface); flex: 1; min-width: 0; color: var(--d-ink); }
.dmacro { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin: 10px 0; }
.dmacro div { background: var(--d-surface); border-radius: 10px; padding: 8px 4px; text-align: center; }
.dmacro b { display: block; font: 600 15px/1.1 var(--d-head); font-variant-numeric: tabular-nums; }
.dmacro span { font-size: 11px; color: var(--d-muted); }
.dportion .tgt { font-size: 12.5px; color: var(--d-ink2); margin-top: 8px; }
.dattr { font-size: 11.5px; color: var(--d-muted); margin-top: 10px; line-height: 1.45; }
.dshop { display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; color: var(--d-ink2); max-height: 220px; overflow-y: auto; }
.dshop div { display: flex; justify-content: space-between; gap: 10px; border-top: 1px solid var(--d-line2); padding-top: 6px; }
.dshop div:first-child { border-top: 0; padding-top: 0; }
.dshop b { color: var(--d-ink); font-weight: 600; white-space: nowrap; }
.dlook { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.dlook button { border: 1.5px solid var(--d-line); background: var(--d-surface); border-radius: 12px; padding: 8px; display: flex; flex-direction: column; gap: 6px; align-items: stretch; font-size: 12.5px; color: var(--d-ink2); }
.dlook button[aria-pressed="true"] { border-color: var(--d-blue); color: var(--d-blue-d); font-weight: 600; }
.dlook i { display: block; height: 44px; border-radius: 7px; background: repeating-linear-gradient(180deg, var(--d-line2) 0 5px, var(--d-surface) 5px 10px); }
.dlook i.c { background: linear-gradient(180deg, var(--d-blue) 0 11px, transparent 11px), repeating-linear-gradient(180deg, var(--d-line2) 0 5px, var(--d-surface) 5px 10px); }
.dlook i.k { background: repeating-linear-gradient(180deg, var(--d-line2) 0 3px, var(--d-surface) 3px 6px); }
.dst-send { margin-top: 16px; padding: 14px 18px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; position: sticky; bottom: 10px; z-index: 6; box-shadow: 0 -10px 30px -24px rgba(14,31,59,.5); }
.dst-send p { font-size: 14px; color: var(--d-ink2); margin-right: auto; }
.dst-send p b { color: var(--d-ink); font-weight: 600; }
.dst-send p .saved { color: var(--d-ok); }
.dst-send p .dirty { color: var(--d-warn); }

/* liste stüdyosu girişi */
.dst-pick { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 18px; }
.dst-pick .dcard { padding: 18px; }
.dst-pick h2 { font-size: 17px; font-weight: 600; margin-bottom: 4px; }
.dst-pick p.src { font-size: 13px; color: var(--d-muted); margin-bottom: 12px; }

@media (max-width: 1320px) {
  .dyt-grid { grid-template-columns: 270px minmax(0, 1fr); }
  .drail { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: start; }
  .dscale { grid-template-columns: 1fr; }
  .dst-wrap { grid-template-columns: minmax(0, 1fr) 320px; }
  .dst-tg { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 1060px) {
  .dst-wrap { grid-template-columns: 1fr; }
  .dst-side { position: static; max-height: none; overflow: visible; }
  .dopts, .dopts.three { grid-template-columns: 1fr; }
}
@media (max-width: 960px) {
  .dyt-grid { grid-template-columns: 1fr; }
  .dday { position: static; }
  .drail { grid-template-columns: 1fr; }
  .dqs { grid-template-columns: 1fr; }
  .dq, .dq:nth-child(even) { padding: 16px 0; border-left: 0; }
  .dq:nth-child(n+2) { border-top: 1px solid var(--d-line2); }
  .dyt-find label { min-width: 0; width: 100%; }
  .dyt-find { flex: 1; }
  .dpkg { margin-left: 0; }
  .dkpis, .dstats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dst-pick { grid-template-columns: 1fr; }
  .dst-tg { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dst-tg .dt.big { grid-column: 1 / -1; }
  .dbrief { padding: 18px 16px; }
}
@media (max-width: 560px) {
  .dfields { grid-template-columns: 1fr 1fr; }
  .dyt-modal .row, .dyt-modal .row.three { grid-template-columns: 1fr; }
  .dyt-top h1 { font-size: 23px; }
}

.dmiss { color: var(--d-muted); }

/* kontrol kartı genişliğe göre (container query) — temel kurallardan SONRA gelmeli */
@container dbrief (max-width: 760px) {
  .dscale { grid-template-columns: 1fr; gap: 18px; }
  .dchart { height: 150px; }
}
@container dbrief (max-width: 600px) {
  .dkpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dqs { grid-template-columns: 1fr; }
  .dq, .dq:nth-child(even) { padding: 16px 0; border-left: 0; }
  .dq:nth-child(n+2) { border-top: 1px solid var(--d-line2); }
}
/* dar seçenek sütununda besin adı kendi satırında, miktar alanları altında */
@container dopt (max-width: 420px) {
  .dit { grid-template-columns: 56px minmax(0, 1fr) 56px 22px; row-gap: 4px; }
  .dit .f { grid-column: 1 / -1; white-space: normal; }
  .dit .f small { display: inline; margin-left: 6px; }
}
/* Neo düğmesi sağ altta durur; kaydet çubuğu onun altında kalmasın */
@media (min-width: 761px) { .dst-send { padding-right: 204px; } }
.dst-send .acts { display: contents; }
@media (max-width: 760px) {
  .dst-send { bottom: 76px; padding: 10px 12px; gap: 8px; }
  .dst-send p { flex-basis: 100%; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .dst-send .acts { display: flex; gap: 8px; overflow-x: auto; flex: 1 1 100%; scrollbar-width: none; padding-right: 72px; }
  .dst-send .acts .dbtn { flex: none; min-height: 40px; padding: 0 14px; }
  .dst-send .acts [data-a="save"] { order: -1; }
}
/* telefonda: kart yapışkan üst çubuğun altına kaysın; makro çubuğu ekranı kaplamasın */
.dbrief { scroll-margin-top: 84px; }
@media (max-width: 760px) { .dst-targets { position: static; } }
/* koyu tema: genel input kuralı (html[data-theme=dark] input) modül alanlarını ezmesin */
html[data-theme="dark"] .dyt-find input { border: 0; background: none; }
html[data-theme="dark"] .dyt-find input::placeholder { color: var(--d-muted); }
html[data-theme="dark"] .dfld input { border: 0; background: none; color: var(--d-ink); }
html[data-theme="dark"] .dfld input::placeholder { color: #a9b5c5; }
html[data-theme="dark"] .dadd input { border: 1px solid var(--d-line); background: var(--d-surface); }
html[data-theme="dark"] .dyt-modal label.f input, html[data-theme="dark"] .dyt-modal label.f select, html[data-theme="dark"] .dyt-modal label.f textarea { border: 1.5px solid var(--d-line); background: var(--d-surface); color: var(--d-ink); }
html[data-theme="dark"] .dst-ttl input { border: 0; background: none; color: var(--d-ink); border-bottom: 1.5px dashed transparent; }
html[data-theme="dark"] .dopt-h input { border: 0; background: none; color: var(--d-ink2); }
html[data-theme="dark"] .dit input, html[data-theme="dark"] .dit select { border: 1px solid var(--d-line); background: var(--d-surface); color: var(--d-ink); }
html[data-theme="dark"] .dplannote textarea { border: 1.5px solid var(--d-line); background: var(--d-surface); color: var(--d-ink); }
html[data-theme="dark"] .dsbox input { border: 0; background: none; }
html[data-theme="dark"] .dportion .qty { border: 1.5px solid var(--d-line); background: var(--d-surface); color: var(--d-ink); }
html[data-theme="dark"] .dportion select { border: 1.5px solid var(--d-line); background: var(--d-surface); color: var(--d-ink); }