/* ==========================================================
   Kursach AI - стиль «аниме + лайм» (вариант 2) для всех страниц.
   Подключается ПОСЛЕ style.css и встроенных стилей страницы.
   Тема: data-theme="light" | "dark" (по времени суток, см. kai-theme в <head>).
   ========================================================== */
@import url("https://fonts.googleapis.com/css2?family=Unbounded:wght@600;800&family=Manrope:wght@500;600;700;800&display=swap");

:root, :root[data-theme="dark"], :root[data-theme="auto"] {
    --bg: #0b0b0c; --bg-elevated: #141416; --bg-card: #141416; --surface-2: #1c1c20;
    --border: #2a2a2e; --text: #f4f4f4; --text-muted: #a3a3a3;
    --primary: #c6ff3d; --primary-dark: #a8e01f; --accent: #c6ff3d;
    --acc: #c6ff3d; --acc-text: #0b0b0c; --ink: #0b0b0c; --stk-shadow: #f4f4f4;
    --glow: rgba(198, 255, 61, .16); --success: #8ce03a; --danger: #ff6b6b;
    --radius: 18px; --shadow: none;
}
:root[data-theme="light"] {
    --bg: #fafaf5; --bg-elevated: #ffffff; --bg-card: #ffffff; --surface-2: #f1f1ea;
    --border: #dcdcd2; --text: #121212; --text-muted: #5a5a5a;
    --primary: #3f7d00; --primary-dark: #2f6000; --accent: #3f7d00;
    --acc: #b8f02a; --acc-text: #121212; --ink: #121212; --stk-shadow: #121212;
    --glow: rgba(120, 180, 0, .18); --success: #3f7d00; --danger: #d43c3c;
    --shadow: none;
}

body { background: var(--bg) !important; color: var(--text); font-family: "Manrope", -apple-system, "Segoe UI", sans-serif !important; font-weight: 500; }
h1, h2, h3, .worktype-title, .modes-title, .kai-logo { font-family: "Unbounded", sans-serif; letter-spacing: -.03em; }
.container { max-width: 1000px; padding-left: 16px; padding-right: 16px; }

/* --- кнопки --- */
.btn { font-family: "Manrope", sans-serif !important; font-weight: 800 !important; border-radius: 14px !important; transition: transform .1s; }
.btn--primary, .start-wrap__btn, #chat-send {
    background: var(--acc) !important; color: var(--acc-text) !important;
    border: 2px solid var(--ink) !important; box-shadow: 3px 3px 0 var(--stk-shadow) !important;
}
.btn--primary:hover, .start-wrap__btn:hover { transform: translate(-1px, -1px); box-shadow: 4px 4px 0 var(--stk-shadow) !important; }
.btn--primary:active, .start-wrap__btn:active { transform: translate(2px, 2px); box-shadow: 1px 1px 0 var(--stk-shadow) !important; }
.start-wrap__btn:disabled { opacity: .45; transform: none; box-shadow: none !important; }
.btn--ghost { background: var(--bg-card) !important; color: var(--text) !important; border: 1.5px solid var(--border) !important; }
:root[data-theme="light"] .btn--ghost { border: 2px solid var(--ink) !important; }

/* --- шапка кабинета --- */
.page-head { margin: 14px 0 10px !important; }
.page-head h1 { font-size: 0 !important; }
.home-link { display: none !important; }
.kai-logo { display: inline-flex; align-items: center; gap: 8px; font-weight: 800; font-size: 19px; color: var(--text); text-decoration: none; }
.kai-logo i { width: 32px; height: 32px; border-radius: 10px; background: var(--acc); color: var(--acc-text); display: grid; place-items: center; font-style: normal; border: 2px solid var(--ink); box-shadow: 2px 2px 0 var(--stk-shadow); }
.theme-switch { display: none !important; }
.kai-theme-btn { width: 40px; height: 40px; border-radius: 999px; border: 1.5px solid var(--border); background: var(--bg-card); color: var(--text); font-size: 17px; cursor: pointer; }
.balance-chip { background: var(--bg-card) !important; border: 1.5px solid var(--border); color: var(--text) !important; }
.page-head-actions .btn { padding: 9px 14px !important; border-radius: 999px !important; }

/* --- приветствие с персонажем --- */
.kai-hello { display: flex; align-items: flex-end; gap: 12px; margin: 4px 0 6px; }
.kai-hello img { width: 92px; flex: 0 0 auto; filter: drop-shadow(0 10px 20px var(--glow)); animation: kai-float 4s ease-in-out infinite; }
.kai-hello .kai-bubble { background: var(--bg-card); border: 2px solid var(--ink); border-radius: 18px 18px 18px 4px; padding: 10px 14px; font-weight: 700; font-size: 15px; box-shadow: 3px 3px 0 var(--stk-shadow); margin-bottom: 14px; }
:root[data-theme="dark"] .kai-hello .kai-bubble { border-color: var(--border); box-shadow: none; }
@keyframes kai-float { 50% { transform: translateY(-6px); } }

