/* Тема «уютный пергамент»: тёплые деревянные рамки и бумага вместо тёмных панелей.
   Подключается последней и переопределяет цвета; тёмными остаются телефон, кадр мини-игры, титул и чат. */
:root{
  --bg:#1a0f08;
  --panel:#f7dcae; --panel-2:#efcb92; --panel-3:#e3b878;
  --edge:#a8642a; --edge-2:#cf8a42; --frame:#5a2a0c; --frame-2:#7a3e14;
  --text:#3d2410; --text-2:#5e3a1c; --muted:#8a6038; --dim:#b08a5c;
  --hl:#b8460f; --good:#2f7a34; --bad:#b0281e;
  color-scheme:light;
}
.mg,.title,.chat{
  --panel:#1c140e; --panel-2:#2a1e14; --panel-3:#3a2a1c; --edge:#5a3e28; --edge-2:#7a5636;
  --text:#fbefd9; --text-2:#ead8bc; --muted:#c0a07a; --dim:#8a7050; --hl:var(--yellow); --good:var(--green);
  color-scheme:dark;color:var(--text);
}
.mg-card,.mg-side{
  --panel:#f7dcae; --panel-2:#efcb92; --panel-3:#e3b878; --edge:#a8642a; --edge-2:#cf8a42;
  --text:#3d2410; --text-2:#5e3a1c; --muted:#8a6038; --dim:#b08a5c; --hl:#b8460f; --good:#2f7a34;
  color-scheme:light;color:var(--text);
}

