:root{
  --bg:#F7F1E6; --card:#FFFCF6; --accent:#A9603C; --accent-d:#8C4A2B;
  --sos:#B0472F; --sos-bg:#F6DFD6; --sos-line:rgba(176,71,47,.25); --sos-tx:#8E3B26; --sos-sub:#A05B44;
  --ok-bg:#EAEDDF; --ok:#6B7A52; --text:#33291F; --text2:#6E6258; --muted:#8A7A67;
  --border:#EDE2CF; --border2:#E3D8C6; --ic-bg:#F0E4D0; --logo-bg:#F0DFCC; --placeholder:#A99A85;
  --on-accent:#FFF9F1;
}
:root[data-theme="dark"]{
  --bg:#211A14; --card:#2C241C; --accent:#A9603C; --accent-d:#D9A275;
  --sos:#B0472F; --sos-bg:rgba(176,71,47,.16); --sos-line:rgba(217,124,94,.3); --sos-tx:#E8A28D; --sos-sub:#C58A75;
  --ok-bg:rgba(107,122,82,.22); --ok:#A6B884; --text:#F1E8DA; --text2:#A2917D; --muted:#A2917D;
  --border:rgba(241,232,218,.1); --border2:rgba(241,232,218,.12); --ic-bg:#3A2E22; --logo-bg:#3A2E22; --placeholder:#7A6B58;
  --on-accent:#FFF9F1;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#211A14; --card:#2C241C; --accent-d:#D9A275;
    --sos-bg:rgba(176,71,47,.16); --sos-line:rgba(217,124,94,.3); --sos-tx:#E8A28D; --sos-sub:#C58A75;
    --ok-bg:rgba(107,122,82,.22); --ok:#A6B884; --text:#F1E8DA; --text2:#A2917D; --muted:#A2917D;
    --border:rgba(241,232,218,.1); --border2:rgba(241,232,218,.12); --ic-bg:#3A2E22; --logo-bg:#3A2E22; --placeholder:#7A6B58;
  }
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%}
body{background:var(--bg);color:var(--text);font-family:'Golos Text',system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden}
.serif{font-family:'Playfair Display',serif;letter-spacing:-.01em}
#app{max-width:440px;margin:0 auto;height:100dvh;position:relative}
.screen{position:absolute;inset:0;display:none;flex-direction:column;background:var(--bg)}
.screen.active{display:flex;animation:fade .22s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.scroll{flex:1;overflow-y:auto;padding:14px 22px 8px;display:flex;flex-direction:column;gap:15px;-webkit-overflow-scrolling:touch}
.foot{padding:10px 16px calc(14px + env(safe-area-inset-bottom))}
.foot-hint{text-align:center;font-size:12.5px;color:var(--muted);padding-top:10px}

/* buttons */
.btn{width:100%;height:56px;border:0;border-radius:18px;font-family:inherit;font-size:17px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px}
.btn-primary{background:var(--accent);color:var(--on-accent)}
.btn-primary:disabled{opacity:.72}
.btn-ghost{background:var(--card);border:1px solid var(--border2);color:var(--accent-d)}
.back{align-self:flex-start;background:none;border:0;font-family:inherit;font-size:15px;font-weight:500;color:var(--accent-d);cursor:pointer;padding:2px 0}
.back.inl{font-size:20px;padding:0 4px 0 0}
.chev{font-size:20px;opacity:.6}
.spinner{width:18px;height:18px;border-radius:50%;border:2.5px solid rgba(255,249,241,.35);border-top-color:#FFF9F1;animation:spin .7s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* onboarding */
.ob{flex:1;display:flex;flex-direction:column;justify-content:center;gap:20px;padding:0 28px}
.ob-logo{width:76px;height:76px;border-radius:50%;background:var(--logo-bg);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:34px;font-weight:600;color:var(--accent-d)}
.ob-title{font-size:30px;font-weight:600;line-height:1.22;margin:0}
.ob-sub{font-size:16px;line-height:1.55;color:var(--text2);margin:0}
.ob-note{background:var(--card);border:1px solid var(--border);border-radius:20px;padding:16px 18px;font-size:14.5px;line-height:1.5;color:var(--text2)}
.ob-note b{color:var(--text);font-weight:600}

/* home */
.home-head{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 0}
.brand{display:flex;align-items:center;gap:12px}
.brand-logo{width:40px;height:40px;border-radius:50%;background:var(--logo-bg);display:flex;align-items:center;justify-content:center;font-family:'Playfair Display',serif;font-size:19px;font-weight:600;color:var(--accent-d)}
.brand-name{font-size:24px;font-weight:600}
.icon-btn{width:44px;height:44px;border-radius:50%;background:var(--card);border:1px solid var(--border);font-size:19px;cursor:pointer}
.card-assistant{width:100%;text-align:left;border:0;cursor:pointer;background:var(--accent);border-radius:24px;padding:20px;display:flex;align-items:center;gap:16px;box-shadow:0 14px 28px rgba(140,74,43,.28)}
.ca-icon{width:52px;height:52px;border-radius:50%;background:rgba(255,249,241,.18);display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0}
.ca-title{font-size:19px;font-weight:600;color:#FFF9F1}
.ca-sub{font-size:13.5px;line-height:1.4;color:rgba(255,249,241,.8);margin-top:3px}
.ca-body{flex:1}
.card-assistant .chev{color:rgba(255,249,241,.7);opacity:1}
.card-sos{width:100%;text-align:left;cursor:pointer;background:var(--sos-bg);border:1px solid var(--sos-line);border-radius:24px;padding:17px 20px;display:flex;align-items:center;gap:16px}
.cs-icon{width:46px;height:46px;border-radius:50%;background:rgba(176,71,47,.14);display:flex;align-items:center;justify-content:center;font-size:21px;flex-shrink:0}
.cs-title{font-size:17px;font-weight:600;color:var(--sos-tx)}
.cs-sub{font-size:13px;line-height:1.4;color:var(--sos-sub);margin-top:2px}
.cs-body{flex:1}
.sos-chev{color:var(--sos-sub)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tile{text-align:left;cursor:pointer;background:var(--card);border:1px solid var(--border);border-radius:22px;padding:16px;display:flex;flex-direction:column;gap:10px}
.tile-ic{width:46px;height:46px;border-radius:50%;background:var(--ic-bg);display:flex;align-items:center;justify-content:center;font-size:20px}
.tile-t{font-size:17px;font-weight:600;color:var(--text)}
.tile-s{font-size:12.5px;line-height:1.35;color:var(--muted)}
.home-foot{margin-top:auto;text-align:center;font-size:12px;color:var(--muted);padding:8px 0 6px}

/* section + forms */
.sec-head{display:flex;align-items:center;gap:14px}
.sec-ic{width:52px;height:52px;border-radius:50%;background:var(--ic-bg);display:flex;align-items:center;justify-content:center;font-size:23px}
.sec-head h2{font-size:26px;font-weight:600;margin:0}
.sec-desc{font-size:15px;line-height:1.5;color:var(--text2);margin:0}
form{display:flex;flex-direction:column;gap:14px}
.fld{display:flex;flex-direction:column;gap:7px}
.fld-l{font-size:13px;font-weight:600;color:var(--text2);display:flex;justify-content:space-between;align-items:baseline}
.fld-l em{font-style:normal;font-size:12px;color:var(--placeholder);font-weight:500}
.fld input,.fld select,.fld textarea{font-family:inherit;font-size:16px;color:var(--text);background:var(--card);border:1px solid var(--border2);border-radius:16px;padding:15px 18px;outline:none;width:100%}
.fld input::placeholder,.fld textarea::placeholder{color:var(--placeholder)}
.fld select{appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8'><path d='M1 1l5 5 5-5' stroke='%238A7A67' stroke-width='1.6' fill='none'/></svg>");background-repeat:no-repeat;background-position:right 18px center}
.fld textarea{min-height:70px;resize:none;line-height:1.5}
.fld .ta-big{min-height:150px}
.row{display:flex;gap:12px}
.fld-grow{flex:1}
.privacy{text-align:center;font-size:12px;color:var(--muted);padding-top:2px}

/* submitted */
.done-wrap{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:0 34px;text-align:center}
.done-check{width:104px;height:104px;border-radius:50%;background:var(--ok-bg);display:flex;align-items:center;justify-content:center;font-size:44px;color:var(--ok);font-weight:600}
.done-check.sm{width:64px;height:64px;font-size:28px;margin-top:4px}
.done-wrap h2{font-size:28px;font-weight:600;margin:0}
.done-text{font-size:16px;line-height:1.55;color:var(--text2);margin:0}

/* sos */
.sos-h{font-size:30px;font-weight:600;line-height:1.2;margin:4px 0 0}
.sos-lead{font-size:15.5px;line-height:1.5;color:var(--text2);margin:0}
.sos-big{cursor:pointer;border:0;background:var(--sos);border-radius:28px;padding:30px 24px;display:flex;flex-direction:column;align-items:center;gap:12px;box-shadow:0 18px 36px rgba(176,71,47,.32)}
.sos-big-ic{font-size:36px}
.sos-big-t{font-size:21px;font-weight:600;color:#FFF6F1;text-align:center;line-height:1.3}
.sos-hint-l{font-size:13px;font-weight:600;color:var(--muted);margin-top:6px}
.toggle-row{display:flex;align-items:center;justify-content:space-between;background:var(--card);border:1px solid var(--border2);border-radius:16px;padding:13px 18px;font-size:15px}
.tgl{appearance:none;width:48px;height:29px;border-radius:15px;background:var(--border2);position:relative;cursor:pointer;transition:.2s;flex-shrink:0}
.tgl:checked{background:var(--accent)}
.tgl::after{content:"";position:absolute;top:2.5px;left:2.5px;width:24px;height:24px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:.2s}
.tgl:checked::after{left:21px}
.sos-foot{text-align:center;font-size:12px;color:var(--muted);padding:6px 0 12px}
.sos-h2{font-size:30px;font-weight:600;line-height:1.2;margin:8px 0 0}
.steps{display:flex;flex-direction:column;gap:10px}
.step{background:var(--card);border:1px solid var(--border);border-radius:18px;padding:15px 18px;display:flex;gap:14px;align-items:center;font-size:16px;font-weight:500;line-height:1.4}
.step-n{width:32px;height:32px;border-radius:50%;background:var(--ic-bg);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:600;color:var(--accent-d);flex-shrink:0}
.sos-rea{text-align:center;font-size:13.5px;color:var(--muted);padding:4px 0 8px}
.sos-screen .sos-big{width:100%}

/* help menu */
.menu-list{display:flex;flex-direction:column;gap:10px}
.menu-row{width:100%;text-align:left;cursor:pointer;background:var(--card);border:1px solid var(--border);border-radius:18px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between}
.mr-t{font-size:16px;font-weight:600}
.mr-s{font-size:13px;color:var(--muted);margin-top:3px}

/* chat */
.chat-head{display:flex;align-items:center;gap:12px;padding:12px 22px;border-bottom:1px solid var(--border)}
.ch-name{font-size:17px;font-weight:600}
.ch-status{font-size:12px;color:var(--ok)}
.chat-log{flex:1;overflow-y:auto;padding:16px 18px;display:flex;flex-direction:column;gap:10px}
.bubble{max-width:82%;font-size:15.5px;line-height:1.5;padding:13px 16px;border-radius:20px}
.bubble.bot{background:var(--card);border:1px solid var(--border);border-bottom-left-radius:8px;align-self:flex-start}
.bubble.me{background:var(--ic-bg);border-bottom-right-radius:8px;align-self:flex-end}
.bubble.typing{display:flex;gap:5px;align-items:center}
.bubble.typing i{width:7px;height:7px;border-radius:50%;background:var(--placeholder);animation:blink 1.2s infinite}
.bubble.typing i:nth-child(2){animation-delay:.2s}.bubble.typing i:nth-child(3){animation-delay:.4s}
@keyframes blink{0%,60%,100%{opacity:.3}30%{opacity:1}}
.chat-chips{display:flex;gap:8px;padding:0 18px 10px;flex-wrap:wrap}
.chip{border:0;cursor:pointer;border-radius:999px;padding:10px 16px;font-family:inherit;font-size:14px;font-weight:600}
.chip-primary{background:var(--accent);color:var(--on-accent)}
.chip-sos{background:var(--sos-bg);color:var(--sos-tx);border:1px solid var(--sos-line)}
.chat-disc{text-align:center;font-size:11.5px;color:var(--muted);padding:0 18px 8px}
.chat-input{display:flex;gap:10px;align-items:center;padding:0 16px calc(12px + env(safe-area-inset-bottom))}
.chat-input input{flex:1;background:var(--card);border:1px solid var(--border2);border-radius:999px;padding:14px 18px;font-family:inherit;font-size:15px;color:var(--text);outline:none}
.send-btn{width:48px;height:48px;border-radius:50%;border:0;background:var(--accent);color:#FFF9F1;font-size:20px;cursor:pointer;flex-shrink:0}

/* wiki */
.wiki-h{font-size:30px;font-weight:600;margin:2px 0 0}
.wiki-sub{font-size:14px;color:var(--muted);margin-top:-8px}
.wiki-list{display:flex;flex-direction:column;gap:9px}
.wiki-row{text-align:left;cursor:pointer;background:var(--card);border:1px solid var(--border);border-radius:18px;padding:14px 17px;display:flex;align-items:center;gap:12px}
.wiki-row .t{font-size:16px;font-weight:600}
.wiki-row .s{font-size:13px;color:var(--muted);margin-top:3px}
.wiki-row .body-hold{flex:1}
.art-h{font-size:27px;font-weight:600;line-height:1.25;margin:2px 0 0}
.art-meta{font-size:12.5px;color:var(--placeholder)}
.art-body{font-size:16px;line-height:1.62;color:var(--text)}
.art-body p{margin:0 0 12px}
.art-cta{background:var(--ic-bg);border-radius:20px;padding:16px 18px;display:flex;flex-direction:column;gap:10px;margin-top:6px}
.art-cta-t{font-size:15px;font-weight:600}
.art-cta-s{font-size:13.5px;line-height:1.45;color:var(--text2)}
.art-cta .chip{width:fit-content}

/* theme toggle (demo only) */
#theme-toggle{position:fixed;right:12px;bottom:12px;width:38px;height:38px;border-radius:50%;border:1px solid var(--border2);background:var(--card);color:var(--text2);font-size:17px;cursor:pointer;opacity:.5;z-index:50}
#theme-toggle:hover{opacity:1}