/* Shared stone, pine and brass palette and header, for React, account pages and online PWA. */
:root{
 color-scheme:light;
 --lms-bg:#dedfdd;--lms-surface:#e4e5e2;--lms-surface-raised:#eaeae6;--lms-surface-soft:#d5d7d2;--lms-input:#dddedb;
 --lms-ink:#26332f;--lms-muted:#4d5551;--lms-border:#b5b9b4;
 --lms-blue:#216554;--lms-blue-hover:#184e41;--lms-accent:#245b4d;--lms-accent-soft:#cbd9cf;--lms-on-accent:#fff;
 --lms-overlay:rgba(24,34,28,.48);
 --lms-gold:#b18c47;--lms-gold-soft:#e7dbc1;--lms-gold-ink:#674d22;
 --lms-shadow:0 6px 20px #29392b0a;
 --lms-header:#242e2a;--lms-header-ink:#f1f0e9;--lms-header-muted:#c0cbc1;--lms-header-active:#3b5145;
 --lms-success:#254f3b;--lms-success-soft:#bfd4c8;--lms-warning:#654514;--lms-warning-soft:#e3cf9f;--lms-danger:#74283e;--lms-danger-soft:#e0bbc4;
}
html,body{background:var(--lms-bg);color:var(--lms-ink)}
.portal-dashboard>.workspace,.portal .workspace{margin-left:0;min-width:0}
html body .workspace>header.portal-header{
 display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;justify-content:stretch;
 gap:26px;min-height:78px;height:auto;padding:16px clamp(20px,2.4vw,48px);border:0;border-bottom:2px solid #a58c54;
 background:var(--lms-header);color:var(--lms-header-ink);position:relative;z-index:10;box-sizing:border-box;
}

