/* ВГО: текстовые карточки. Скопировать в корень игры и подключить ПОСЛЕ atlas.css.
   Существующие ID и обработчики не меняются. data-kind=place включает широкую
   историю места; data-kind=hint — короткую записку. Это дополнение, не тема карты. */
#modal{
  --text-ink:#293d38; --text-teal:#246d70; --text-muted:#586455;
  --text-line:#b7a584; --text-serif:Georgia,'Times New Roman',serif;
  --text-sans:Arial,Helvetica,sans-serif;
  box-sizing:border-box; width:min(760px,calc(100vw - 32px)); max-width:920px;
  max-height:calc(100dvh - 32px); overflow-y:auto; overscroll-behavior:contain;
  padding:26px 34px 30px; color:var(--text-ink); border:1px solid #9e8d6a;
  border-radius:2px; outline:1px solid #c5b99e; outline-offset:-6px;
  background:linear-gradient(#fff7e8d9,#fff8e8d9),url('assets/atlas-paper.webp') center/750px;
  box-shadow:0 24px 70px #293d3838,0 2px 6px #293d3825;
  font:16px/1.65 var(--text-sans);
}
#modal[open]{animation:atlas-text-appear 180ms ease-out}
#modal::backdrop{background:#283f3861;backdrop-filter:blur(3px)}
#modal .dialog-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 22px}
#modal .eyebrow,#modal .quest-label{font:700 11px/1.5 var(--text-sans);letter-spacing:1.4px;text-transform:uppercase;color:#526257}
#modal .close-button{width:44px;height:44px;min-height:44px;flex-shrink:0;border:1px solid #aaa087;background:transparent;border-radius:1px;font:28px/1 var(--text-sans);color:#46594b}
#modal .close-button:hover{background:#e4dcc8}
#modal h2{font:400 clamp(29px,4vw,40px)/1.12 var(--text-serif);letter-spacing:-.6px;color:var(--text-ink);margin:12px 0 18px}
#modal h3{font:400 23px/1.25 var(--text-serif);color:#345b4e;margin:22px 0 10px}
#modal p,#modal li{font:16px/1.65 var(--text-sans);color:var(--text-ink)}
#modal p{margin:0 0 18px}
#modal .discovery-meta{display:flex;gap:10px 18px;flex-wrap:wrap;font:14px/1.5 var(--text-sans);color:var(--text-muted);margin:0 0 24px}
#modal .motive-card,#modal .fact-box{border:0;border-left:3px solid #547f70;border-radius:0;background:#dbe5d65c;padding:16px 20px;margin:22px 0}
#modal .motive-card p,#modal .fact-box p{font:16px/1.6 var(--text-sans);margin:6px 0 0}
#modal .fact-box h3{font:400 21px/1.3 var(--text-serif);margin:0 0 9px}
#modal .preparation-heading{display:flex;align-items:center;gap:22px;margin-bottom:24px}
#modal .preparation-heading h2{margin:8px 0 10px}
#modal .preparation-heading p:last-child{font:italic 18px/1.4 var(--text-serif);margin:0;color:#5f6958}
#modal .preparation-portrait{width:88px;height:88px;flex-shrink:0;border:3px double #96815d;box-shadow:0 0 0 4px #ece0c7}
#modal .quiz-fieldset{border:0;padding:0;margin:25px 0 0;min-width:0}
#modal .quiz-fieldset legend{font:400 22px/1.3 var(--text-serif);padding:0}
#modal .quiz-fieldset>p{font:14px/1.5 var(--text-sans);color:var(--text-muted);margin:8px 0 12px}
#modal .answer-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
#modal .answer-choice{border:1px solid #aaa38b;min-height:48px;padding:12px 9px;background:#fffbef75;border-radius:2px;font:15px/1.4 var(--text-sans);color:#324c40}
#modal .answer-choice[aria-pressed=true]{border:1px solid #246d70;padding:12px 9px;background:#d6e3d6;box-shadow:inset 3px 0 #246d70;color:#173e38}
#modal .answer-correct .answer-choice[aria-pressed=true]{border-color:#38684d;background:#d9e6d4}
#modal .answer-wrong .answer-choice[aria-pressed=true]{border-color:#9c713b;background:#efdfc1;box-shadow:inset 3px 0 #9c713b}
#modal .quiz-hint{font:13px/1.5 var(--text-sans);min-height:44px;padding:9px 0;text-align:left;color:#345e55;text-underline-offset:4px}
#modal .quiz-feedback{font:15px/1.6 var(--text-sans);min-height:42px;border-left:2px solid #ba9d66;padding-left:14px;margin:20px 0;color:#465f50}
#modal .primary-button,#modal .secondary-button{font:15px/1.4 var(--text-sans);min-height:48px;padding:13px 20px;border-radius:2px;white-space:normal;display:inline-flex;justify-content:center;align-items:center;gap:16px}
#modal .primary-button{background:#246d70;border:1px solid #246d70;color:#fff9eb}
#modal .primary-button:hover{background:#19595c}
#modal .secondary-button{background:transparent;border:1px solid #a49b7e;color:#3c574b}
#modal .secondary-button:hover{background:#e5e1cc}
#modal .modal-actions{border-top:1px solid var(--text-line);margin-top:26px;padding-top:20px;display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
#modal .source-link{font:13px/1.5 var(--text-sans);color:#345e55;text-underline-offset:4px}
#modal details{border-block:1px solid #c7b99b;padding:13px 0;margin:20px 0}
#modal summary{font:18px/1.4 var(--text-serif);color:#345d54;cursor:pointer;min-height:30px}
#modal details p{margin:15px 0 0}
#modal :is(button,a,summary):focus-visible{outline:3px solid #246d70;outline-offset:4px}
#modal[data-kind=place]{width:min(920px,calc(100vw - 32px))}
#modal[data-kind=hint]{width:min(560px,calc(100vw - 32px))}
#modal .atlas-story-layout{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:32px}
#modal .atlas-story-aside{border-left:1px solid #c8baa0;padding:16px 0 16px 24px;text-align:center}
#modal .atlas-story-aside p{font:italic 16px/1.5 var(--text-serif);color:#586455}
#modal .atlas-story-deck{font:italic 21px/1.4 var(--text-serif);color:#626451;margin-bottom:24px}
#modal .atlas-story-takeaway{background:#dbe5d65c;border-left:3px solid #547f70;padding:16px 20px;margin:22px 0}
#modal .atlas-story-takeaway p{margin:6px 0 0}
.mission-panel .feedback:not(:empty){font:15px/1.6 Arial,Helvetica,sans-serif;color:#345347;border:0;border-left:3px solid #547f70;background:#dbe5d680;padding:14px 16px;margin-top:16px;border-radius:0}
.mission-panel .feedback.error:not(:empty){color:#644d2e;border-color:#a67d43;background:#eee0c680}
.toast{font:15px/1.5 Arial,Helvetica,sans-serif;max-width:min(520px,calc(100vw - 32px));padding:15px 21px;border:1px solid #526b58;border-radius:2px;background:#293d38;color:#fff7e5}
@keyframes atlas-text-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:620px){
  #modal,#modal[data-kind=place],#modal[data-kind=hint]{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:20px 22px 24px}
  #modal .dialog-top{margin-bottom:18px}
  #modal .preparation-heading{gap:15px}
  #modal .preparation-portrait{width:62px;height:62px}
  #modal .preparation-heading h2{font-size:27px}
  #modal .preparation-heading p:last-child{font-size:16px}
  #modal p,#modal li,#modal .fact-box p,#modal .motive-card p{font-size:16px}
  #modal .eyebrow,#modal .quest-label{font-size:10px;letter-spacing:1px}
  #modal .answer-options{gap:7px}
  #modal .answer-choice,#modal .answer-choice[aria-pressed=true]{font-size:14px;padding:11px 5px}
  #modal .quiz-fieldset legend{font-size:21px}
  #modal .modal-actions>*{flex:1 1 190px}
  #modal .atlas-story-layout{display:block}
  #modal .atlas-story-aside{border-left:0;border-top:1px solid #c8baa0;padding:16px 0 0;margin-top:22px}
}
@media(prefers-reduced-motion:reduce){#modal[open]{animation:none}#modal *,#modal *::before,#modal *::after{animation:none!important;transition:none!important}}

/* Дополнение: год старта + продолжительность + содержательная подсказка. */
#modal .duration-context{display:flex;align-items:center;gap:12px 18px;flex-wrap:wrap;border-block:1px solid #c7b99b;padding:13px 16px;margin:20px 0 24px}
#modal .duration-context .eyebrow{flex-basis:100%}
#modal .duration-context strong{font:26px var(--text-serif);color:#2b6256}
#modal .duration-context>span:last-child{font:14px/1.4 var(--text-sans);color:#586455}
#modal .learning-clue{margin:22px 0 0;padding:17px 20px;background:#eee3c7;border:1px solid #bca681;border-left:3px solid #a27e45}
#modal .learning-clue p{margin:9px 0 0}
#modal .memory-card{margin-top:22px;padding:20px;background:#e0e9da;border:1px solid #9cb5a0}
#modal .memory-card[hidden],#modal .learning-clue[hidden]{display:none}
#modal .memory-line{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:12px;align-items:center;margin:18px 0}
#modal .memory-line>div{display:flex;flex-direction:column}
#modal .memory-line strong{font:34px var(--text-serif);color:#2f6052}
#modal .memory-line span{font:13px/1.4 var(--text-sans);color:#526453}
#modal .duration-bridge{text-align:center;border-block:1px solid #93aa96;padding:9px 0}
#modal .duration-bridge b{font:18px var(--text-serif)}
#modal .memory-card>p{font:15px/1.5 var(--text-sans);margin:12px 0 0}
#modal .memory-card .period{font-size:13px;color:#5d6b58}
#modal .memory-line>div:last-child{text-align:right}
@media(max-width:420px){#modal .memory-card{padding:15px}#modal .memory-line{gap:7px;grid-template-columns:1fr 1fr 1fr}#modal .memory-line strong{font-size:27px}#modal .memory-line span{font-size:12px}#modal .duration-bridge b{font-size:16px}}