.demo-banner { background: var(--bg-card) !important; border: 2px dashed var(--acc) !important; color: var(--text) !important; border-radius: 16px !important; font-weight: 700; }
:root[data-theme="light"] .demo-banner { border-color: var(--ink) !important; }
.demo-banner a { color: var(--text); font-weight: 800; text-decoration: underline; }

/* --- выбор типа работы: стикеры --- */
.worktype-title, .modes-title { font-size: 20px !important; font-weight: 800 !important; color: var(--text) !important; margin: 18px 0 10px !important; }
.worktype-tiles { gap: 10px !important; }
.worktype-tile {
    background: var(--c, var(--acc)) !important; color: #0b0b0c !important; border: 2px solid var(--ink) !important;
    box-shadow: 3px 3px 0 var(--stk-shadow) !important; border-radius: 16px !important; padding: 12px 8px !important;
    transform: rotate(-1.5deg); transition: transform .15s !important; opacity: .72;
}
.worktype-tile:nth-child(even) { transform: rotate(1.5deg); }
.worktype-tile:hover { transform: rotate(0) scale(1.03); opacity: 1; }
.worktype-tile.active { opacity: 1; transform: rotate(0) scale(1.05); box-shadow: 5px 5px 0 var(--stk-shadow) !important; outline: none !important; }
.worktype-tile[data-worktype="coursework"] { --c: #c6ff3d; }
.worktype-tile[data-worktype="essay"] { --c: #ff7eb6; }
.worktype-tile[data-worktype="diploma"] { --c: #ffd23f; }
.worktype-tile[data-worktype="task"] { --c: #7cc6ff; }
.worktype-tile[data-worktype="presentation"] { --c: #ff9f45; }
.worktype-icon { font-size: 0 !important; display: block; height: 28px; }
.worktype-icon svg { width: 28px; height: 28px; }
.worktype-name { color: #0b0b0c !important; font-weight: 800 !important; }
.worktype-desc { color: rgba(0,0,0,.65) !important; font-weight: 600; }

/* --- карточки и поля --- */
.upload-zone, .form-card, .extra-service, .result-box, .chat-container, .ap-result, .refine-box, .history-card {
    background: var(--bg-card) !important; border: 1.5px solid var(--border) !important; border-radius: 20px !important; box-shadow: none !important;
}
:root[data-theme="light"] .upload-zone, :root[data-theme="light"] .form-card, :root[data-theme="light"] .extra-service,
:root[data-theme="light"] .result-box, :root[data-theme="light"] .chat-container, :root[data-theme="light"] .history-card {
    border: 2px solid var(--ink) !important; box-shadow: 4px 4px 0 var(--ink) !important;
}
.upload-drop { border-color: var(--border) !important; border-radius: 14px !important; }
.form-card label, .refine-box label { color: var(--text) !important; font-weight: 800 !important; }
.form-card input, .form-card textarea, .form-card select, .refine-box textarea, .chat-input textarea {
    background: var(--surface-2) !important; color: var(--text) !important; border: 1.5px solid var(--border) !important;
    border-radius: 14px !important; font-family: "Manrope", sans-serif !important; font-weight: 600; font-size: 16px !important;
}
.form-card input:focus, .form-card textarea:focus, .form-card select:focus, .refine-box textarea:focus, .chat-input textarea:focus {
    border-color: var(--acc) !important; box-shadow: 0 0 0 3px var(--glow) !important; outline: none;
}
#main-topic { min-height: 84px; font-size: 17px !important; }
.form-extra summary { font-weight: 800; color: var(--text); }
.uniq-box { border: 2px solid var(--acc) !important; border-radius: 18px !important; background: var(--glow); }
:root[data-theme="light"] .uniq-box { border-color: var(--ink) !important; background: #f4ffd9; }
.extra-check { border-radius: 14px !important; border-color: var(--border) !important; background: var(--surface-2) !important; }

/* --- режимы --- */
.action-modes { gap: 10px !important; }
.action-mode {
    background: var(--bg-card) !important; border: 1.5px solid var(--border) !important; border-radius: 18px !important;
    transition: transform .15s, border-color .15s !important; text-align: left;
}
:root[data-theme="light"] .action-mode { border: 2px solid var(--ink) !important; }
.action-mode:hover { transform: translateY(-2px); border-color: var(--acc) !important; }
.action-mode.active { border: 2.5px solid var(--acc) !important; box-shadow: 0 0 26px var(--glow) !important; background: var(--bg-card) !important; }
:root[data-theme="light"] .action-mode.active { border-color: var(--ink) !important; box-shadow: 4px 4px 0 var(--ink) !important; background: #f4ffd9 !important; }
.action-mode__icon { font-size: 0 !important; width: 44px; height: 44px; flex: 0 0 44px; border-radius: 13px; display: grid !important; place-items: center;
    background: var(--c, var(--acc)); color: #0b0b0c; border: 2px solid var(--ink); box-shadow: 2px 2px 0 var(--stk-shadow); transform: rotate(-4deg); }
.action-mode__icon svg { width: 22px; height: 22px; }
.action-mode[data-mode="plan"] { --c: #c6ff3d; } .action-mode[data-mode="tutor"] { --c: #7cc6ff; }
.action-mode[data-mode="coauthor"] { --c: #ff7eb6; } .action-mode[data-mode="fullauto"] { --c: #ffd23f; }
.action-mode__name { color: var(--text) !important; font-weight: 800 !important; }
.action-mode__desc { color: var(--text-muted) !important; }
.action-mode__price { background: var(--surface-2) !important; color: var(--text) !important; font-weight: 800 !important; border-radius: 999px !important; }
.action-mode__price.free { background: var(--acc) !important; color: var(--acc-text) !important; }
.start-wrap__btn { font-size: 18px !important; padding: 16px !important; }
.start-wrap__hint { color: var(--text-muted) !important; font-weight: 600; }

.extra-service__icon { font-size: 0 !important; width: 44px; height: 44px; border-radius: 13px; display: grid !important; place-items: center; background: #7cc6ff; color: #0b0b0c; border: 2px solid var(--ink); box-shadow: 2px 2px 0 var(--stk-shadow); }
.extra-service__icon svg { width: 22px; height: 22px; }
.extra-service__price { color: var(--text) !important; font-weight: 800; }

/* --- ожидание: персонаж спит, пока пишется работа --- */
.loader { padding: 6px 0 14px; }
.loader .spinner { display: none !important; }
.loader:before { content: ""; display: block; width: 190px; height: 190px; margin: 0 auto 6px;
    background: url("/v2/img/anime-sleep.webp") center / contain no-repeat; animation: kai-float 3s ease-in-out infinite; }
#loader-text { font-weight: 800; color: var(--text) !important; font-size: 16px; }
#loader-progress { color: var(--text-muted); font-weight: 600; }

/* --- результат и чат --- */
.result-box > h3 { color: var(--text) !important; font-size: 20px !important; }
.md-content { font-size: 16px; line-height: 1.6; }
.student-notes { border: 2px solid var(--acc) !important; background: var(--glow) !important; border-radius: 16px !important; }
:root[data-theme="light"] .student-notes { border-color: var(--ink) !important; background: #fff8d6 !important; }
.msg { border-radius: 18px !important; font-weight: 500; }
.msg-user { background: var(--acc) !important; color: var(--acc-text) !important; border-radius: 18px 18px 4px 18px !important; }
.msg-ai { background: var(--surface-2) !important; color: var(--text) !important; border-radius: 18px 18px 18px 4px !important; }
.msg-system { color: var(--text-muted) !important; }
.chat-header { border-color: var(--border) !important; }
.err { border-radius: 14px !important; font-weight: 700; }

/* --- история --- */
.history-fab { background: var(--bg-card) !important; color: var(--text) !important; border: 2px solid var(--ink) !important; box-shadow: 3px 3px 0 var(--stk-shadow) !important; border-radius: 999px !important; font-family: "Manrope", sans-serif !important; font-weight: 800 !important; }
:root[data-theme="dark"] .history-fab { border-color: var(--border) !important; box-shadow: none !important; }

/* --- шаблоны презентаций --- */
.preset-card { border-radius: 16px !important; border-color: var(--border) !important; background: var(--bg-card) !important; }
.preset-card.active { border-color: var(--acc) !important; box-shadow: 0 0 0 3px var(--glow) !important; }

/* --- кнопка поддержки в фирменных цветах --- */
.support-fab { background: var(--acc) !important; color: var(--acc-text) !important; border: 2px solid var(--ink) !important; box-shadow: 3px 3px 0 var(--stk-shadow) !important; }

@media (prefers-reduced-motion: reduce) { .kai-hello img, .loader:before { animation: none; } }

/* --- «Мои работы» слева, поддержка справа: не накладываются --- */
.history-fab { right: auto !important; left: 16px !important; }

/* --- телефон: типы работ лентой с прокруткой вбок --- */
@media (max-width: 640px) {
    .worktype-tiles { display: flex !important; overflow-x: auto; gap: 10px; margin: 0 -16px; padding: 4px 16px 12px; scrollbar-width: none; }
    .worktype-tiles::-webkit-scrollbar { display: none; }
    .worktype-tile { flex: 0 0 auto; min-width: 128px; }
    .kai-hello img { width: 78px; }
    .upload-drop .btn { padding: 10px 14px !important; }
}

/* --- голосовой ввод: обёртка поля в чате тянется на всю ширину --- */
.chat-input .voice-wrap { flex: 1; display: flex; }
.chat-input .voice-wrap textarea { flex: 1; }
.form-card .voice-wrap textarea { width: 100%; }

/* ===== Страница стилей презентаций (templates.html) ===== */
.kai-tpl header { background: var(--bg) !important; border-bottom: 1.5px solid var(--border) !important; }
.kai-tpl header .inner { max-width: 1160px; margin: 0 auto; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; }
.kai-tpl .nav-cta { background: var(--acc) !important; color: var(--acc-text) !important; border: 2px solid var(--ink) !important;
    box-shadow: 3px 3px 0 var(--stk-shadow) !important; border-radius: 14px !important; font-weight: 800 !important; padding: 10px 16px !important; }
.kai-tpl .hero { position: relative; padding-top: 30px !important; }
.kai-tpl .hero h1 { font-family: "Unbounded", sans-serif; font-weight: 800; letter-spacing: -.03em; }
.kai-tpl .hero p { color: var(--text-muted) !important; }
.kai-tpl .tpl-mascot { width: 120px; display: block; margin: 0 auto 4px; animation: kai-float 4s ease-in-out infinite; filter: drop-shadow(0 10px 20px var(--glow)); }
.kai-tpl .stats { background: var(--bg-card) !important; border: 1.5px solid var(--border) !important; }
.kai-tpl .stats strong { color: var(--text) !important; }
.kai-tpl .card { background: var(--bg-card) !important; border: 1.5px solid var(--border) !important; border-radius: 20px !important; overflow: hidden; transition: transform .2s; }
:root[data-theme="light"] .kai-tpl .card { border: 2px solid var(--ink) !important; box-shadow: 4px 4px 0 var(--ink) !important; }
.kai-tpl .card:hover { transform: translateY(-3px) rotate(-.4deg); }
.kai-tpl .card__name { font-family: "Unbounded", sans-serif; font-weight: 800; color: var(--text) !important; }
.kai-tpl .card__tagline { color: var(--text-muted) !important; }
.kai-tpl .card__chip { background: var(--surface-2) !important; color: var(--text) !important; border-radius: 999px !important; }
.kai-tpl .card__btn--primary { background: var(--acc) !important; color: var(--acc-text) !important; border: 2px solid var(--ink) !important;
    box-shadow: 3px 3px 0 var(--stk-shadow) !important; border-radius: 14px !important; font-weight: 800 !important; }
.kai-tpl .card__btn--ghost { background: transparent !important; color: var(--text) !important; border: 1.5px solid var(--border) !important; border-radius: 14px !important; font-weight: 700 !important; }
.kai-tpl footer { color: var(--text-muted) !important; border-color: var(--border) !important; }
.kai-tpl footer a { color: var(--text) !important; }

/* ===== Оферта и юридические страницы ===== */
.kai-legal .header { background: var(--bg) !important; border-bottom: 1.5px solid var(--border) !important; box-shadow: none !important; }
.kai-legal .legal { background: var(--bg-card); border: 1.5px solid var(--border); border-radius: 20px; padding: 22px 22px 26px; margin: 18px 0 30px; font-size: 15.5px; line-height: 1.65; }
:root[data-theme="light"] .kai-legal .legal { border: 2px solid var(--ink); box-shadow: 4px 4px 0 var(--ink); }
.kai-legal .legal h1 { font-family: "Unbounded", sans-serif; font-weight: 800; font-size: 28px; letter-spacing: -.03em; }
.kai-legal .legal h2 { font-family: "Unbounded", sans-serif; font-weight: 800; font-size: 17px; margin-top: 22px; }
.kai-legal .legal a, .kai-legal .footer a { color: var(--text); text-decoration: underline; }
.kai-legal .footer { color: var(--text-muted); border-color: var(--border) !important; background: transparent !important; }
.kai-tpl .kai-logo { white-space: nowrap; }
@media (max-width: 520px) {
  .kai-tpl header .inner { gap: 10px; }
  .kai-tpl .nav-cta { white-space: nowrap; padding: 9px 12px !important; font-size: 14px !important; }
  .kai-tpl .stats { flex-wrap: wrap; justify-content: center; gap: 4px 14px !important; border-radius: 18px !important; }
}

/* скрытое - скрыто, даже если у кнопки свой display */
[hidden] { display: none !important; }

/* Телефон: «Мои работы» - круглая иконка, не перекрывает кнопки внизу экрана */
@media (max-width: 600px) {
  #history-fab { font-size: 0 !important; width: 54px; height: 54px; padding: 0 !important; border-radius: 50% !important; display: grid; place-items: center; }
  #history-fab::before { content: "🗂"; font-size: 24px; }
  body { padding-bottom: 96px !important; }
}