/* пиксельная рамка: тёмный кант → светлое дерево → тёмная линия → бумага */
.pf{--n:6px;padding:2px;background:var(--frame)}
.pf>.pi{--n:5px;background:var(--panel);box-shadow:inset 0 0 0 3px var(--edge-2),inset 0 0 0 5px var(--frame-2),inset 0 0 0 6px #fbe8c4}
.title .pf>.pi{box-shadow:none}

/* кнопки */
.pbtn.ghost{background:#e6bd84;color:var(--text);box-shadow:inset 0 -5px 0 #b07a3e}
.pbtn.ghost:hover{background:#efca94}
.title .pbtn.ghost,.mg .pbtn.ghost{background:#3a2a1c;color:#fbefd9;box-shadow:inset 0 -5px 0 #1e140c}
.mg-card .pbtn.ghost{background:#e6bd84;color:#3d2410;box-shadow:inset 0 -5px 0 #b07a3e}
.hbtn{color:var(--text);background:var(--panel);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--edge-2)}
.hbtn:hover{background:#fbe6c0;box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--hl)}
.hbtn kbd{color:var(--muted)}
kbd.k{color:#fbefd9;background:var(--frame-2);box-shadow:inset 0 -2px 0 #3a1a06}
:focus-visible{outline-color:var(--hl)}

/* HUD */
.h-lvl{color:var(--hl)}
.h-xp{background:var(--panel-3);box-shadow:inset 0 0 0 1px var(--edge)}
.h-xp i{background:linear-gradient(#ffd23f,#e89a20)}
.hud-quest{background:var(--panel);color:var(--text-2);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--edge-2);padding:10px 14px}
.q-k{color:var(--hl)}
.net-chip{background:var(--panel);color:var(--muted);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--edge-2)}
.net-chip.on{color:var(--text)}
.hud-hint{color:var(--text-2);background:var(--panel);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--edge-2)}
.prompt{color:var(--text);background:var(--panel);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--edge-2)}
.prompt::after{border-top-color:var(--frame)}
.b-small{color:#fff8e8}
.toast{background:var(--panel);color:var(--text);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--edge-2),0 8px 24px rgba(40,20,8,.35)}
.title{background:radial-gradient(70% 60% at 50% 42%,rgba(60,30,10,.35),rgba(20,10,4,.92))}
.title h1{text-shadow:4px 4px 0 #5a2a0c,8px 8px 0 rgba(0,0,0,.4)}

/* диалог */
.portrait{background:#e9c48c;box-shadow:inset 0 0 0 3px var(--frame-2),inset 0 0 0 5px #fbe8c4}
.portrait.sys{background:#e9c48c;color:var(--hl)}
.d-name{color:var(--hl)}
.d-opt{color:var(--text);background:var(--panel-2);box-shadow:inset 0 0 0 2px var(--edge)}
.d-opt:hover,.d-opt.sel{background:#fbe6c0;box-shadow:inset 0 0 0 2px var(--hl)}

/* окна */
.win-wrap{background:rgba(30,14,4,.5)}
.win-head{border-bottom:3px solid var(--edge-2)}
.win-head,.win-body{margin:0 4px}
.w-checks li::before{background:var(--hl)}
.w-plan .tag,.tariff b .tag{color:var(--hl)}
.gen{background:var(--panel-3);color:var(--text)}
.w-item strong.free,.card .eff{color:var(--good)}
.w-vid .th{box-shadow:inset 0 0 0 2px var(--frame-2)}
.w-vid .dur{color:#fff}
.w-faq summary::after{color:var(--hl)}
.w-track{background:#3a2414;box-shadow:inset 0 0 0 2px var(--frame)}
.prod{color:#fbefd9;background:linear-gradient(180deg,#4a2c16,#2e1a0c);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px #c9a45c}
.shop-tab{color:var(--text-2)}
.shop-tab.on{box-shadow:inset 0 0 0 2px var(--hl);color:var(--text);background:#fbe6c0}
.card.owned,.tariff.own{box-shadow:inset 0 0 0 2px var(--good)}
.card.real{box-shadow:inset 0 0 0 2px #c9a45c}
.card .tier i,.bar i{background:var(--panel-3)}
.card .tier i.on,.bar i b{background:#e89a20}
.card .real-note{color:#8a6a2a}.card .real-note a{color:var(--hl)}
.pick-i:hover:not([disabled]),.slot:hover,.ed-o.on{box-shadow:inset 0 0 0 2px var(--hl)}
.slot .s-n{color:var(--hl)}
.tr.hot{color:#d0401a}.tr.warm{color:#b07800}
.steps span{background:var(--panel-3);color:var(--muted)}
.steps span.done{background:#b8dca0;color:#24461a}
.ed-prev canvas{background:radial-gradient(#fff0d0,#e9c48c);box-shadow:inset 0 0 0 2px var(--edge)}
.ed-name input{background:#fff4dc;color:var(--text);box-shadow:inset 0 0 0 2px var(--edge)}
.ed-sw.on{box-shadow:inset 0 0 0 3px var(--frame)}
.lesson{background:#f2d29c;box-shadow:inset 0 0 0 2px var(--edge)}
.lesson b{color:var(--hl)}
.lq button.good{background:#cfe8b8;box-shadow:inset 0 0 0 2px var(--good)}
.lq button.bad{background:#f4c4b4;box-shadow:inset 0 0 0 2px var(--bad)}
.res-big div{box-shadow:inset 0 0 0 2px var(--edge)}

/* мини-игры */
.mg{background:radial-gradient(80% 60% at 50% 40%,#3a2414,#120804)}
.mg-frame{box-shadow:0 0 0 3px #cf8a42,0 0 0 6px #5a2a0c,0 20px 60px rgba(0,0,0,.6)}
.mg-side .blk{background:var(--panel);box-shadow:inset 0 0 0 2px var(--frame),inset 0 0 0 4px var(--edge-2);padding:14px}
.mg-card{background:rgba(20,10,4,.6)}
.mg-card .mg-stagename{color:var(--hl)}
.mg-chip{background:#d6eebf;color:#24461a;box-shadow:inset 0 0 0 1px #7aa85a}
.mg-chip.off{background:var(--panel-3);color:var(--muted);box-shadow:inset 0 0 0 1px var(--edge)}
.mg-break em{color:var(--good)}
.mg-tip{background:#f2d29c;box-shadow:inset 3px 0 0 var(--hl)}
.mg-tip b{color:var(--hl)}
.tbtn{color:#fbefd9;background:#8a4a1c;box-shadow:inset 0 0 0 2px #5a2a0c,inset 0 -5px 0 #5a2a0c}
.tbtn.down,.tbtn:active{background:#a85a24;box-shadow:inset 0 0 0 2px var(--yellow)}
.tbtn small{color:#e8c898}

/* планировщик квартиры */
.he{position:fixed;left:0;right:0;bottom:0;z-index:31;display:flex;flex-direction:column;gap:6px;padding:8px 8px calc(8px + var(--safe-b));pointer-events:none}
.he>*{pointer-events:auto}
.he-top{align-self:center;width:min(780px,100%)}
.he-top .pi{display:flex;align-items:center;gap:12px;padding:10px 14px;flex-wrap:wrap}
.he-top b{font-family:var(--px);font-size:11px;font-weight:400}
.he-top span{font-size:13px;color:var(--muted)}
.he-top em{flex:1;min-width:120px;font-style:normal;font-size:13px;color:var(--hl)}
.he-bar{align-self:center;width:min(1000px,100%)}
.he-bar .pi{padding:10px 12px}
.he-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.he-list{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;min-height:92px}
.he-it{flex:none;width:100px;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 6px;background:var(--panel-2);border:0;box-shadow:inset 0 0 0 2px var(--edge);cursor:pointer;color:var(--text);position:relative}
.he-it.on{box-shadow:inset 0 0 0 2px var(--hl);background:#fbe6c0}
.he-it.ghost{background:transparent}
.he-it b{font-size:11.5px;font-weight:600;line-height:1.2;text-align:center}
.he-it em{position:absolute;top:4px;right:6px;font-style:normal;font-family:var(--px);font-size:8px;color:var(--hl)}
.he-pv{width:64px;height:52px;object-fit:contain;image-rendering:pixelated}
.he-sw{display:grid;place-items:center;width:56px;height:40px;box-shadow:inset 0 0 0 2px var(--edge);font-size:20px;color:var(--muted)}
.he-empty{margin:4px 8px;font-size:13px;color:var(--muted);align-self:center;max-width:300px}
.card .he-pv{width:56px;height:46px}
@media (max-width:720px){.he-it{width:84px}.he-pv{width:52px;height:44px}}

/* рамка цели (как в MMO) */
.tgt{pointer-events:auto}
.tgt .pi{display:grid;grid-template-columns:auto 1fr auto;gap:4px 12px;align-items:center;padding:10px 12px}
.tgt-pt{grid-row:1/3;width:48px;height:48px;image-rendering:pixelated;background:#e9c48c;box-shadow:inset 0 0 0 2px var(--frame-2)}
.tgt-info{min-width:0;display:flex;flex-direction:column;gap:2px}
.tgt-name{font-family:var(--px);font-size:11px;font-weight:400;color:#a87a10;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgt.player .tgt-name{color:var(--good)}
.tgt-sub{font-size:12.5px;color:var(--muted)}
.tgt-st{font-style:normal;font-size:12px;color:var(--text-2)}
.tgt-x{grid-row:1;grid-column:3;width:30px;height:30px;border:0;background:#e6bd84;color:var(--text);font-size:18px;cursor:pointer;box-shadow:inset 0 -3px 0 #b07a3e}
.tgt-acts{grid-column:2/4;display:flex;gap:6px;flex-wrap:wrap}
.tgt-acts .pbtn{min-height:32px;font-size:9px;padding:0 10px}

/* приглашения дружбы и коллабов */
.invites{display:flex;flex-direction:column;gap:8px}
.invite .pi{display:flex;flex-direction:column;gap:4px;padding:12px 14px}
.invite b{font-family:var(--px);font-size:10px;font-weight:400;line-height:1.5}
.invite span{font-size:13px;color:var(--muted)}
.invite .w-row{margin-top:6px}
.ph-mapc{display:block;width:100%;height:auto;image-rendering:pixelated;cursor:pointer;box-shadow:0 0 0 2px #2a1a12;margin-top:4px}
.h-clock{margin-left:auto}.h-clock i{font-style:normal;color:var(--hl)}

/* ---------- игровые курсоры (js/core/cursor.js) ---------- */
html.cur,html.cur body{cursor:var(--cur-arrow,default)}
html.cur :is(a,button,summary,label,select,[role=button],.prompt,.zoom,.ph-mapc,input[type=range],input[type=checkbox]){cursor:var(--cur-hand,pointer)!important}
html.cur :is(button,.pbtn)[disabled]{cursor:var(--cur-arrow,default)!important}
html.cur :is(input:not([type=range]):not([type=checkbox]),textarea){cursor:text!important}

/* ---------- шейдеры (js/core/fx.js) ---------- */
#fx{position:fixed;inset:0;width:100vw;height:100vh;height:100dvh;display:block;pointer-events:none}
.ph-h{margin:16px 0 8px;font-family:var(--px);font-size:10px;letter-spacing:.04em;color:var(--muted)}
.ph-gfx{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:8px}
.ph-gfx-c{font-size:12px;color:var(--muted)}
.ph-set.off{opacity:.45}

/* ---------- кинотеатр: плеер под холстом, панель, «Расписание» (js/core/cinema.js) ---------- */
.cine{position:fixed;left:0;top:0;width:0;height:0;background:#000;overflow:hidden}
.cine iframe,.cine>div{display:block;width:100%;height:100%;border:0;pointer-events:none}
.cine.big{z-index:16;left:50%;top:50%;width:min(92vw,calc((100vh - 200px) * 16 / 9),1280px);height:auto;aspect-ratio:16/9;transform:translate(-50%,calc(-50% - 34px));box-shadow:0 0 0 3px #2a1a12,0 0 0 7px #c9a45c,0 0 0 9px #5a2a0c,0 30px 80px rgba(0,0,0,.6)}
.cine-back{position:fixed;inset:0;z-index:15;background:rgba(10,6,4,.82)}
.cine-bar.big{position:fixed;z-index:17;left:50%;transform:translateX(-50%);bottom:calc(14px + var(--safe-b));width:min(720px,calc(100vw - 24px))}
.cine-bar .pi{padding:8px 10px}
.cb-row{display:flex;align-items:center;gap:8px}
.cb-live{flex:none;width:8px;height:8px;background:#b08a5c}
.cb-live.on{background:#e8402e;animation:cbl 1.4s steps(2) infinite}
@keyframes cbl{50%{opacity:.25}}
.cb-now{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.cb-now b{font-size:13px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-now span{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cb-b{flex:none;height:30px;min-width:30px;padding:0 9px;border:0;font-family:var(--px);font-size:8.5px;color:var(--text);background:var(--panel-2);box-shadow:inset 0 0 0 2px var(--edge);cursor:pointer}
.cb-b:hover{background:#fbe6c0}
.cb-sched{background:#ffd23f;color:#2a1a00;box-shadow:inset 0 -3px 0 #c99a12}
.cb-sched:hover{background:#ffdb5c}
.cb-vol{width:72px;flex:none;accent-color:var(--hl)}
.cb-warn{display:flex;align-items:center;gap:8px;margin-top:8px;padding:7px 9px;font-size:12.5px;line-height:1.35;background:#f4c0a8;color:#5a1a0a;box-shadow:inset 0 0 0 2px var(--bad)}
.cb-warn span{flex:1}

.cw-now{display:flex;flex-direction:column;gap:3px;margin-bottom:14px;padding:12px;background:var(--panel-2);box-shadow:inset 0 0 0 2px var(--edge)}
.cw-k{margin-bottom:6px;font-family:var(--px);font-size:9px;color:var(--hl)}
.cw-now .cw-k{margin-bottom:2px}
.cw-now b{font-size:15px;line-height:1.3}
.cw-by{font-size:13px;color:var(--muted)}
.cw-now .w-row{margin-top:8px}
.cw-q{display:grid;gap:6px;margin:0 0 12px;padding:0;list-style:none;counter-reset:q}
.cw-q li{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--panel-2);box-shadow:inset 0 0 0 2px var(--edge);counter-increment:q}
.cw-q li::before{content:counter(q);flex:none;width:16px;font-family:var(--px);font-size:10px;color:var(--hl)}
.cw-q li div{flex:1;min-width:0;display:flex;flex-direction:column}
.cw-q b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cw-q span{font-size:12px;color:var(--muted)}
.cw-empty{margin:0 0 12px;font-size:14px;color:var(--muted)}
.cw-add{display:flex;gap:8px;margin-top:6px}
.cw-add input{flex:1;min-width:0;height:36px;padding:0 10px;font-size:14px;border:0;background:#fff4dc;color:var(--text);box-shadow:inset 0 0 0 2px var(--edge)}
.cw-msg{min-height:18px;margin:6px 0 0;font-size:13px}
.cw-msg.ok{color:var(--good)}
.cw-msg.bad{color:var(--bad)}
.cw-warn{margin-bottom:12px;padding:10px 12px;font-size:13.5px;line-height:1.4;background:#f4c0a8;color:#5a1a0a;box-shadow:inset 0 0 0 2px var(--bad)}
.cb-snd i{display:block;width:18px;height:16px;margin:0 auto;image-rendering:pixelated;background:no-repeat center/100% 100% url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 8' shape-rendering='crispEdges'%3E%3Cpath fill='%233d2410' d='M0 3h2v2h-2zM2 2h1v4h-1zM3 1h1v6h-1zM5 3h1v2h-1zM6 2h1v1h-1zM6 5h1v1h-1zM7 3h1v2h-1z'/%3E%3C/svg%3E")}
.cb-snd.off i{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 9 8' shape-rendering='crispEdges'%3E%3Cpath fill='%23b0281e' d='M0 3h2v2h-2zM2 2h1v4h-1zM3 1h1v6h-1zM5 2h1v1h-1zM7 2h1v1h-1zM6 3h1v2h-1zM5 5h1v1h-1zM7 5h1v1h-1z'/%3E%3C/svg%3E")}
.cb-snd.off{box-shadow:inset 0 0 0 2px var(--bad)}

/* ---------- Telegram Mini App (js/core/tg.js) ---------- */
html.tg{--safe-b:var(--tg-safe-area-inset-bottom,env(safe-area-inset-bottom,0px))}
.title-tg{margin:16px auto 0;max-width:420px;padding:10px 12px;font-size:13px;line-height:1.45;color:#d6f0ff;background:#0e2333;box-shadow:inset 0 0 0 2px #2aabee}

/* ---------- аватарка канала (js/core/avatar.js) ---------- */
.hud-tl .pi{display:flex;align-items:center;gap:10px}
.h-main{flex:1;min-width:0}
.h-ava{flex:none;width:48px;height:48px;image-rendering:pixelated;background:#e9c48c;box-shadow:0 0 0 2px #5a2a0c,0 0 0 4px #cf8a42;margin:2px}
@media (max-width:720px){.h-ava{width:34px;height:34px}.hud-tl .pi{gap:8px}}
.ph-chan{display:flex;align-items:center;gap:12px;margin-bottom:12px}
.ph-chan b{display:block;font-family:var(--px);font-size:11px;line-height:1.4}
.ph-chan span{font-size:12.5px;color:var(--muted)}
.ph-ava{flex:none;width:56px;height:56px;image-rendering:pixelated;box-shadow:0 0 0 2px #000,0 0 0 4px #7a5636}

/* ---------- никнейм в редакторе новой игры ---------- */
.ed-step{margin:4px 0 8px;font-family:var(--px);font-size:9px;color:var(--hl)}
.ed-nick{margin-bottom:14px;padding:12px;background:#fff3d6;box-shadow:inset 0 0 0 2px var(--hl),inset 0 0 0 4px #fbe8c4}
.ed-nick-row{display:flex;align-items:center;gap:12px}
.ed-ava{flex:none;width:60px;height:60px;image-rendering:pixelated;box-shadow:0 0 0 2px #5a2a0c,0 0 0 4px #cf8a42;margin:4px}
.ed-nick-in{flex:1;min-width:0}
.ed-nick-in label{display:block;margin-bottom:6px;font-family:var(--px);font-size:11px;line-height:1.5;color:var(--text)}
.ed-nick-in label span{font-family:var(--body);font-size:12.5px;color:var(--text-2)}
.ed-nick-in input{width:100%;height:42px;padding:0 12px;font-family:var(--px);font-size:12px;color:var(--text);background:#fffaf0;border:0;box-shadow:inset 0 0 0 2px var(--edge)}
.ed-nick-in input:focus{outline:none;box-shadow:inset 0 0 0 3px var(--hl)}
.ed-hint{margin:10px 0 0;font-size:12.5px;line-height:1.45;color:var(--text-2)}

/* ---------- синематик (js/core/cinematic.js) ---------- */
.cm{position:fixed;inset:0;z-index:55;cursor:pointer;user-select:none;-webkit-user-select:none}
.cm-bar{position:absolute;left:0;right:0;height:0;background:#000;transition:height .9s ease}
.cm-top{top:0}.cm-bot{bottom:0}
html.cm-on .cm-bar{height:12vh}
html.cm-on .cm-bot{height:max(150px,22vh)}
.cm-cap{position:absolute;left:50%;bottom:calc(14px + var(--safe-b,0px));transform:translateX(-50%);width:min(760px,calc(100vw - 32px));min-height:118px;text-align:center}
.cm-k{font-family:var(--px);font-size:12px;letter-spacing:.06em;color:#ffd23f;text-shadow:2px 2px 0 #3a1a06}
.cm-t{margin:12px 0 0;font-size:clamp(15px,2.1vw,19px);line-height:1.5;color:#fbefd9;min-height:3em}
.cm-next{margin-top:6px;font-size:12px;color:#e6bd84;opacity:0}
.cm-next.on{opacity:1;animation:cmb 1s steps(2) infinite}
@keyframes cmb{50%{opacity:.25}}
.cm-skip{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));right:14px;padding:8px 12px;font-family:var(--px);font-size:9px;color:#fbefd9;background:rgba(0,0,0,.55);border:0;box-shadow:inset 0 0 0 2px rgba(251,239,217,.35);cursor:pointer}
.cm-skip:hover{box-shadow:inset 0 0 0 2px #ffd23f}
.cm-fade{position:absolute;inset:0;background:#000;opacity:0;pointer-events:none}
.cm-fade.out{animation:cmf 1.1s ease}
@keyframes cmf{0%{opacity:1}100%{opacity:0}}
.cm.end{animation:cmend .42s ease forwards}
@keyframes cmend{to{background:#000}}
html.cm-on #screen,html.cm-on #fx{transition:filter 2.4s ease}
html.cm-sepia #screen,html.cm-sepia #fx{filter:sepia(.85) saturate(.5) brightness(.9) contrast(.95)}
html.cm-on #title,html.cm-on .hud,html.cm-on .chat{display:none!important}
.h-stats em{white-space:nowrap}
@media (max-width:720px){.h-stats{flex-wrap:wrap;row-gap:4px;gap:4px 9px}}
.h-stats{flex-wrap:wrap;row-gap:5px}