/* ============ تم روشن، مدرن و سه‌بعدی (روی style.css اعمال می‌شود) ============ */
:root{--bg:#f3f4f9;--surface:#fff;--surface2:#f2f3f8;--fg:#1b1d29;--muted:#6a6f86;--line:#e4e6ef;--accent:#d62839;--accent-fg:#fff;--accent-soft:#fde9ec;
 --good:#13914a;--good-soft:#e1f6ea;--warn:#a96a08;--warn-soft:#fdf1d9;--bad:#d42a2a;--bad-soft:#fde8e8;color-scheme:light;
 --sh1:0 1px 2px rgba(27,29,41,.06),0 4px 12px rgba(27,29,41,.06);--sh2:0 2px 4px rgba(27,29,41,.06),0 12px 28px rgba(27,29,41,.10);--sh3:0 6px 12px rgba(27,29,41,.08),0 22px 44px rgba(214,40,57,.18)}
body{background:radial-gradient(900px 480px at 90% -8%,#ffe3e7 0,transparent 60%),radial-gradient(700px 400px at -5% 30%,#e8ebff 0,transparent 60%),var(--bg);color:var(--fg)}
a{color:var(--accent)}
/* ---- ساختار ---- */
#side{background:rgba(255,255,255,.82);backdrop-filter:blur(14px);border-inline-end:1px solid var(--line);box-shadow:var(--sh1)}
.brand{background:linear-gradient(145deg,#fff,#f6f7fb);border:1px solid var(--line);box-shadow:var(--sh1);border-radius:16px}
.brand small{color:var(--muted)}
#side nav a{color:var(--fg);border-radius:12px;padding:9px 12px;transition:transform .15s,background .15s,box-shadow .15s}
#side nav a:hover{background:#fff;transform:translateX(-3px);box-shadow:var(--sh1)}
#side nav a.on{background:linear-gradient(135deg,#ec3a4c,#c61e30);color:#fff;box-shadow:0 8px 18px rgba(214,40,57,.38),inset 0 1px 0 rgba(255,255,255,.35)}
#top{background:rgba(255,255,255,.78);backdrop-filter:blur(14px);color:var(--fg);box-shadow:var(--sh1);border-bottom:1px solid var(--line)}
#top::after{display:none}
#top h1{font-size:17px}#who{color:var(--muted);font-size:13px;background:var(--surface2);padding:4px 12px;border-radius:20px}
#menuBtn{color:var(--fg)}
.badge{background:var(--accent);box-shadow:0 2px 6px rgba(214,40,57,.4)}
/* ---- کارت و جدول ---- */
.card,.tw{background:var(--surface);border:1px solid var(--line);border-radius:18px;box-shadow:var(--sh1)}
.card{padding:18px 20px}
.card>h2{font-size:15px}
th{background:#f6f7fb;color:var(--muted)}td,th{border-color:var(--line)}
tbody tr:hover td{background:#fafbff}
.kv{border-color:var(--line)}
.alert.info{background:#eef3ff;color:#2a3d8f;border:1px solid #d5defc}.alert.info b{color:#1b2c75}
.alert.warn{background:var(--warn-soft);color:var(--warn);border:1px solid #f2dca8}
.alert.good{background:var(--good-soft);color:var(--good);border:1px solid #bfe8cf}
.alert.bad{border-color:#f5b9b9}
.chip{background:var(--accent-soft);color:var(--accent)}
.tabs{border-color:var(--line)}.tab:hover{color:var(--fg)}
/* ---- فرم‌ها ---- */
input,select,textarea{background:#fff;color:var(--fg);border:1px solid #d9dce8;border-radius:11px;box-shadow:inset 0 1px 2px rgba(27,29,41,.05)}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--accent);box-shadow:0 0 0 4px rgba(214,40,57,.14)}
input[readonly]{background:var(--surface2)}
.multi,.lk label,.opt{background:#fafbfe;border-color:var(--line)}
.opt:has(input:checked){background:var(--accent-soft);border-color:var(--accent)}
.lk label:has(input:checked){background:linear-gradient(135deg,#ec3a4c,#c61e30);color:#fff;border-color:#c61e30}
/* ---- دکمه سه‌بعدی ---- */
.btn{background:linear-gradient(180deg,#f0414f,#cc2132);color:#fff;border-radius:12px;box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 -3px 0 rgba(0,0,0,.14) inset,0 8px 16px rgba(214,40,57,.30);transition:transform .12s,box-shadow .12s,filter .12s}
.btn:hover{filter:none;transform:translateY(-2px);box-shadow:0 1px 0 rgba(255,255,255,.4) inset,0 -3px 0 rgba(0,0,0,.14) inset,0 12px 22px rgba(214,40,57,.38)}
.btn:active{transform:translateY(1px);box-shadow:0 1px 0 rgba(255,255,255,.3) inset,0 3px 6px rgba(214,40,57,.3)}
.btn.out{background:#fff;color:var(--fg);border:1px solid var(--line);box-shadow:0 -2px 0 rgba(27,29,41,.05) inset,var(--sh1)}
.btn.out:hover{border-color:#cfd3e3}
.btn.alt{background:var(--accent-soft);color:var(--accent);box-shadow:none}
.mini{background:#fff;color:var(--fg)}
/* ---- کاشی‌ها و آمار (سه‌بعدی + درخشش) ---- */
.tile,.stat,.ccard,.rec,.ctilt{position:relative;transform-style:preserve-3d;will-change:transform;transition:transform .18s ease-out,box-shadow .2s,border-color .2s}
.tile,.stat{background:linear-gradient(160deg,#fff,#f6f7fc);border:1px solid var(--line);border-radius:20px;box-shadow:var(--sh1)}
.tile:hover,.stat:hover,.ccard:hover{box-shadow:var(--sh3);border-color:#f3b4bb;background:linear-gradient(160deg,#fff,#fff4f5)}
.tile::after,.stat::after,.ccard::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .2s;background:radial-gradient(260px circle at var(--gx,50%) var(--gy,50%),rgba(255,255,255,.9),transparent 60%)}
.tile:hover::after,.stat:hover::after,.ccard:hover::after{opacity:.9}
.tile{color:var(--fg)}
.tic .ic{background:linear-gradient(145deg,#fff1f2,#ffd9de);box-shadow:0 6px 12px rgba(214,40,57,.18),inset 0 1px 0 #fff;transform:translateZ(24px)}
.stat b{color:var(--accent)}.stat span{color:var(--muted)}
.stat i{transform:translateZ(18px)}
/* ---- هیرو و صحنه‌ی سه‌بعدی ---- */
.hero{background:linear-gradient(120deg,#fff 0,#fff5f6 50%,#ffe3e7 100%);border:1px solid #f6d3d8;box-shadow:var(--sh2);color:var(--fg);align-items:stretch;min-height:230px;padding:24px 30px}
.hero::before{background:radial-gradient(420px 220px at 90% 10%,rgba(255,255,255,.9),transparent 70%)}
.herotxt{display:flex;flex-direction:column;justify-content:center;gap:2px;max-width:46%}
.herotxt h2{font-size:26px;color:var(--fg)}.herotxt small,.herotxt p{color:var(--muted);opacity:1}
.heroLogo{width:150px;margin-bottom:8px}.heroLogo img{width:100%;height:auto;display:block}
.logoplate{box-shadow:var(--sh1);border:1px solid var(--line)}
.scene{position:relative;flex:1;min-width:0;perspective:900px;display:flex;align-items:center;justify-content:center}
.scene .scsvg{width:100%;max-height:260px;transform:rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .15s ease-out;overflow:visible;filter:drop-shadow(0 18px 24px rgba(27,29,41,.18))}
.scene [data-depth]{transition:transform .15s ease-out}
/* ---- ورود ---- */
#login{background:radial-gradient(900px 520px at 85% -10%,#ffd9de 0,transparent 60%),radial-gradient(700px 480px at 0 100%,#dfe5ff 0,transparent 60%),var(--bg)}
.loginwrap{display:grid;grid-template-columns:1.15fr 1fr;gap:34px;align-items:center;max-width:1080px;width:100%}
.loginart{text-align:center}.loginart h2{font-size:26px;margin:6px 0 2px}.loginart p{margin:0;color:var(--muted)}
.scene.big .scsvg{max-height:360px}
.loginbox{background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border:1px solid #fff;box-shadow:var(--sh2),0 0 0 1px var(--line);border-radius:26px;padding:34px}
.loginbox::before{height:6px;background:linear-gradient(90deg,#ec3a4c,#ff8a96,#ec3a4c)}
@media(max-width:860px){.loginwrap{grid-template-columns:1fr}.loginart .scene{display:none}.loginart h2,.loginart p{display:none}.hero{flex-direction:column}.herotxt{max-width:100%}}
/* ---- بخش‌های اختصاصی ---- */
.ccard{background:linear-gradient(165deg,#fff,#f6f7fc);border:1px solid var(--line);color:var(--fg);border-radius:22px;box-shadow:var(--sh1)}
.ccard::before{background:linear-gradient(135deg,#ff7d89,#d62839);opacity:.9;height:78px}
.cavatar{border:4px solid #fff;box-shadow:0 8px 20px rgba(27,29,41,.25);background:linear-gradient(145deg,#ff7d89,#c61e30)}
.cmini div{background:#f4f5fa}.cmini b{color:var(--accent)}
.stars i{color:#d9dbe6}.stars i.on{color:#f5a800}
.chero{background:radial-gradient(circle at 85% 0,#ffd5da,transparent 55%),linear-gradient(160deg,#fff,#f6f7fc);border:1px solid #f3d0d5;box-shadow:var(--sh2);border-radius:24px}
.chero h2{color:var(--fg)}
.finhero{background:radial-gradient(circle at 10% 0,color-mix(in srgb,var(--c) 18%,#fff),transparent 60%),linear-gradient(160deg,#fff,#f6f7fc);border:1px solid color-mix(in srgb,var(--c) 40%,#e4e6ef);box-shadow:var(--sh2);border-radius:24px}
.finform div{border-color:#d9dce8}
.hbt,.dvb{background:#eceef6}.dvb .pos{border-right-color:#c9cde0}
.progress,.bar{background:#eceef6;border-color:var(--line)}
.rec{background:#fff;border-color:var(--line);box-shadow:var(--sh1)}.rec.top{border-color:var(--accent);box-shadow:var(--sh3)}
.pc{background:var(--accent-soft);color:var(--accent)}
.rk{background:var(--accent)}
.modal{background:rgba(27,29,41,.45);backdrop-filter:blur(4px)}.modal-box{background:#fff;border-radius:22px;box-shadow:0 30px 80px rgba(27,29,41,.35)}
.toast{background:#1b1d29;color:#fff;box-shadow:var(--sh2)}
.toast.lv-normal{background:#fff;color:var(--fg);border:1px solid var(--line)}
.imgbox{background:#fafbfe;border-color:#cfd3e3}
.sgrid .sbox,.sn{background:#fff}
.steps li::before{background:#fff}
svg text{fill:currentColor}
svg text[fill]{fill:attr(fill)}

/* ---- نصب برنامه و سازگاری موبایل ---- */
#instbar{position:fixed;bottom:14px;inset-inline:14px;z-index:70;display:flex;align-items:center;gap:10px;background:#1b1d29;color:#fff;padding:10px 14px;border-radius:16px;box-shadow:0 14px 36px rgba(27,29,41,.4);font-size:13px}
#instbar span{flex:1}
body{padding-bottom:env(safe-area-inset-bottom)}
#top{padding-top:calc(12px + env(safe-area-inset-top))}
@media(max-width:860px){
 #page{padding:12px 12px 80px}
 .card{padding:14px}.hero{padding:18px;min-height:0}.herotxt h2{font-size:20px}
 .scene .scsvg{max-height:190px}
 .tiles{grid-template-columns:repeat(2,1fr);gap:10px}.tile{padding:18px 8px;font-size:13px}
 .stats{grid-template-columns:repeat(2,1fr)}.stat b{font-size:19px}
 .cols,.cols2,.cols3{grid-template-columns:1fr}
 .finhero{padding:16px}.finnum{font-size:30px}.finform{min-width:0;width:100%}
 .chero{padding:16px}.cavatar.xl{width:110px;height:110px;font-size:40px}
 .dvr{grid-template-columns:90px 1fr 80px}
 .tabs{overflow-x:auto;flex-wrap:nowrap;white-space:nowrap}
 input,select,textarea{font-size:16px}
 .btn{min-height:44px}.btn.mini{min-height:32px}
 .modal-box{border-radius:20px;padding:16px}
 #who{display:none}
 #toasts{left:10px;right:10px;bottom:70px}
}