@import url("assets/fonts.css");
:root{
  --navy:#16294a; --navy2:#22396a; --teal:#127c84; --teal2:#0e646b; --tealsoft:#e3f2f1;
  --gold:#d6a43a; --gold2:#b8862a; --goldsoft:#fbf0d6; --cream:#fbf6ec; --cream2:#f4ecdc;
  --ink:#1d2433; --muted:#5d6577; --line:#e7dcc6; --card:#fffdf8; --red:#c4473a;
  --r:18px; --shadow:0 2px 6px rgba(22,41,74,.06),0 10px 28px rgba(22,41,74,.08);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:Heebo,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--cream);line-height:1.6;font-size:16px;min-height:100vh;display:flex;flex-direction:column}
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(900px 420px at 110% -10%,rgba(214,164,58,.16),transparent 60%),radial-gradient(700px 420px at -20% 30%,rgba(18,124,132,.10),transparent 60%)}
a{color:var(--teal2)}
img{max-width:100%;display:block}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:2px;border-radius:8px}
.wrap{width:min(1180px,100% - 32px);margin-inline:auto}
main{flex:1}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* top bar */
.topbar{background:rgba(255,253,248,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:20}
.topbar .wrap{display:flex;align-items:center;gap:12px;min-height:62px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--navy);min-width:0}
.brand img{width:44px;height:44px;border-radius:50%;object-fit:cover;border:2px solid var(--goldsoft);background:#fff}
.brand b{display:block;font-weight:800;font-size:1.02rem;line-height:1.15}
.brand small{display:block;color:var(--teal2);font-weight:500;font-size:.8rem;line-height:1.2}
.topbar .spacer{flex:1}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;padding:12px 22px;font-weight:700;cursor:pointer;text-decoration:none;transition:transform .12s,box-shadow .12s,background .12s;font-size:1rem;line-height:1.2}
.btn:active{transform:scale(.97)}
.btn-gold{background:linear-gradient(135deg,#e4b44a,var(--gold2));color:#1a1405;box-shadow:0 6px 18px rgba(184,134,42,.35)}
.btn-gold:hover{box-shadow:0 8px 22px rgba(184,134,42,.45)}
.btn-teal{background:var(--teal);color:#fff}
.btn-teal:hover{background:var(--teal2)}
.btn-ghost{background:#fff;color:var(--navy);border:1.5px solid var(--line)}
.btn-ghost:hover{border-color:var(--teal)}
.btn-sm{padding:8px 14px;font-size:.9rem}
.btn[disabled]{opacity:.55;cursor:not-allowed}

/* hero */
.hero{position:relative;margin:22px auto 0;border-radius:26px;overflow:hidden;background:linear-gradient(135deg,var(--navy),#1f4a6e 55%,var(--teal));color:#fff;box-shadow:var(--shadow)}
.hero .cover{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.38}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,26,48,.78),rgba(14,26,48,.2) 70%);pointer-events:none}
.hero .in{position:relative;z-index:1;padding:34px 26px 28px;display:grid;gap:10px}
.hero .chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.22);padding:4px 12px;border-radius:999px;font-size:.88rem;font-weight:500}
.chip.gold{background:var(--gold);color:#1a1405;border-color:transparent;font-weight:700}
.hero h1{margin:4px 0 0;font-size:clamp(1.7rem,5.6vw,2.7rem);line-height:1.15;font-weight:800;letter-spacing:-.01em;text-wrap:balance}
.hero p.intro{margin:0;max-width:62ch;color:#eef3f7;font-size:1.04rem;white-space:pre-line}
.hero .acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-top:8px}
.hero .count{color:#f7e7bf;font-weight:500}
.closed-note{margin:14px 0 0;background:var(--goldsoft);border:1px solid #efd9a3;color:#6b4d0c;border-radius:14px;padding:10px 14px;font-weight:500}

/* questions */
.questions{margin:18px 0 0;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 20px;box-shadow:var(--shadow)}
.questions h2{margin:0 0 6px;font-size:1.08rem;color:var(--navy)}
.questions ul{margin:0;padding:0 1.2em 0 0;color:var(--ink)}
.questions li{margin:2px 0}
.questions li::marker{color:var(--gold2)}

/* gallery */
.sec-head{display:flex;align-items:end;justify-content:space-between;gap:12px;margin:30px 0 14px}
.sec-head h2{margin:0;font-size:1.45rem;color:var(--navy);font-weight:800}
.sec-head .sub{color:var(--muted);font-size:.95rem}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(264px,1fr));gap:18px;padding-bottom:40px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;cursor:pointer;transition:transform .15s,box-shadow .15s;text-align:right;padding:0;position:relative}
.card:hover{transform:translateY(-3px);box-shadow:0 4px 10px rgba(22,41,74,.08),0 18px 36px rgba(22,41,74,.12)}
.card .thumb{aspect-ratio:4/3;background:var(--cream2);overflow:hidden;position:relative}
.card .thumb img{width:100%;height:100%;object-fit:cover;object-position:top center}
.tile{width:100%;height:100%;display:grid;place-items:center;align-content:center;gap:8px;color:#fff;font-weight:800}
.tile .ic{width:64px;height:78px;border-radius:8px 22px 8px 8px;background:rgba(255,255,255,.95);display:grid;place-items:center;font-size:.86rem;letter-spacing:.02em;box-shadow:0 6px 16px rgba(0,0,0,.15)}
.tile .nm{max-width:86%;font-weight:500;font-size:.9rem;opacity:.95;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr}
.tile.pdf{background:linear-gradient(135deg,#d65a4a,#a8332a)} .tile.pdf .ic{color:#b23a2f}
.tile.doc{background:linear-gradient(135deg,#3f7bd0,#22539c)} .tile.doc .ic{color:#22539c}
.tile.ppt{background:linear-gradient(135deg,#e9874a,#c25a20)} .tile.ppt .ic{color:#c25a20}
.tile.gen{background:linear-gradient(135deg,#6b7488,#454c5d)}
.tile.link{background:linear-gradient(135deg,var(--teal),var(--navy))} .tile.link .ic{color:var(--teal2);font-size:1.6rem}
.tile.text{background:linear-gradient(135deg,var(--goldsoft),#f3e2b8);color:var(--navy);padding:18px;font-weight:500;font-size:1rem;text-align:center;place-items:center}
.tile.text q{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;quotes:"״" "״"}
.badge-ex{position:absolute;top:10px;left:10px;background:var(--navy);color:#fff;font-size:.78rem;font-weight:700;padding:3px 10px;border-radius:999px;z-index:1}
.card .body{padding:14px 16px 12px;display:grid;gap:4px;flex:1}
.card h3{margin:0;font-size:1.08rem;line-height:1.3;color:var(--navy)}
.card .who{color:var(--muted);font-size:.9rem}
.card .who b{color:var(--teal2);font-weight:700}
.card .ref{margin:4px 0 0;color:#333a49;font-size:.95rem;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card .foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px 12px 16px;color:var(--muted);font-size:.84rem}
.pill{display:inline-flex;align-items:center;gap:4px;background:var(--tealsoft);color:var(--teal2);padding:2px 10px;border-radius:999px;font-size:.8rem;font-weight:700}
.like{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:4px 12px;cursor:pointer;font-weight:700;color:var(--navy);min-height:36px}
.like .h{filter:grayscale(1);opacity:.6;transition:transform .2s}
.like.on{border-color:#f2b8b0;background:#fff3f1}
.like.on .h{filter:none;opacity:1}
.like.pop .h{transform:scale(1.4)}
.empty{grid-column:1/-1;text-align:center;background:var(--card);border:2px dashed var(--line);border-radius:var(--r);padding:36px 20px;color:var(--muted)}
.empty b{display:block;color:var(--navy);font-size:1.15rem;margin-bottom:4px}

/* dialogs */
dialog{border:0;padding:0;background:transparent;max-width:100vw;max-height:100dvh;color:var(--ink)}
dialog::backdrop{background:rgba(14,22,40,.55);backdrop-filter:blur(3px)}
.panel{background:var(--card);border-radius:22px;width:min(640px,calc(100vw - 24px));max-height:calc(100dvh - 32px);overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.3);overscroll-behavior:contain}
.panel.wide{width:min(900px,calc(100vw - 24px))}
.panel-head{position:sticky;top:0;z-index:2;background:var(--card);display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 20px 12px;border-bottom:1px solid var(--line)}
.panel-head h2{margin:0;font-size:1.25rem;color:var(--navy)}
.x{width:40px;height:40px;border-radius:50%;border:0;background:var(--cream2);cursor:pointer;font-size:1.1rem;flex:none}
.panel-body{padding:16px 20px 22px}
@media (max-width:600px){
  dialog.sheet{margin:auto 0 0;width:100vw}
  dialog.sheet .panel{width:100vw;border-radius:22px 22px 0 0;max-height:94dvh}
}

/* form */
.form{display:grid;gap:14px}
.field{display:grid;gap:6px}
.field>label,.field>.lbl{font-weight:700;color:var(--navy);font-size:.98rem}
.field .opt{font-weight:400;color:var(--muted);font-size:.86rem}
.field .hint{color:var(--muted);font-size:.86rem;margin:0}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.row2{grid-template-columns:1fr}}
input[type=text],input[type=url],input[type=date],input:not([type]),textarea{width:100%;border:1.5px solid var(--line);background:#fff;border-radius:12px;padding:11px 13px;font-size:16px;transition:border-color .15s,box-shadow .15s}
input:focus,textarea:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(18,124,132,.14)}
textarea{min-height:120px;resize:vertical;line-height:1.55}
input[type=url]{direction:ltr;text-align:left}
input[type=url]::placeholder{text-align:right;direction:rtl}
.drop{position:relative;border:2px dashed #d9c79f;background:linear-gradient(180deg,#fffaf0,#fff);border-radius:16px;padding:18px;text-align:center;cursor:pointer;transition:border-color .15s,background .15s}
.drop:hover,.drop.over{border-color:var(--teal);background:var(--tealsoft)}
.drop input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}
.drop .big{font-size:1.7rem;line-height:1}
.drop b{display:block;color:var(--navy);margin-top:6px}
.drop .lim{display:block;color:var(--muted);font-size:.84rem;margin-top:4px}
.picked{display:flex;align-items:center;gap:12px;border:1.5px solid var(--line);background:#fff;border-radius:14px;padding:10px}
.picked img{width:72px;height:72px;object-fit:cover;border-radius:10px}
.picked .fi{width:56px;height:68px;border-radius:6px 16px 6px 6px;display:grid;place-items:center;color:#fff;font-weight:800;font-size:.75rem;flex:none}
.picked .fi.pdf{background:#c2463a}.picked .fi.doc{background:#2d63b3}.picked .fi.ppt{background:#d0692d}
.picked .meta{flex:1;min-width:0}
.picked .meta b{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;direction:ltr;text-align:right}
.picked .meta small{color:var(--muted)}
.qbox{background:var(--goldsoft);border-radius:12px;padding:10px 14px;font-size:.92rem;color:#5a430f}
.qbox ul{margin:4px 0 0;padding:0 1.1em 0 0}
.check{display:flex;gap:10px;align-items:flex-start;background:var(--tealsoft);border-radius:12px;padding:12px 14px;cursor:pointer}
.check input{width:22px;height:22px;accent-color:var(--teal);margin-top:2px;flex:none}
.err{color:var(--red);font-weight:500;min-height:1.2em;margin:0}
.progress{height:8px;background:var(--cream2);border-radius:99px;overflow:hidden}
.progress i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--gold));transition:width .2s}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}

/* view modal */
.view .media{background:#f1ebde;display:grid;place-items:center}
.view .media img{max-height:70dvh;width:auto;max-width:100%;object-fit:contain}
.view .media .tile{min-height:220px;width:100%}
.view h2.t{margin:0;font-size:1.4rem;color:var(--navy);line-height:1.3}
.view .who{color:var(--muted);margin:2px 0 10px}
.view .who b{color:var(--teal2)}
.view .refl{white-space:pre-wrap;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 14px;margin:8px 0 12px}
.view .refl .lb{display:block;font-weight:700;color:var(--gold2);font-size:.88rem;margin-bottom:2px}
.view .acts{display:flex;flex-wrap:wrap;gap:10px;align-items:center}

/* toast */
.toast{position:fixed;bottom:22px;left:50%;transform:translate(-50%,40px);opacity:0;background:var(--navy);color:#fff;padding:12px 20px;border-radius:999px;font-weight:500;z-index:100;transition:all .25s;pointer-events:none;max-width:calc(100vw - 32px);text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* footer */
.site-foot{border-top:1px solid var(--line);background:#fffaf0;margin-top:20px}
.site-foot .wrap{display:flex;align-items:center;justify-content:center;gap:12px;padding:18px 0;color:var(--muted);font-size:.92rem;flex-wrap:wrap;text-align:center}
.site-foot img{width:34px;height:34px;border-radius:50%;object-fit:cover}
.site-foot b{color:var(--navy)}

/* landing */
.land{display:grid;place-items:center;padding:40px 0 30px}
.land .box{background:var(--card);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow);padding:34px 26px;text-align:center;width:min(560px,100%)}
.land .box img.lg{width:132px;height:132px;border-radius:50%;margin:0 auto 10px;object-fit:cover;border:3px solid var(--goldsoft)}
.land h1{margin:6px 0 6px;color:var(--navy);font-size:clamp(1.8rem,6vw,2.4rem);line-height:1.15}
.land p{color:var(--muted);margin:0 0 18px}
.codeform{display:flex;gap:8px}
.codeform input{flex:1;direction:ltr;text-align:center;letter-spacing:.08em}

/* admin */
.adm-head{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin:24px 0 16px}
.adm-head h1{margin:0;color:var(--navy);font-size:1.6rem}
.tlist{display:grid;gap:14px;padding-bottom:40px}
.tcard{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow);display:grid;grid-template-columns:120px minmax(0,1fr);overflow:hidden}
.tcard .cv{background:linear-gradient(135deg,var(--navy),var(--teal));min-height:100%}
.tcard .cv img{width:100%;height:100%;object-fit:cover}
.tcard .in{padding:14px 16px;display:grid;gap:8px;min-width:0}
.tcard h2{margin:0;font-size:1.15rem;color:var(--navy)}
.tcard .meta{color:var(--muted);font-size:.9rem;display:flex;flex-wrap:wrap;gap:6px 14px}
.st{font-weight:700;border-radius:999px;padding:1px 10px;font-size:.82rem}
.st.open{background:#dff3e6;color:#1c7a3f}.st.closed{background:#f8e1de;color:#a2392d}.st.demo{background:var(--goldsoft);color:#7a5a12}
.linkrow{display:flex;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 6px 6px 10px}
.linkrow code{flex:1;direction:ltr;text-align:left;font-size:.88rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--teal2)}
.tacts{display:flex;flex-wrap:wrap;gap:6px}
@media (max-width:600px){.tcard{grid-template-columns:minmax(0,1fr)}.tcard .cv{height:90px}.linkrow{flex-wrap:wrap;padding:8px}.linkrow code{flex-basis:100%;text-align:center}.linkrow .btn{flex:1}}
.plist{display:grid;gap:10px}
.prow{display:grid;grid-template-columns:64px 1fr auto;gap:12px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:14px;padding:8px}
.prow.hid{opacity:.55}
.prow .th{width:64px;height:64px;border-radius:10px;overflow:hidden;background:var(--cream2);display:grid;place-items:center;font-size:.72rem;font-weight:800;color:#fff}
.prow .th img{width:100%;height:100%;object-fit:cover}
.prow .tx{min-width:0}.prow .tx b{display:block;color:var(--navy);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prow .tx small{color:var(--muted)}
.prow .ac{display:flex;flex-direction:column;gap:4px}
@media (max-width:520px){.prow{grid-template-columns:56px 1fr}.prow .ac{grid-column:1/-1;flex-direction:row;flex-wrap:wrap}}
.cover-prev{display:flex;align-items:center;gap:10px}
.cover-prev img{width:110px;height:62px;object-fit:cover;border-radius:10px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}