/* Rolleområder: opgaver og dialog først; illustrationerne er indgange til kilder. */
:root { --desk-accent:#365d8c; }
.masthead { padding-top:16px; padding-bottom:16px; }
.entry { padding-top:42px; gap:48px; }
.entry h1 { font-size:80px; margin:20px 0; }
.entry .lead { font-size:16px; line-height:1.75; }
.entry-meta { padding:20px 0; }
.entry-scene { margin:24px 0 0; background:#e5e7dc; border:1px solid #d7d9c9; border-radius:8px; overflow:hidden; }
.entry-scene img { display:block; width:100%; height:210px; object-fit:cover; object-position:center 45%; }
.entry-scene figcaption { font-size:11px; color:#50604f; padding:12px 15px; }
.role-teasers { grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.role-teasers article { flex-direction:column; align-items:start; gap:10px; }
.entry-panel { border-radius:8px; overflow:hidden; }
.game { padding:20px 28px; }
.room-top { padding-bottom:17px; }
.room-top h1 { font-size:30px; }
.phase-strip { margin-bottom:20px; border-radius:5px; overflow:hidden; }
.phase { padding:10px 14px; }
.workspace { grid-template-columns:215px minmax(0,1fr); gap:25px; }
.mission { border-radius:6px; padding:20px; }
.mission h2 { font:600 21px/1.2 var(--sans); margin:12px 0; }
.mission .text-button { margin-top:17px; padding:0; text-align:left; color:var(--ink); }
.players-panel summary { font-size:11px; font-weight:600; cursor:pointer; padding:8px 0; }
.workspace-tabs { gap:4px; border-color:#cbd2c3; }
.workspace-tabs button { padding:13px 11px; font-size:11px; }
.workspace-tabs button[aria-selected=true] { border-color:var(--desk-accent); color:var(--desk-accent); }
.panel { padding-top:20px; }
#game[data-role=journalist] { --desk-accent:#365d8c; --desk-tint:#e8eef5; }
#game[data-role=press] { --desk-accent:#8a6024; --desk-tint:#f3ecde; }
#game[data-role=director] { --desk-accent:#244d3b; --desk-tint:#e6ede4; }
#game[data-role=host] { --desk-accent:#5f536b; --desk-tint:#eeebf1; }
.workspace-overview { display:flex; align-items:center; justify-content:space-between; gap:25px; padding:25px 29px; border:1px solid #d2d8cd; border-radius:7px; background:var(--desk-tint); }
.workspace-overview .eyebrow { color:var(--desk-accent); }
.workspace-overview h2 { font:600 35px/1.14 var(--sans); letter-spacing:-1px; margin:8px 0 12px; }
.workspace-overview p { font-size:14px; line-height:1.6; max-width:620px; }
.workspace-overview small { display:block; font-size:10px; color:var(--muted); margin-top:10px; }
.desk-emblem { flex:0 0 70px; height:70px; display:grid; place-items:center; border:1px solid #a4afa050; border-radius:14px; font:42px var(--serif); color:var(--desk-accent); background:#fffefa88; transform:rotate(-4deg); box-shadow:4px 6px 0 #a4afa015; }
.mission-brief { display:flex; align-items:center; gap:18px; padding:20px 0; border-bottom:1px solid var(--line); margin-bottom:25px; }
.mission-brief>div { flex:1; }
.mission-number { display:grid; place-items:center; width:39px; height:44px; flex-shrink:0; border:1px solid #cab576; border-radius:4px; color:#8e7437; font-size:14px; }
.mission-brief h3 { font-size:16px; margin:3px 0 7px; }
.mission-brief p { font-size:12px; color:#546252; }
.mission-brief small { display:block; font-size:9px; color:var(--muted); margin-top:7px; }
.mission-brief .button { font-size:10px; padding:10px 12px; white-space:nowrap; }
.section-title { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:10px; }
.section-title h2,.practice>h2 { font:600 20px/1.35 var(--sans); letter-spacing:-.3px; }
.section-title .eyebrow { margin-bottom:5px; }
.learning-hint { font-size:11px; line-height:1.6; color:var(--muted); margin:8px 0 16px; }
.learning-path { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.learning-step { display:flex; flex-direction:column; align-items:start; min-width:0; padding:18px 15px; border:1px solid var(--line); border-radius:6px; background:var(--white); }
.step-number { display:grid; place-items:center; width:27px; height:27px; border:1px solid #d6dbcf; border-radius:50%; color:var(--desk-accent); font-size:10px; margin-bottom:14px; }
.learning-step.started .step-number { background:var(--desk-accent); color:white; border-color:var(--desk-accent); }
.learning-step h3 { font-size:13px; line-height:1.5; margin-bottom:8px; }
.learning-step p { font-size:11px; color:#66705f; line-height:1.75; margin-bottom:20px; }
.step-link { display:flex; align-items:center; justify-content:space-between; width:100%; text-align:left; gap:10px; font-size:10px; font-weight:600; line-height:1.55; color:var(--desk-accent); border:0; border-top:1px solid var(--line); padding:12px 0 0; background:none; margin-top:auto; }
.step-link:hover { color:var(--ink); }
.step-link span { font-size:16px; flex-shrink:0; }
.home-columns { display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:32px; align-items:start; }
.home-inbox .section-title h2 { font-size:18px; }
.home-inbox .text-button { padding:0; font-size:10px; color:var(--desk-accent); }
.inbox-preview { padding:16px 0; border-bottom:1px solid var(--line); }
.inbox-preview h3 { font-size:13px; margin:5px 0 8px; }
.inbox-preview p,.inbox-empty { font-size:12px; color:#62705d; margin-bottom:9px; }
.practice { background:#efeee5; padding:21px; border:1px solid var(--line); border-radius:6px; }
.practice>h2 { margin-top:6px; font-size:18px; }
.practice-question { border:0; padding:18px 0 0; margin:17px 0 0; min-width:0; border-top:1px solid #d6d9cb; }
.practice-question legend { font-size:12px; font-weight:600; padding:0 8px 0 0; }
.practice-question>p { font-size:12px; margin:0 0 13px; }
.practice-option { display:flex; align-items:start; gap:10px; padding:11px; font-weight:400; font-size:11px; line-height:1.65; margin:7px 0; border:1px solid #d5d8cc; background:var(--white); border-radius:4px; cursor:pointer; }
.practice-option input { width:14px; height:14px; min-height:0; flex:0 0 14px; margin:4px 0 0; accent-color:var(--desk-accent); }
.practice-option:has(input:checked) { border-color:var(--desk-accent); background:var(--desk-tint); }
.practice-feedback { margin:12px 0; padding:14px; font-size:11px; background:#fbedd4; border-left:2px solid #b9975c; }
.practice-feedback.supported { background:#e3eadc; border-color:#66805d; }
.practice-feedback p { margin:6px 0 10px; }
.practice-feedback .text-button { padding:0; color:var(--ink); }
.teacher-prompts { font-size:12px; color:var(--muted); padding-left:16px; }
.teacher-prompts li { margin:13px 0; }
.factory-map { position:relative; width:100%; border:1px solid #c9cbbd; border-radius:7px; overflow:hidden; background:#e5e6db; }
.factory-map>img { display:block; width:100%; height:auto; }
.map-pin { position:absolute; left:var(--x); top:var(--y); transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; gap:5px; border:0; padding:0; color:var(--ink); background:none; }
.map-pin>span { display:grid; place-items:center; font-size:11px; font-weight:600; width:35px; height:35px; background:#fffbed; border:2px solid #315140; border-radius:50%; box-shadow:0 3px 8px #1115; }
.map-pin strong { font-size:9px; background:#fffcf2ef; padding:4px 8px; border:1px solid #cdd2c0; border-radius:4px; box-shadow:0 2px 5px #0002; white-space:nowrap; }
.map-pin:hover span,.map-pin.selected span { background:#d6af59; }
.map-pin.selected strong { background:#f6e5bf; border-color:#b8985a; }
.location-list { display:flex; flex-wrap:wrap; gap:7px; padding:14px 0; }
.location-list button { border:1px solid var(--line); background:var(--white); padding:9px 11px; border-radius:4px; font-size:10px; color:var(--ink); }
.location-list button span { margin-right:7px; color:var(--muted); }
.location-list button.selected { border-color:#b89a52; background:#f3ead3; }
.location-detail { padding:25px; border:1px solid var(--line); border-radius:6px; margin-top:5px; background:var(--white); scroll-margin-top:20px; }
.location-detail h2 { font:31px/1.2 var(--serif); margin:8px 0 10px; }
.location-detail p { font-size:12px; color:#62705d; }
.location-header { display:grid; grid-template-columns:240px minmax(0,1fr); gap:24px; align-items:start; }
.location-header>img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:5px; }
.location-header>img.portrait { aspect-ratio:4/5; object-position:center top; }
.person-role { font-size:10px; display:block; color:var(--muted); margin-bottom:14px; }
.source-question { background:#f1f2e9; border-left:2px solid #b7c1a7; padding:13px 16px; margin-top:16px; font-size:11px; }
.source-question p { margin-top:5px; font-size:11px; }
.location-contact { margin-top:18px; }
.location-contact>.button { margin-top:9px; font-size:11px; }
.source-context { margin:25px 0 12px; border-top:1px solid var(--line); padding-top:17px; font-size:10px !important; }
.location-sources { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.location-sources>article { padding:18px; border:1px solid var(--line); background:#faf9f3; border-radius:4px; }
.location-sources h3 { font-size:14px; margin:8px 0 13px; }
.location-sources small { display:block; color:var(--muted); font-size:9px; margin-top:12px; }
.location-sources .button { font-size:10px; padding:10px 12px; min-height:38px; }
.location-sources a { font-size:10px; }
.back-to-work { padding:0; margin-top:22px; color:var(--desk-accent); text-align:left; }
.writing-tools { display:flex; align-items:center; gap:15px; flex-wrap:wrap; margin-bottom:23px; }
.writing-tools p { font-size:11px; color:var(--muted); }
.draft-review { margin-top:23px; border:1px solid var(--line); border-radius:5px; padding:17px 20px; font-size:12px; background:#ebeede; }
.draft-review summary { cursor:pointer; font-weight:600; }
.draft-review ul { padding-left:17px; }
.draft-review li { margin:10px 0; }
.draft-review p { color:var(--muted); font-size:11px; }
.composer-status { font-size:11px; color:#8b6727; padding-top:10px; }
.composer-status:empty { display:none; }
.notice { position:sticky; top:8px; z-index:10; margin-left:28px; margin-right:28px; box-shadow:0 4px 20px #172b1210; }
.ai-box .desk-actions { margin-top:0; }
.ai-box h3+.badge { display:inline-block; margin-bottom:10px; color:var(--desk-accent); background:var(--desk-tint); }
.ai-box>div>p { margin-top:3px; }
.local-ai-settings { margin:18px 0; padding:15px 18px; border:1px solid var(--line); border-radius:5px; background:#f0f2e8; }
.local-ai-settings summary { cursor:pointer; font-size:12px; font-weight:600; }
.local-ai-settings form { padding-top:10px; }
.local-ai-settings p { font-size:11px; }
.local-ai-settings input,.local-ai-settings select { margin-top:6px; }
.local-ai-settings button { margin-bottom:5px; }
.ai-history .feed-card.guidance { background:#eef0e4; border-left:3px solid #a4af86; }
@media (max-width:1150px) {
  .workspace { grid-template-columns:180px minmax(0,1fr); gap:20px; }
  .mission { padding:17px; }
  .learning-path { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .workspace-tabs button { padding:13px 9px; font-size:10px; }
  .location-header { grid-template-columns:190px minmax(0,1fr); }
  .mission-brief { flex-wrap:wrap; }
  .mission-brief .button { margin-left:57px; }
}
@media (max-width:850px) {
  .entry { grid-template-columns:1fr; padding:32px 24px; }
  .entry h1 { font-size:75px; }
  .entry-scene img { height:240px; }
  .workspace { grid-template-columns:1fr; }
  .sidebar { display:flex; align-items:start; flex-wrap:wrap; gap:14px; border-bottom:1px solid var(--line); padding-bottom:14px; }
  .mission { flex:1 1 250px; padding:15px 18px; }
  .mission h2 { font-size:18px; margin:7px 0; }
  .mission p { font-size:11px; }
  .mission .text-button { margin-top:9px; font-size:10px; }
  .players-panel { flex:1 1 170px; padding:8px 15px; }
  .archive-link { width:100%; padding:0; border:0; }
  .workspace-tabs button { font-size:11px; padding:13px 10px; }
  .workspace-overview h2 { font-size:32px; }
  .workspace-overview { padding:22px; }
  .home-columns { gap:18px; }
  .location-header { grid-template-columns:190px minmax(0,1fr); }
}
@media (max-width:620px) {
  .game { padding:18px; }
  .room-top h1 { font-size:27px; }
  .workspace-tabs button { flex:none; }
  .workspace-overview h2 { font-size:29px; }
  .workspace-overview { padding:21px; gap:15px; }
  .workspace-overview p { font-size:12px; }
  .desk-emblem { display:none; }
  .section-title { align-items:start; flex-wrap:wrap; }
  .section-title h2 { font-size:18px; }
  .home-columns { grid-template-columns:1fr; }
  .learning-path { gap:10px; }
  .learning-step { padding:15px 13px; }
  .mission-brief { gap:13px; }
  .mission-brief .button { margin-left:52px; }
  .map-pin>strong { display:none; }
  .map-pin>span { width:30px; height:30px; font-size:10px; }
  .location-header { grid-template-columns:1fr; }
  .location-header>img { max-height:220px; aspect-ratio:16/9; }
  .location-header>img.portrait { object-position:center 25%; }
  .location-detail { padding:19px; }
  .location-sources { grid-template-columns:1fr; }
  .location-list button { font-size:9px; }
  .sidebar { gap:9px; }
  .players-panel { flex:1 1 100%; }
  .entry-scene img { height:200px; }
  .role-teasers h2 { font-size:11px; }
}
@media (max-width:390px) { .learning-path { grid-template-columns:1fr; } .entry h1 { font-size:63px; } }
/* Soloforløbet bruger spillerens eget bord og indbakke. */
.solo-options { display:flex; align-items:flex-end; flex-wrap:wrap; gap:14px 20px; margin-top:16px; }
.solo-options label { margin:0; flex:1 1 220px; max-width:360px; }
.solo-options select { display:block; margin-top:7px; font-size:12px; }
.solo-options .button { flex:0 1 auto; max-width:100%; text-align:left; }
.solo-status { margin-top:14px; padding:10px 12px; background:#f5f6ee; border-left:2px solid #9bae89; font-size:12px; overflow-wrap:anywhere; }
.virtual-label { color:#426249; background:#e9f0e4; border:1px solid #cedbc7; border-radius:3px; padding:2px 6px; }
.virtual-note { font-size:12px; color:#775b26; background:#f8eedb; padding:9px 12px; margin-bottom:12px; }
.virtual-card { border-left:3px solid #96ad8b; }
@media(max-width:600px) { .solo-options label { max-width:none; flex-basis:100%; } .solo-options .button { width:100%; justify-content:flex-start; } .tabs button { font-size:11px; padding:15px 8px; } }
@media(max-width:850px) { .entry[data-mode="solo"] .entry-panel { order:-1; } }
.export-content #export-text { margin-top:10px; min-height:260px; max-height:55dvh; font:12px/1.65 ui-monospace,monospace; }
.export-content #export-status { font-size:12px; overflow-wrap:anywhere; }