/* זוכרים אותך — visual system. Minimal v7.6.1 anatomy (radius, double soft shadow, hairline borders, tabular nums)
   in a warm family voice. Logical properties only; RTL comes from dir="rtl". Themes via [data-theme] on <html>. */
@import url('https://fonts.googleapis.com/css2?family=Heebo:wght@400;500;600;700;800;900&display=swap');

:root{
  --c-primary:#C8892B; --c-primary-dark:#9C6416; --c-primary-soft:#F7E6C8; --c-primary-ink:#FFFFFF;
  --c-bg:#FFF8EE; --c-surface:#FFFFFF; --c-surface-2:#FBF3E6;
  --c-text:#2A211A; --c-muted:#6E6257; --c-faint:#9A8E82;
  --c-border:rgba(110,98,87,.22); --c-border-2:rgba(110,98,87,.38);
  --c-success:#22A06B; --c-success-soft:#DDF5E9; --c-error:#D9483B; --c-error-soft:#FCE4E1;
  --radius:16px; --radius-sm:8px; --radius-full:999px;
  --shadow:0 0 2px 0 rgba(145,158,171,.2),0 12px 24px -4px rgba(145,158,171,.12);
  --shadow-lg:0 0 2px 0 rgba(145,158,171,.24),0 24px 48px -8px rgba(110,80,40,.22);
  --shadow-primary:0 8px 16px 0 color-mix(in srgb,var(--c-primary) 30%,transparent);
  --font:'Heebo',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --ease:cubic-bezier(.32,.72,0,1);
  color-scheme:light;
}
html[data-theme="rose"]  {--c-primary:#D9576F;--c-primary-dark:#A93650;--c-primary-soft:#FBE1E6;--c-bg:#FFF6F7;--c-surface-2:#FCEEF0}
html[data-theme="sky"]   {--c-primary:#2F7FD9;--c-primary-dark:#1C5DA8;--c-primary-soft:#DCEBFB;--c-bg:#F4F9FF;--c-surface-2:#EAF3FD}
html[data-theme="garden"]{--c-primary:#2E9D6A;--c-primary-dark:#1E7650;--c-primary-soft:#DBF3E7;--c-bg:#F5FBF7;--c-surface-2:#E9F6EE}

*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--font);background:var(--c-bg);color:var(--c-text);line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden;min-height:100dvh}
button{font:inherit;color:inherit;cursor:pointer}
img{max-width:100%;display:block}
.tnum{font-variant-numeric:tabular-nums}
[hidden]{display:none!important}

.wrap{max-inline-size:560px;margin-inline:auto;padding-inline:16px;padding-block:20px 40px}
.h1{font-size:clamp(26px,7vw,34px);font-weight:900;line-height:1.15;letter-spacing:-.01em;margin:0;text-wrap:balance}
.h2{font-size:20px;font-weight:800;margin:0;text-wrap:balance}
.lead{color:var(--c-muted);font-size:16px;margin:0;text-wrap:pretty}
.caption{color:var(--c-faint);font-size:13px}

.card{background:var(--c-surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}
.stack{display:flex;flex-direction:column;gap:16px}
.row{display:flex;gap:12px;align-items:center}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-block-size:52px;padding-inline:24px;border:0;border-radius:var(--radius-sm);
  background:var(--c-primary);color:var(--c-primary-ink);font-weight:800;font-size:17px;box-shadow:var(--shadow-primary);transition:transform .15s var(--ease),background .2s;text-decoration:none}
.btn:active{transform:scale(.98)}
.btn:hover{background:var(--c-primary-dark)}
.btn.block{inline-size:100%}
.btn.ghost{background:transparent;color:var(--c-text);border:.5px solid var(--c-border-2);box-shadow:none;font-weight:700}
.btn.ghost:hover{background:var(--c-surface-2)}
.btn.soft{background:var(--c-primary-soft);color:var(--c-primary-dark);box-shadow:none}
.btn[disabled]{opacity:.45;pointer-events:none}
.btn svg{inline-size:20px;block-size:20px}

.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:14px;font-weight:700;color:var(--c-muted)}
.input{inline-size:100%;min-block-size:52px;padding-inline:14px;border:.5px solid var(--c-border-2);border-radius:var(--radius-sm);background:var(--c-surface);
  font:500 16px var(--font);color:var(--c-text)}
.input:focus{outline:none;border-color:var(--c-primary);box-shadow:0 0 0 3px var(--c-primary-soft)}
textarea.input{min-block-size:96px;padding-block:12px;resize:vertical}

.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:.5px solid var(--c-border-2);background:var(--c-surface);border-radius:var(--radius-full);padding:8px 14px;font-size:15px;font-weight:600;min-block-size:40px}
.chip[aria-pressed="true"]{background:var(--c-primary);border-color:var(--c-primary);color:var(--c-primary-ink)}

.progress{display:flex;gap:6px}
.progress i{flex:1;block-size:4px;border-radius:4px;background:var(--c-border)}
.progress i.on{background:var(--c-primary)}

.label{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:800;border-radius:6px;padding:2px 8px;background:var(--c-primary-soft);color:var(--c-primary-dark)}

.toast{position:fixed;inset-inline:16px;inset-block-end:calc(16px + env(safe-area-inset-bottom,0px));z-index:50;background:var(--c-text);color:#fff;border-radius:12px;
  padding:14px 16px;font-weight:600;box-shadow:var(--shadow-lg);transform:translateY(140%);transition:transform .35s var(--ease)}
.toast.on{transform:none}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
:focus-visible{outline:3px solid var(--c-primary);outline-offset:2px}