/* Рядом — тёплая бумага, письмо от руки, погода внутри. Никаких пузырей-градиентов. */
:root{
  --bg:#f5efe6; --card:#fffaf3; --ink:#2b2a33; --muted:#7d7469; --berry:#8e2c48; --berry-2:#6f2038;
  --sage:#6f8f7a; --sage-soft:#e3ebe4; --line:#e4dbcd; --rose:#f1dfd8;
  --safe-b:env(safe-area-inset-bottom,0px); --safe-t:env(safe-area-inset-top,0px);
  --font:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --display:"Lora",Georgia,serif;
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{font-family:var(--font);color:var(--ink);background:#d9cfc1;-webkit-font-smoothing:antialiased;font-size:16px;line-height:1.5}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
input{font:inherit;color:var(--ink)}
img{display:block;max-width:100%}

.stage{min-height:100%;display:flex;align-items:center;justify-content:center;gap:56px;padding:40px 24px}
.stage-note{max-width:320px;color:#4a443c}
.stage-note h1{font-family:var(--display);font-style:italic;font-weight:600;font-size:48px;color:var(--berry);margin-bottom:12px}
.stage-note p{margin-bottom:12px}
.stage-hint{font-size:14px}.stage-mode{font-size:13px;color:var(--muted)}
.phone{width:390px;height:min(844px,calc(100vh - 40px));background:#1d1a1f;border-radius:54px;padding:14px;box-shadow:0 30px 80px rgba(50,30,30,.35);position:relative;flex:none}
.phone::before{content:"";position:absolute;top:26px;left:50%;transform:translateX(-50%);width:118px;height:34px;background:#1d1a1f;border-radius:20px;z-index:5}
.app{width:100%;height:100%;background:var(--bg);border-radius:42px;overflow:hidden;position:relative;--safe-t:52px;--safe-b:22px}
@media (max-width:760px){
  body{background:var(--bg)}
  .stage{padding:0;gap:0;display:block;min-height:100dvh}
  .stage-note{display:none}
  .phone{width:100%;height:100dvh;padding:0;border-radius:0;box-shadow:none}
  .phone::before{display:none}
  .app{border-radius:0;--safe-t:env(safe-area-inset-top,0px);--safe-b:env(safe-area-inset-bottom,0px)}
}

.screen{position:absolute;inset:0;display:none;flex-direction:column;padding-top:var(--safe-t);background:var(--bg)}
.screen::before{content:"";position:absolute;inset:0;background:var(--noise);pointer-events:none}
.screen.active{display:flex}
.screen>*{position:relative}
.top{display:flex;align-items:center;gap:12px;padding:14px 22px 8px;min-height:56px}
.brand{font-family:var(--display);font-style:italic;font-weight:600;font-size:30px;color:var(--berry);flex:1;line-height:1}
.back{font-size:34px;line-height:1;color:var(--berry);width:36px;margin-left:-8px}
.chat-title{flex:1;font-weight:500;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;font-family:var(--display);font-style:italic}
.quota{font-size:12.5px;color:var(--muted);border:1px solid var(--line);padding:5px 10px;border-radius:3px;white-space:nowrap;background:var(--card)}
.quota.pro{border-color:var(--sage);color:var(--sage);font-weight:600}
.quota.low{color:var(--berry);border-color:var(--berry)}

/* ---- приветствие: окно с дождём и чашкой — единственная иллюстрация ---- */
.screen[data-screen=welcome],.screen[data-screen=intake]{padding:calc(var(--safe-t) + 20px) 28px calc(var(--safe-b) + 18px)}
.welcome{flex:1;display:flex;flex-direction:column;justify-content:center}
.window{width:200px;height:230px;margin:0 auto 34px;border:3px solid var(--ink);border-radius:90px 90px 6px 6px;position:relative;background:linear-gradient(180deg,#cfd7dc 0,#e9e3d6 100%);overflow:hidden}
.window::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:3px;background:var(--ink);margin-left:-1.5px}
.window::after{content:"";position:absolute;left:0;right:0;top:46%;height:3px;background:var(--ink)}
.rain{position:absolute;inset:0;background:repeating-linear-gradient(115deg,transparent 0 14px,rgba(43,42,51,.35) 14px 15px,transparent 15px 30px);background-size:100% 40px;animation:rain 1.6s linear infinite;opacity:.8}
@keyframes rain{to{background-position:0 40px}}
.cup{position:absolute;left:50%;bottom:-6px;width:66px;height:44px;margin-left:-40px;background:var(--berry);border-radius:4px 4px 22px 22px;border:3px solid var(--ink);z-index:2}
.cup::before{content:"";position:absolute;right:-20px;top:6px;width:18px;height:20px;border:3px solid var(--ink);border-left:0;border-radius:0 12px 12px 0}
.cup::after{content:"";position:absolute;left:14px;top:-26px;width:10px;height:18px;border-left:3px solid var(--ink);border-radius:50%;opacity:.55;box-shadow:16px -4px 0 -1px var(--ink)}
@media (prefers-reduced-motion:reduce){.rain{animation:none}}
.welcome h2{font-family:var(--display);font-weight:500;font-size:30px;line-height:1.15;margin-bottom:14px;letter-spacing:-.01em}
.u{font-style:italic;color:var(--berry);position:relative;white-space:nowrap}
.u::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:8px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 8' preserveAspectRatio='none'%3E%3Cpath d='M1 5c20-4 40 3 60-1s30-2 38 1' fill='none' stroke='%238e2c48' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E") 0 0/100% 100% no-repeat}
.welcome p{color:var(--muted);max-width:34ch}
.legal{font-size:12px;color:var(--muted);margin-top:12px}
.intake{flex:1;overflow:auto}
.intake h2{font-family:var(--display);font-weight:500;font-size:26px;margin:8px 0 12px}
.intake input{width:100%;height:50px;border:0;border-bottom:1.5px solid var(--ink);background:transparent;padding:0 2px;outline:none;margin-bottom:30px;font-family:var(--display);font-style:italic;font-size:22px}
.intake input::placeholder{color:#b8ada0;font-style:normal;font-family:var(--font);font-size:16px}
.hint{font-size:14px;color:var(--muted);margin:-6px 0 12px}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.chips button{padding:9px 14px;border-radius:3px;background:var(--card);border:1px solid var(--line);font-size:15px}
.chips button.on{background:var(--ink);border-color:var(--ink);color:#fff}

.btn-primary{width:100%;height:54px;border-radius:4px;background:var(--berry);color:#fff;font-weight:600;font-size:16px;flex:none;letter-spacing:.01em}
.btn-primary:active{background:var(--berry-2)}
.btn-ghost{width:100%;height:46px;border-radius:4px;border:1px solid var(--ink);color:var(--ink);font-weight:500;background:transparent}
.btn-link{width:100%;padding:14px;color:var(--muted);font-size:15px}

/* ---- главная ---- */
.home-body{flex:1;overflow:auto;padding:4px 22px calc(var(--safe-b) + 90px)}
.greet{font-family:var(--display);font-weight:500;font-size:32px;line-height:1.1;letter-spacing:-.01em}
.greet-sub{color:var(--muted);margin:6px 0 14px;font-size:15px}
.moods{display:flex;gap:4px;margin-bottom:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0}
.moods button{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;padding:8px 0 6px;font-size:11.5px;color:var(--muted);border-radius:4px}
.moods button.on{background:var(--card);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.w{width:34px;height:34px;display:block;background:currentColor;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat;color:var(--ink);opacity:.75}
.moods button.on .w{opacity:1;color:var(--berry)}
.w-storm{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 15a4 4 0 0 1-.5-8A5.5 5.5 0 0 1 17 8a3.5 3.5 0 0 1 .5 7'/%3E%3Cpath d='M13 12l-2.5 4.5H14L11 21'/%3E%3C/svg%3E")}
.w-rain{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 14a4 4 0 0 1-.5-8A5.5 5.5 0 0 1 17 7a3.5 3.5 0 0 1 .5 7'/%3E%3Cpath d='M8 17l-1 3M12 17l-1 3M16 17l-1 3'/%3E%3C/svg%3E")}
.w-fog{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M4 9h13M6 13h14M4 17h11'/%3E%3C/svg%3E")}
.w-cloud{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17a4 4 0 0 1-.5-8A5.5 5.5 0 0 1 17 10a3.5 3.5 0 0 1 .5 7z'/%3E%3C/svg%3E")}
.w-sun{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 3v2M12 19v2M3 12h2M19 12h2M5.6 5.6l1.4 1.4M17 17l1.4 1.4M5.6 18.4L7 17M17 7l1.4-1.4'/%3E%3C/svg%3E")}
.talk{width:100%;padding:24px 22px;background:var(--card);border:1px solid var(--line);border-left:5px solid var(--berry);text-align:left;display:flex;flex-direction:column;gap:2px;margin-bottom:12px;border-radius:3px;box-shadow:0 10px 24px rgba(80,50,40,.08)}
.talk:active{background:var(--rose)}
.talk-title{font-family:var(--display);font-style:italic;font-size:30px;font-weight:500;color:var(--berry);line-height:1}
.talk-sub{font-size:14px;color:var(--muted);margin-top:4px}
.modes{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--line)}
.mode{text-align:left;padding:14px 4px;border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:1px;position:relative;padding-right:28px}
.mode::after{content:"→";position:absolute;right:6px;top:50%;transform:translateY(-50%);color:var(--muted);font-family:var(--display)}
.mode:active{background:var(--card)}
.mode b{font-weight:600;font-size:16px}.mode span{font-size:13px;color:var(--muted)}
.calm-mode b{color:var(--sage)}

/* ---- таббар ---- */
.tabbar{position:absolute;left:0;right:0;bottom:0;display:flex;background:var(--bg);border-top:1px solid var(--line);padding:8px 8px calc(var(--safe-b) + 6px);z-index:3}
.tabbar button{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;font-size:11px;color:var(--muted);padding:6px 0;font-weight:500}
.tabbar button.on{color:var(--berry)}
.tabbar[hidden]{display:none}
.ico{width:24px;height:24px;display:block;background:currentColor;-webkit-mask:var(--i) center/contain no-repeat;mask:var(--i) center/contain no-repeat}
.ico-home{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 8a4 4 0 0 1 4-4h6a4 4 0 0 1 4 4v5a4 4 0 0 1-4 4h-4l-4 3v-3a4 4 0 0 1-2-4z'/%3E%3C/svg%3E")}
.ico-journal{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='4' width='14' height='16' rx='1'/%3E%3Cpath d='M9 9h6M9 13h6M9 17h3'/%3E%3C/svg%3E")}
.ico-profile{--i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8.5' r='3.5'/%3E%3Cpath d='M5 19.5c1-3.5 3.8-5 7-5s6 1.5 7 5'/%3E%3C/svg%3E")}

/* ---- чат: письма, не пузыри ---- */
.thread{flex:1;overflow:auto;padding:8px 22px 16px;display:flex;flex-direction:column;gap:18px}
.msg{max-width:100%;font-size:15.5px;line-height:1.55;word-wrap:break-word}
.msg.user{align-self:flex-end;max-width:86%;font-family:var(--display);font-style:italic;font-size:17px;color:var(--berry);text-align:right;padding-left:20px;border-right:2px solid var(--berry);padding-right:12px}
.msg.user img{border-radius:3px;max-height:220px;margin:0 0 6px auto;border:1px solid var(--line)}
.msg.ai{align-self:stretch;background:var(--card);border:1px solid var(--line);padding:14px 16px;border-radius:3px;position:relative}
.msg.ai::before{content:"";position:absolute;left:14px;right:14px;top:-1px;height:1px;background:var(--berry);opacity:.5}
.msg.ai p{margin:0 0 8px}.msg.ai p:last-child{margin:0}
.msg.ai ol,.msg.ai ul{margin:0 0 8px 20px}
.msg.ai strong{color:var(--berry);font-weight:600;font-family:var(--display);font-style:italic;font-size:16.5px}
.msg.ai em{color:var(--muted);font-style:normal;font-size:13px}
.msg.ai .cursor{display:inline-block;width:2px;height:16px;background:var(--berry);vertical-align:-3px;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:0}}
.msg.err{align-self:stretch;background:#f7e5e2;color:#7a1f12;padding:12px 14px;font-size:14px;border-radius:3px}
.msg.err b{display:block}
.sos-card{align-self:stretch;background:var(--sage-soft);border-left:4px solid var(--sage);padding:14px 16px;font-size:14px;color:#2f3d34;border-radius:3px}
.sos-card b{display:block;font-family:var(--display);font-size:17px;margin-bottom:4px;color:#2f3d34}
.sos-card a{color:var(--sage);font-weight:600;text-decoration:none;border-bottom:1px solid}
.composer{display:flex;gap:8px;align-items:center;padding:10px 16px calc(var(--safe-b) + 10px);border-top:1px solid var(--line);background:var(--bg)}
.comp-img{width:42px;height:42px;border-radius:3px;border:1px solid var(--line);background:var(--card);display:flex;align-items:center;justify-content:center;flex:none;color:var(--berry)}
.comp-img svg{width:22px}
.composer input{flex:1;height:44px;border:0;border-bottom:1.5px solid var(--ink);background:transparent;padding:0 6px;outline:none;min-width:0;font-family:var(--display);font-style:italic;font-size:17px}
.composer input::placeholder{color:#b8ada0;font-style:normal;font-family:var(--font);font-size:15px}
.comp-send{width:42px;height:42px;border-radius:3px;background:var(--berry);color:#fff;font-size:20px;font-weight:600;flex:none}
.comp-send:disabled{opacity:.4}

/* ---- дневник ---- */
.journal{flex:1;overflow:auto;padding:4px 22px calc(var(--safe-b) + 90px)}
.mood-strip{display:flex;gap:6px;margin:6px 0 18px;align-items:flex-end;border-bottom:1px solid var(--line);padding-bottom:8px}
.mood-strip div{flex:1;text-align:center;font-size:11px;color:var(--muted)}
.mood-strip i{display:block;height:44px;border-radius:2px;background:var(--rose);margin-bottom:4px;opacity:.35}
.mood-strip i.m1{background:var(--berry);height:14px;margin-top:30px;opacity:1}.mood-strip i.m2{background:var(--berry);height:22px;margin-top:22px;opacity:.7}
.mood-strip i.m3{background:var(--muted);height:30px;margin-top:14px;opacity:.5}.mood-strip i.m4{background:var(--sage);height:38px;margin-top:6px;opacity:.7}.mood-strip i.m5{background:var(--sage);opacity:1}
.j-item{display:flex;gap:12px;padding:14px 2px;border-bottom:1px solid var(--line);align-items:center;text-align:left;width:100%}
.j-item .ph{width:40px;height:40px;border-radius:50%;border:1px solid var(--berry);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-style:italic;font-size:20px;color:var(--berry);flex:none}
.j-item b{display:block;font-weight:500;font-size:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:var(--display)}
.j-item span{font-size:13px;color:var(--muted)}
.j-item div{min-width:0;flex:1}
.empty{padding:50px 24px;text-align:center;color:var(--muted)}
.empty b{display:block;color:var(--ink);font-family:var(--display);font-size:22px;font-weight:500;margin-bottom:6px}

/* ---- профиль ---- */
.prof{flex:1;overflow:auto;padding:4px 22px calc(var(--safe-b) + 90px)}
.prof-card{padding:18px;background:var(--card);border:1px solid var(--line);border-left:5px solid var(--berry);margin-bottom:12px;border-radius:3px}
.prof-card.pro{border-left-color:var(--sage)}
.prof-card b{display:block;font-family:var(--display);font-style:italic;font-size:26px;margin-bottom:2px}
.prof-card span{font-size:14px;color:var(--muted)}
.prof-card button{margin-top:12px;height:40px;padding:0 16px;border-radius:3px;background:var(--berry);color:#fff;font-weight:600}
.prof-row{display:flex;justify-content:space-between;padding:14px 2px;border-bottom:1px solid var(--line)}
.prof-row b{font-family:var(--display);font-style:italic;font-weight:500;font-size:18px}
.sos{margin-top:20px;background:var(--sage-soft);border-left:4px solid var(--sage);padding:14px 16px;font-size:14px;border-radius:3px}
.sos b{display:block;margin-bottom:4px;font-family:var(--display)}
.prof .btn-ghost{margin-top:16px}
.prof .legal{margin-top:16px;text-align:left}

/* ---- шторки ---- */
.sheet{position:absolute;inset:0;background:rgba(43,42,51,.5);z-index:10;display:flex;align-items:flex-end}
.sheet[hidden]{display:none}
.sheet-body{width:100%;background:var(--bg);border-top:3px solid var(--berry);padding:16px 24px calc(var(--safe-b) + 16px);max-height:94%;overflow:auto;animation:up .28s ease-out}
@keyframes up{from{transform:translateY(40px);opacity:0}}
.sheet-grip{display:none}
.sheet h2{font-family:var(--display);font-weight:500;font-size:26px;line-height:1.15;margin-bottom:8px}
.sheet p{color:var(--muted);margin-bottom:16px;font-size:15px}
.plans{display:flex;flex-direction:column;gap:10px;margin-bottom:14px}
.plan{position:relative;text-align:left;padding:14px 16px;border:1px solid var(--line);background:var(--card);display:flex;flex-direction:column;gap:2px;border-radius:3px}
.plan.on{border-color:var(--berry);box-shadow:inset 0 0 0 1px var(--berry)}
.plan b{font-weight:600;font-size:17px}.plan span{font-size:13px;color:var(--muted)}
.plan i{position:absolute;top:-10px;right:14px;font-style:italic;font-family:var(--display);font-size:13px;background:var(--berry);color:#fff;padding:2px 8px;border-radius:2px}
.pay-alt{text-align:center;font-size:13px;color:var(--muted);margin:10px 0 0}
.preview-img{width:100%;max-height:360px;object-fit:contain;border:1px solid var(--line);background:var(--card);margin-bottom:12px}
#previewNote{width:100%;height:46px;border:0;border-bottom:1.5px solid var(--ink);background:transparent;padding:0 4px;margin-bottom:14px;outline:none;font-family:var(--display);font-style:italic;font-size:17px}

/* ---- дыхание ---- */
.breath-body{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:0;max-height:none;background:var(--sage-soft)}
.breath-circle{width:220px;height:220px;border-radius:50%;border:2px solid var(--sage);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-style:italic;font-size:26px;color:#2f3d34;margin-bottom:36px;position:relative;animation:breath 19s ease-in-out infinite;background:var(--card)}
.breath-circle::before{content:"";position:absolute;inset:-22px;border-radius:50%;border:1px dashed var(--sage);opacity:.6}
@keyframes breath{0%{transform:scale(.7)}21%{transform:scale(1)}58%{transform:scale(1)}100%{transform:scale(.7)}}
@media (prefers-reduced-motion:reduce){.breath-circle{animation:none}.sheet-body{animation:none}}
.breath-hint{color:#2f3d34;text-align:center;max-width:28ch;margin-bottom:28px}
.breath-body .btn-primary{background:var(--sage)}