.portal-header .portal-brand{display:flex;align-items:baseline;gap:10px;min-width:0;color:var(--lms-header-ink);text-decoration:none;font:800 26px/1.2 Arial,sans-serif;letter-spacing:.03em;white-space:nowrap}
.portal-header .portal-brand span{font-size:12px;font-weight:400;letter-spacing:0;color:var(--lms-header-muted)}
.portal-header .header-links{display:flex;align-items:center;min-width:0}
.portal-header .header-nav-row{display:flex;flex-wrap:wrap;gap:5px;align-items:center;min-width:0;width:fit-content;padding:5px;border:1px solid #6b7c6a66;border-radius:15px;background:#1c2521}

.portal-header .header-links a{display:flex;align-items:center;gap:9px;min-height:42px;padding:10px 15px;border-radius:10px;background:transparent;color:#e1e8de;text-decoration:none;font:600 13px/1.4 Arial,sans-serif;white-space:nowrap;box-sizing:border-box;transition:none}
.portal-header .header-nav-icon{width:19px;height:19px;flex:none;color:#a4bca9}
.portal-header .header-links a:hover{background:#34483e;color:#fff}
.portal-header .header-links a[aria-current=page]{background:#3b5145;color:#f1f0e9;box-shadow:inset 0 -3px 0 #d9bc7c}
.portal-header .header-links a[aria-current=page] .header-nav-icon{color:#dec58c}
.portal-header .header-account{display:flex;align-items:center;justify-self:end;gap:12px;min-width:0;margin-left:0}

.portal-header .account-chip{display:flex;align-items:center;gap:9px;min-width:0;max-width:245px;padding:6px 12px 6px 6px;border:1px solid #97aa934d;border-radius:14px;background:#34453b;color:var(--lms-header-ink);text-decoration:none;font-size:12px}
.portal-header .account-details{display:grid;gap:4px;min-width:0}.portal-header .account-details strong{display:block;max-width:175px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--lms-header-ink);font-size:13px}.portal-header .account-details small{font-size:11px;color:#cad5c7}
.portal-header .account-avatar{display:grid;place-items:center;width:38px;height:38px;flex:none;border-radius:12px;background:#cbd5cf;color:#26332f;font-size:18px;font-weight:700;box-shadow:inset 0 1px 0 #d3c69c40}
.portal-header .settings-dropdown{position:relative;flex:none}
.portal-header .settings-dropdown>summary{display:grid;place-items:center;list-style:none;width:42px;height:42px;border:1px solid #97aa9355;border-radius:10px;background:#34453b;color:var(--lms-header-ink);font-size:23px;line-height:1;cursor:pointer}
.portal-header .settings-dropdown>summary::-webkit-details-marker{display:none}
.portal-header .settings-dropdown[open]>summary,.portal-header .settings-dropdown>summary:hover{background:var(--lms-header-active)}
.portal-header .settings-popover{position:absolute;right:0;top:48px;width:290px;padding:12px;border:1px solid var(--lms-border);border-radius:14px;background:var(--lms-surface-raised);color:var(--lms-ink);box-shadow:0 14px 45px #1d2a2235;z-index:30}
.portal-header .settings-popover>small{display:block;padding:8px 10px;color:var(--lms-muted);font-size:10px;letter-spacing:1px}
.portal-header .settings-popover>a{display:block;padding:11px 12px;border-radius:8px;background:transparent;color:var(--lms-ink);text-decoration:none;font-size:14px}
.portal-header .settings-popover>a:hover{background:var(--lms-surface-soft);color:var(--lms-ink)}
.portal-header .settings-popover>a>span{display:block;margin-top:5px;color:var(--lms-muted);font-size:11px}
.portal-header a:focus-visible,.portal-header summary:focus-visible,.portal-header button:focus-visible{outline:2px solid #d9bc7c;outline-offset:3px}
@media(max-width:1350px){.portal-header .header-account{gap:10px}html body .workspace>header.portal-header{gap:18px}.portal-header .header-links a{padding:10px 12px}}
@media(max-width:1050px){html body .workspace>header.portal-header{grid-template-columns:minmax(0,1fr) auto;gap:13px 20px;padding:16px 22px}.portal-header .portal-brand{grid-column:1;grid-row:1}.portal-header .header-account{grid-column:2;grid-row:1}.portal-header .header-links{grid-column:1/-1;grid-row:2}.portal-header .header-nav-row{gap:5px}}
@media(max-width:600px){html body .workspace>header.portal-header{padding:16px;gap:13px 10px}.portal-header .portal-brand{font-size:23px;gap:7px}.portal-header .portal-brand span{font-size:11px}.portal-header .account-avatar{width:33px;height:33px;font-size:16px;border-radius:10px}.portal-header .account-chip{max-width:190px;padding:5px 8px 5px 5px;gap:7px}.portal-header .account-details strong{max-width:112px;font-size:11px}.portal-header .account-details small{font-size:9px}.portal-header .header-account{gap:8px}.portal-header .header-links a{padding:9px 10px;font-size:12px;gap:7px;min-height:40px}.portal-header .header-nav-icon{width:17px;height:17px}.portal-header .settings-popover{width:min(290px,calc(100vw - 32px))}}

@media(max-width:380px){.portal-header .portal-brand span{display:none}.portal-header .account-details strong{max-width:100px}.portal-header .account-chip{max-width:150px}}

/* Explicit colors also override imported account form styles on the native shell. */
html body .workspace>header.portal-header .account-details strong{color:var(--lms-header-ink)}
html body .workspace>header.portal-header .settings-popover>form{margin:9px 0 0;padding-top:8px;border-top:1px solid var(--lms-border)}
html body .workspace>header.portal-header .settings-logout{display:flex;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:12px;border:0;border-radius:8px;background:transparent;color:#843347;font:600 13px/1.5 Arial,sans-serif;text-align:left;cursor:pointer;margin:0}
html body .workspace>header.portal-header .settings-logout:hover{background:var(--lms-danger-soft);color:#772b3e}
@media(max-width:600px){.portal-header .header-nav-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;gap:4px;padding:4px;border-radius:12px}.portal-header .header-links a{justify-content:flex-start;white-space:normal}.portal-header .settings-popover{box-sizing:border-box}.portal-header .account-details small{font-size:10px}}
@media(prefers-reduced-motion:reduce){.portal-header .header-links a{transition:none}}

/* Learning states: separate fill, outline and ink; text remains readable on grey. */
.learning-status{display:inline-flex;align-items:center;justify-content:center;max-width:100%;border:1px solid;border-radius:6px;padding:3px 7px;font:600 10px/1.4 Arial,sans-serif;white-space:nowrap;vertical-align:middle}
.learning-status.status-assigned{background:#c4d7e7;border-color:#7a9fbf;color:#244e72}
.learning-status.status-not_started{background:#c7d1dc;border-color:#7b8c9d;color:#374b5d}
.learning-status.status-in_progress{background:#e3cf9f;border-color:#aa8344;color:#654514}
.learning-status.status-completed{background:#bcd6d5;border-color:#6e9b96;color:#24514d}
.learning-status.status-credited,.learning-status.status-passed{background:#bfd4c8;border-color:#6b927a;color:#254f3b}
.learning-status.status-failed{background:#e0bbc4;border-color:#a3697b;color:#74283e}
.learning-status.status-cancelled{background:#d2c8e0;border-color:#927da8;color:#503766}
.learning-status.status-overdue{background:#e1c3b0;border-color:#a97c5d;color:#71391c}

.attempt-history .learning-status{display:inline-flex;margin-left:6px;vertical-align:middle}

/* Surface hierarchy: quiet stone canvas, raised panels and separate inset controls. */
:where(input,select,textarea):focus-visible{outline:2px solid var(--lms-blue);outline-offset:2px}
:where(a,button,summary):focus-visible{outline-offset:3px}

/* Hide scrollbar chrome throughout the LMS shell; scrolling and focus stay native. */
:root,:root *{scrollbar-width:none!important;-ms-overflow-style:none}
:root::-webkit-scrollbar,:root *::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}


/* Original supplied horizontal logo. On narrow headers show its emblem without shrinking the profile. */
.portal-header .portal-brand{align-items:center}
.portal-header .portal-logo{display:block;width:auto;height:60px;max-width:none;flex:none;object-fit:contain}
@media(max-width:1050px){.portal-header .portal-logo{height:56px}}
@media(max-width:600px){.portal-header .portal-brand{width:61px;height:44px;overflow:hidden;flex:none}.portal-header .portal-logo{width:auto;height:44px;object-fit:contain;object-position:left center}}

/* Local navigation actions use the same button treatment on React and server-rendered pages. */
html body a.action-link{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:38px;max-width:100%;box-sizing:border-box;padding:9px 13px;border:1px solid var(--lms-border);border-radius:9px;background:var(--lms-surface-raised);color:var(--lms-accent);font:600 13px/1.4 Arial,sans-serif;text-decoration:none;vertical-align:middle;white-space:normal;text-align:center}
html body a.action-link:visited{color:var(--lms-accent)}html body a.action-link:hover{background:var(--lms-accent-soft);border-color:var(--lms-accent)}html body a.action-link:focus-visible{outline:2px solid var(--lms-accent);outline-offset:3px}
.action-link svg{width:17px;height:17px;flex:none}.manager-actions>a.action-link{margin-left:auto}
@media(max-width:600px){.manager-actions>a.action-link{margin-left:0}}

/* Attempt history opens above its parent dialog without changing the module row. */
.workspace-modal.compact-modal{width:min(600px,calc(100vw - 32px))}
.attempt-history-button{display:inline-flex;align-items:center;gap:7px;font-size:12px;padding:7px 10px;min-height:36px}
.attempt-history-button .form-icon{width:16px;height:16px}
.attempt-history-title{font-size:14px;font-weight:600;line-height:1.5;margin:0 0 14px;overflow-wrap:anywhere}
.attempt-history-list{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.attempt-history-list>li{padding:13px 15px;border:1px solid var(--lms-border);border-radius:10px;background:var(--lms-surface-raised);min-width:0}
.attempt-history-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:14px}.attempt-history-heading .learning-status{font-size:11px}
.attempt-history-list p{margin:8px 0;font-size:13px;line-height:1.5}.attempt-history-list small{font-size:11px;line-height:1.6;color:var(--lms-muted)}

/* Compact evidence rows with a clear gap below the dialog heading. */
.workspace-modal.compact-modal .modal-content{padding:16px 20px 20px}
.history-context{padding:0 0 12px;margin-bottom:10px;border-bottom:1px solid var(--lms-border)}.history-context>small{display:block;font-size:9px;letter-spacing:.8px;color:var(--lms-muted);margin-bottom:5px}.history-context>p{font-size:13px;line-height:1.5;font-weight:600;margin:0;overflow-wrap:anywhere}
.attempt-history-list{gap:8px}.attempt-history-list>li{padding:10px 12px;border-radius:10px}
.attempt-history-heading{font-size:13px;gap:8px}.attempt-history-heading>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.attempt-current{font-size:10px;color:var(--lms-muted);font-weight:400}
.attempt-history-meta{display:flex;align-items:baseline;gap:5px 10px;flex-wrap:wrap;margin-top:7px;font-size:11px;line-height:1.5;color:var(--lms-muted)}.attempt-history-meta>strong{font-size:12px;color:var(--lms-ink);font-weight:600}.attempt-history-meta>time{margin-left:auto;font-size:10px}
@media(max-width:420px){.workspace-modal.compact-modal .modal-content{padding:13px 15px 16px}.attempt-history-meta>time{margin-left:0;flex-basis:100%}}

/* Focus uses the existing control shape, without an extra frame or halo. */
html body :is(input,select,textarea,button,a,summary,[tabindex],[role=button]):is(:focus,:focus-visible){outline:none!important;outline-offset:0!important}
html body :is(input,select,textarea):focus,html body :is(button,a,summary,[role=button]):focus-visible,html body .file-picker:focus-within,html body .pin-desktop-cell.active{box-shadow:none!important}
html body .file-picker:focus-within{outline:none!important}
/* Keyboard navigation retains a tonal cue instead of an outlined rectangle. */
html body :is(button,a,summary,[role=button]):focus-visible{filter:brightness(.92)}

/* Shared dropdown surfaces for native form fields, searchable choices and menus. */
html body select.lms-custom-select{appearance:none!important;padding-right:32px!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234d5551' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-size:16px 16px!important;background-repeat:no-repeat!important;background-position:right 10px center!important;cursor:pointer}
html body :is(.lms-choice-popup,.search-options){--choice-shift:6px;position:fixed;inset:auto;z-index:1000;min-width:0;margin:0;padding:5px;border:1px solid #a5b3a9;border-radius:11px;background:var(--lms-surface-raised);color:var(--lms-ink);box-shadow:0 10px 30px #21372a24;max-height:240px;overflow:auto;overscroll-behavior:contain;font:12px/1.4 Arial,sans-serif;text-align:left;animation:lms-choice-in 160ms cubic-bezier(.2,.8,.2,1);box-sizing:border-box}
html body :is(.lms-choice-popup,.search-options)[data-side=top]{--choice-shift:-6px}
html body :is(.lms-choice-popup,.search-options).is-closing{pointer-events:none;animation:lms-choice-out 160ms ease-in forwards}
html body :is(.lms-choice-popup,.search-options) [role=option]{position:relative;display:block;min-height:34px;padding:8px 30px 8px 10px;border:0;border-radius:7px;cursor:pointer;color:var(--lms-ink);background:transparent;transition:background-color 120ms ease,color 120ms ease}
html body :is(.lms-choice-popup,.search-options) [role=option] strong{display:block;font:500 12px/1.5 Arial,sans-serif;overflow-wrap:anywhere}
html body :is(.lms-choice-popup,.search-options) [role=option] small{display:block;margin-top:2px;font:10px/1.5 Arial,sans-serif;color:var(--lms-muted);overflow-wrap:anywhere}
html body :is(.lms-choice-popup,.search-options) [role=option]:is(:hover,.is-active,[aria-selected=true]){background:var(--lms-accent-soft);color:var(--lms-accent)}
html body :is(.lms-choice-popup,.search-options) [role=option][aria-disabled=true]{opacity:.45;cursor:default;background:transparent;color:var(--lms-muted)}
html body :is(.lms-choice-popup,.search-options) [role=option]>.form-icon,html body .lms-choice-check{position:absolute;right:9px;top:10px;width:15px;height:15px;margin:0;color:var(--lms-accent);font:600 14px/15px Arial,sans-serif}
html body :is(.lms-choice-popup,.search-options)>p{padding:9px 10px;margin:0;font:12px/1.5 Arial,sans-serif}
.lms-choice-group{padding:8px 10px 4px;color:var(--lms-muted);font:600 10px/1.5 Arial,sans-serif}
.settings-dropdown[open]>.settings-popover{animation:lms-choice-in 160ms cubic-bezier(.2,.8,.2,1)}
@keyframes lms-choice-in{from{opacity:0;transform:translateY(var(--choice-shift,6px)) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes lms-choice-out{from{opacity:1;transform:translateY(0) scale(1)}to{opacity:0;transform:translateY(var(--choice-shift,6px)) scale(.985)}}
@media(prefers-reduced-motion:reduce){html body :is(.lms-choice-popup,.search-options,.settings-popover),html body :is(.lms-choice-popup,.search-options) [role=option]{animation:none!important;transition:none!important}.lms-choice-popup.is-closing,.search-options.is-closing{opacity:0}}
html body .time-limit-field{min-width:0}.time-limit-field>label{display:block;font-size:13px;line-height:1.5}
html body .time-limit-controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(92px,.85fr);gap:8px;margin:6px 0 10px}
html body .time-limit-controls>input,html body .time-limit-controls>select{width:100%;min-width:0;max-width:none;margin:0!important;font-size:13px}

@keyframes lms-window-open {
  from { opacity: 0; translate: 0 8px; }
  to { opacity: 1; translate: 0 0; }
}
@keyframes lms-window-fade {
  from { opacity: 0; }
  to { opacity: 1; }
}
@media (prefers-reduced-motion: no-preference) {
  dialog[open] { animation: lms-window-open 190ms cubic-bezier(.2,.8,.2,1); }
  dialog[open]::backdrop, .player-backdrop { animation: lms-window-fade 190ms ease-out; }
}

.portal-settings-icon{display:block;width:22px;height:22px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2222%22%20height%3D%2222%22%20fill%3D%22none%22%20stroke%3D%22black%22%20strokeWidth%3D%221.6%22%20aria-hidden%3D%22true%22%3E%3Cpath%20d%3D%22m9%203-.6%202.3-2%20.9-2.2-.6-2%203.5%201.6%201.7v2.4l-1.6%201.7%202%203.5%202.2-.6%202%20.9L9%2021h4l.6-2.3%202-.9%202.2.6%202-3.5-1.6-1.7v-2.4l1.6-1.7-2-3.5-2.2.6-2-.9L13%203Z%22%2F%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2212%22%20r%3D%223%22%2F%3E%3C%2Fsvg%3E") center/contain no-repeat}