/* Дурсамжийн бүртгэл — calm memorial palette: khadag sky-blue accent on cool paper */
:root{
  --bg:#f2f4f6; --surface:#ffffff; --fg:#1b2430; --muted:#5d6876; --line:#d8dee5;
  --accent:#2c6a99; --accent-fg:#ffffff; --accent-soft:#e1ecf5; --danger:#b03f2d; --ok:#2f7a4f; --warn:#9a6a12;
  --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --body:"Golos Text",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --r:10px; color-scheme:light;
}
@media (prefers-color-scheme:dark){:root{
  --bg:#0f141a; --surface:#161d26; --fg:#e6ebf0; --muted:#97a3b0; --line:#28323e;
  --accent:#86b8df; --accent-fg:#0f141a; --accent-soft:#1b2b3a; --danger:#e3836f; --ok:#79c79a; --warn:#e0b45c; color-scheme:dark}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.55 var(--body)}
a{color:var(--accent)}
img{max-width:100%}
[hidden]{display:none!important}
.wrap{max-width:860px;margin:0 auto;padding-block:22px 64px;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.narrow{max-width:520px}
h1,h2,h3{font-family:var(--display);font-weight:600;line-height:1.15;text-wrap:balance;margin:0}
h1{font-size:2.2rem} h2{font-size:1.6rem} h3{font-size:1.2rem}
p{margin:0}
.eyebrow{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:500}
.muted{color:var(--muted)} .small{font-size:.84rem}
.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.between{justify-content:space-between} .center{justify-content:center}
.stack{display:grid;gap:14px}
main>*+*{margin-top:18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.grid3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:10px}
fieldset{margin:0;min-width:0}
fieldset.card{border:1px solid var(--line)}
legend{font-family:var(--display);font-weight:600;font-size:1.15rem;padding:0 6px}
.contract-card{display:grid;gap:8px}
.checks{display:grid;gap:6px;font-size:.92rem}
.tick{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;font-size:.75rem;font-weight:600;margin-right:4px}
.tick.ok{background:var(--accent-soft);color:var(--ok)} .tick.no{border:1px solid var(--line);color:var(--muted)}

/* AI remembrance chat */
.chat{display:grid;gap:12px;max-width:680px;margin:0 auto}
.chat-head{display:flex;gap:12px;align-items:center}
.chat-head .name{font-family:var(--display);font-size:1.5rem;font-weight:600;line-height:1.1}
.chat-head .pill{color:var(--accent);border-color:var(--accent)}
.chat-note{font-size:.84rem;background:var(--accent-soft);border-radius:var(--r);padding:10px 12px}
.chat-log{display:grid;gap:10px;min-height:120px}
.msg{display:grid;max-width:85%}
.msg.me{justify-self:end}
.msg .b{padding:10px 14px;border-radius:16px;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.5}
.msg.me .b{background:var(--accent);color:var(--accent-fg);border-bottom-right-radius:4px}
.msg.ai .b{background:var(--surface);border:1px solid var(--line);border-bottom-left-radius:4px}
.msg .tag{font-size:.72rem;color:var(--muted);margin:3px 6px 0}
.msg.typing .b{color:var(--muted);animation:pulse 1.2s ease-in-out infinite}
.msg.err-msg .b{border-color:var(--danger);color:var(--danger)}
@keyframes pulse{50%{opacity:.4}}
.mbtns{display:flex;gap:6px;flex-wrap:wrap;margin:6px 4px 0}
.clip{margin-top:6px;display:grid;gap:2px;scroll-margin-bottom:160px}
.clip audio{width:100%;min-width:220px}
.clip video{width:100%;max-width:320px;border-radius:12px;background:#000}
.clip.err{color:var(--danger)}
.support{border:1px solid var(--danger);border-radius:var(--r);padding:12px 14px;display:grid;gap:4px;font-size:.92rem;background:var(--surface)}
.starters{display:flex;gap:8px;flex-wrap:wrap}
.chat-form{display:flex;gap:8px;align-items:flex-end;position:sticky;bottom:0;background:var(--bg);padding-block:8px calc(8px + env(safe-area-inset-bottom))}
.chat-form textarea{flex:1;min-width:0;resize:none}
.chat-foot{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;align-items:center}

/* top bar */
.bar{background:var(--surface);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10;padding-top:env(safe-area-inset-top)}
.bar-in{max-width:860px;margin:0 auto;display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-block:10px;padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
.brand{font-family:var(--display);font-weight:600;font-size:1.3rem;color:var(--fg);text-decoration:none}
.bar nav{display:flex;gap:14px;flex:1;flex-wrap:wrap}
.bar nav a{text-decoration:none;font-weight:500}
.who{position:relative}
.who summary{cursor:pointer;list-style:none;font-size:.9rem}
.who summary::-webkit-details-marker{display:none}
.role{font-size:.72rem;color:var(--muted);display:block}
.menu{position:absolute;right:0;top:calc(100% + 6px);background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 14px;display:grid;gap:8px;min-width:170px;box-shadow:0 8px 24px rgba(0,0,0,.12)}

/* controls */
button,.btn{font:inherit;font-weight:500;border-radius:999px;padding:9px 16px;border:1px solid var(--line);background:var(--surface);color:var(--fg);cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;gap:6px;line-height:1.3}
button:hover,.btn:hover{border-color:var(--accent)}
.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg)}
.danger{color:var(--danger);border-color:var(--danger)}
button.small{padding:5px 11px;font-size:.82rem}
button.link{background:none;border:none;padding:0;color:var(--accent);border-radius:0}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
label{display:grid;gap:5px;font-size:.88rem;font-weight:500}
label small{font-weight:400;color:var(--muted)}
label.check{display:flex;gap:8px;align-items:center;font-weight:400}
input:not([type=checkbox]):not([type=file]),textarea,select{font:inherit;font-size:16px;padding:10px 12px;border-radius:8px;border:1px solid var(--line);background:var(--bg);color:var(--fg);width:100%}
textarea{resize:vertical;line-height:1.6}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:18px}
.flash{padding:11px 14px;border-radius:var(--r);background:var(--accent-soft);border:1px solid var(--accent);font-size:.92rem}
.notice{padding:11px 14px;border-radius:var(--r);background:var(--accent-soft);font-size:.9rem}
.err{color:var(--danger);font-size:.9rem}
.pill{font-size:.72rem;padding:2px 9px;border-radius:999px;white-space:nowrap;border:1px solid currentColor}
.pill.ok{color:var(--ok)} .pill.warn{color:var(--warn)}
code{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.9em;overflow-wrap:anywhere}

/* auth */
.auth{max-width:420px;margin:8vh auto 0;display:grid;gap:14px}

/* stats & tables */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.stats div{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px;display:grid}
.stats b{font-size:1.6rem;font-family:var(--display);font-variant-numeric:tabular-nums}
.stats span{font-size:.8rem;color:var(--muted)}
.block{display:grid;gap:12px;padding-top:20px;border-top:1px solid var(--line);margin-top:26px}
.table-wrap{overflow-x:auto;background:var(--surface);border:1px solid var(--line);border-radius:var(--r)}
table{border-collapse:collapse;width:100%;font-size:.9rem}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:.75rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:500}
tr:last-child td{border-bottom:none}
td.num{font-variant-numeric:tabular-nums}
td.actions{display:flex;gap:6px;flex-wrap:wrap}
.people{display:grid;gap:8px}
.person{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;display:flex;gap:10px 16px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.pmain{min-width:0;overflow-wrap:anywhere}
.person .row{gap:6px}
.searchrow{display:flex;gap:8px} .searchrow input{flex:1;min-width:0}

/* memorial list */
.list{display:grid;gap:10px}
.item{display:grid;grid-template-columns:60px 1fr auto;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px 14px 10px 10px;color:inherit;text-decoration:none}
.item:hover{border-color:var(--accent)}
.thumb{width:60px;height:60px;border-radius:8px;object-fit:cover;background:var(--accent-soft);display:grid;place-items:center;font-family:var(--display);font-size:1.6rem;color:var(--accent)}
.item-main{min-width:0}
.item .name{font-family:var(--display);font-size:1.3rem;font-weight:600;line-height:1.2}
.item .meta,.counts{font-size:.84rem;color:var(--muted);overflow-wrap:anywhere}
.empty{border:1px dashed var(--line);border-radius:var(--r);padding:30px 20px;text-align:center;display:grid;gap:12px;justify-items:center}
.empty p{max-width:52ch}

/* editor */
.years{font-family:var(--display);font-size:1.35rem;color:var(--muted);font-variant-numeric:lining-nums tabular-nums}
.uploader{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.upq{flex-basis:100%;display:grid;gap:6px}
.uprow{display:grid;grid-template-columns:1fr auto;gap:2px 10px;font-size:.85rem;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:8px 10px}
.uprow .n{min-width:0;overflow-wrap:anywhere}
.uprow .bar{grid-column:1/-1;height:4px;background:var(--line);border-radius:2px;overflow:hidden}
.uprow .bar i{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.uprow.ok .s{color:var(--ok)} .uprow.bad .s{color:var(--danger)} .uprow.bad .bar i{background:var(--danger)}
.mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px}
.mlist{display:grid;gap:12px}
.mitem{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:10px;display:grid;gap:8px;min-width:0}
.mitem img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px}
.caption{display:flex;gap:6px} .caption input{flex:1;min-width:0;padding:6px 10px!important;font-size:14px!important}
.mactions{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.mactions>span:first-child{flex:1 1 100%;overflow-wrap:anywhere}
audio,video{width:100%;max-width:100%;border-radius:8px}
video{background:#000}
.qrbox{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px}
.qr svg{display:block;width:100%;height:auto}
.qrbox .qr{width:170px;border-radius:6px;overflow:hidden}
.url{display:block;color:var(--muted)}
.facts{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;font-size:.92rem;margin:0}
.facts dt{color:var(--muted)} .facts dd{margin:0;min-width:0;overflow-wrap:anywhere}
.cred{display:grid;gap:12px} .cred div{display:grid} .cred code{font-size:1.15rem}

/* public memorial */
.memorial{max-width:720px;margin:0 auto}
.hero{display:grid;grid-template-columns:200px 1fr;gap:26px;align-items:end;margin-top:10px}
.portrait{width:200px;max-width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px;background:var(--accent-soft);display:grid;place-items:center;font-family:var(--display);font-size:4.5rem;color:var(--accent)}
.hero h1{font-size:2.7rem;margin-top:4px}
.hero .facts{margin-top:12px}
.bio{font-size:1.05rem;line-height:1.7;white-space:pre-wrap;max-width:65ch}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.gallery figure{margin:0;display:grid;gap:4px}
.gallery img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:6px;cursor:zoom-in;background:var(--accent-soft)}
.gallery figcaption,.mediacap{font-size:.84rem;color:var(--muted)}
.pfoot{margin-top:40px;padding-top:14px;border-top:1px solid var(--line)}
.lightbox{position:fixed;inset:0;background:rgba(5,8,12,.9);display:grid;place-items:center;z-index:50;padding:20px;cursor:zoom-out}
.lightbox img{max-height:90vh;border-radius:6px}

/* printable QR label */
.labelpage{background:#fff;color:#111}
.label{width:min(90vw,420px);margin:30px auto 20px;text-align:center;display:grid;gap:6px;justify-items:center;border:1px dashed #bbb;padding:20px;border-radius:8px}
.label .qr{width:100%}
.lname{font-family:var(--display);font-weight:600;font-size:1.9rem;line-height:1.15}
.lyears{font-size:1.2rem;color:#444}
.lhint{font-size:.85rem;color:#777}
@media print{
  .noprint,.bar{display:none!important}
  .label{border:none;margin:0 auto}
  body{background:#fff;color:#000}
}

@media (max-width:620px){
  h1{font-size:1.9rem}
  .grid2,.grid3{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr}
  .item{grid-template-columns:52px 1fr}
  .item .counts{display:none}
  .thumb{width:52px;height:52px}
  .hero{grid-template-columns:1fr;gap:16px}
  .portrait{width:170px}
  .hero h1{font-size:2.2rem}
  .qrbox{grid-template-columns:1fr}
  .bar nav{order:3;flex-basis:100%}
  .who{margin-left:auto}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.agr{padding:6px 0;border-bottom:1px solid var(--line)}
.agr + p{margin-top:4px}
.code{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-weight:600;letter-spacing:.04em;padding:2px 8px;border-radius:6px;background:var(--accent-soft)}
/* operations: tasks, payments, relics, audit, login card */
.tasks{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:10px}
.task{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px;display:grid;text-decoration:none;color:inherit}
.task b{font-size:1.5rem;font-family:var(--display);font-variant-numeric:tabular-nums}
.task span{font-size:.8rem;color:var(--muted)}
.task.on{border-color:var(--warn)} .task.on b{color:var(--warn)}
.backup-line{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 14px}
form.inline{display:inline-flex;gap:6px;align-items:center;flex-wrap:wrap;margin:0}
form.inline input,form.inline select{width:auto;min-width:0;padding:4px 8px}
.nowrap{white-space:nowrap}
tr.voided td{opacity:.55} tr.warnrow td{background:var(--accent-soft)}
table.audit{font-size:.82rem}
.small-b{font-size:1.05rem!important}
.report-form{align-items:end;margin-top:10px}
details.mini summary{cursor:pointer;font-size:.85rem;color:var(--accent)}
details.mini form{margin-top:8px;min-width:220px}
.logincard{width:150mm;max-width:100%;border:1.5px solid #333;border-radius:4mm;padding:6mm;margin:12px auto;background:#fff;color:#000;font-family:var(--body,sans-serif)}
.lc-head{font-size:.85rem;color:#444;border-bottom:1px solid #ccc;padding-bottom:2mm;margin-bottom:4mm}
.lc-body{display:grid;grid-template-columns:48mm 1fr;gap:6mm;align-items:start}
.lc-qr svg{width:48mm;height:48mm}
.lc-title{font-weight:600;font-size:1.05rem;margin-bottom:2mm}
.lc-name{font-size:1.25rem;font-family:var(--display)} .lc-name span{display:block;font-size:.9rem;color:#444}
.lc-for{margin:2mm 0;font-weight:500}
.logincard ol{padding-left:5mm;margin:2mm 0;font-size:.95rem;line-height:1.4}
.lc-small{font-size:.75rem;color:#555}
@media (max-width:620px){
  .tasks{grid-template-columns:1fr 1fr}
  .bar nav{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none} .bar nav a{white-space:nowrap}
  .lc-body{grid-template-columns:1fr} .lc-qr svg{width:60mm;height:60mm}
}
@media print{.logincard{border-color:#000;margin:0 auto}}
/* staff rights matrix */
table.matrix th { font-size: .78rem; vertical-align: bottom; }
table.matrix td.c { text-align: center; white-space: nowrap; }
details.mini > summary.btn { list-style: none; display: inline-block; }
table.matrix td:first-child { min-width: 15rem; }
/* public front page */
.landing{max-width:880px;margin:0 auto;padding:0 16px 40px;display:grid;gap:22px}
.lp-top{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--line)}
.lp-top .brand{font-family:var(--display, serif);font-size:1.25rem;font-weight:600;color:var(--fg)}
.lp-hero{text-align:center;padding:18px 0 0}
.lp-hero h1{font-family:var(--display, serif);font-size:clamp(1.7rem,4.6vw,2.6rem);line-height:1.2;margin:0 0 12px}
.lp-hero p{max-width:640px;margin:0 auto 8px;color:var(--muted)}
.lp-video{margin:0}
.lp-video video,.lp-video img{width:100%;display:block;border-radius:14px;background:#000;aspect-ratio:16/9;object-fit:contain}
.lp-video figcaption{text-align:center;color:var(--muted);font-size:.9rem;margin-top:8px}
.lp-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.lp-cards h3{margin:0 0 6px}
.lp-foot{text-align:center;border-top:1px solid var(--line);padding-top:14px}
video.lp-preview{width:100%;border-radius:10px;background:#000;max-height:360px}
.lp-frame{position:relative}
.lp-sound{position:absolute;right:12px;bottom:12px;border:0;border-radius:999px;padding:8px 14px;background:rgba(0,0,0,.6);color:#fff;font:inherit;font-size:.9rem;cursor:pointer}
.lp-sound:focus-visible{outline:2px solid #fff;outline-offset:2px}
