.shell[data-app="uptrack"] { --accent:#285b45; --deep:#202329; --soft:#f4f6f4; }
.shell[data-app="uptrack"] .main { min-width:0; background:#f5f7f5; color:#202329; }
.shell[data-app="uptrack"] .topbar { background:#fff; color:#202329; border-color:#dce3dd; }
.shell[data-app="uptrack"] .content { padding:28px clamp(16px,3vw,42px) 100px; }
.ut-app,.ut-dialog { color:#202329; font:14px/1.6 Lexend,Arial,sans-serif; --ut-line:#dce3dd; --ut-muted:#536157; }
.ut-app *,.ut-dialog * { box-sizing:border-box; }
.ut-app :is(h2,h3,p),.ut-dialog :is(h2,h3,p) { margin:0; }
.ut-header { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:24px; }
.ut-eyebrow { color:#285b45; font-size:11px; font-weight:700; letter-spacing:1.3px; text-transform:uppercase; }
.ut-header h2 { font-size:clamp(26px,3vw,36px); line-height:1.25; margin:8px 0; letter-spacing:-.5px; }
.ut-header p:not(.ut-eyebrow) { color:var(--ut-muted); }
.ut-button,.ut-tab { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 16px; border:1px solid #becbbf; border-radius:12px; background:#fff; color:#263b2e; font:600 13px/1.4 Lexend,Arial,sans-serif; cursor:pointer; text-decoration:none; }
.ut-button:hover,.ut-tab:hover { background:#eff4ef; border-color:#789680; }
.ut-button.ut-primary,.ut-tab.is-active { background:#285b45; border-color:#285b45; color:#fff; }
.ut-button:disabled { opacity:.5; cursor:default; }
.ut-app :is(input,button,select,textarea,a):focus-visible,.ut-dialog :is(input,button,select,textarea,a,summary):focus-visible { outline:3px solid #77a587; outline-offset:3px; }
.ut-tabs { display:flex; gap:9px; overflow-x:auto; padding:2px 2px 13px; margin-bottom:20px; scrollbar-width:thin; }
.ut-tab { flex-shrink:0; white-space:nowrap; border-radius:30px; }
.ut-toolbar { display:flex; justify-content:space-between; align-items:end; flex-wrap:wrap; gap:18px; margin-bottom:22px; }
.ut-toolbar>.ut-field { flex:1; max-width:500px; }
.ut-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(min(100%,285px),1fr)); gap:18px; }
.ut-card { padding:24px; border:1px solid var(--ut-line); border-radius:18px; background:#fff; min-width:0; display:flex; flex-direction:column; gap:14px; }
.ut-card h3 { font-size:20px; line-height:1.4; overflow-wrap:anywhere; }
.ut-card p { color:var(--ut-muted); white-space:pre-wrap; overflow-wrap:anywhere; }
.ut-card-top { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; color:var(--ut-muted); font-size:12px; }
.ut-actions { display:flex; flex-wrap:wrap; gap:9px; align-items:center; }
.ut-card>.ut-actions { margin-top:auto; padding-top:10px; }
.ut-state { display:inline-flex; align-items:center; padding:5px 10px; border-radius:18px; color:#4b5950; background:#edf0ed; font-size:12px; font-weight:600; }
.ut-state:is(.is-approved,.is-certified,.is-published) { color:#23513a; background:#e6f2e9; }
.ut-state:is(.is-review,.is-in_progress,.is-ready_for_review) { color:#735213; background:#fff1ce; }
.ut-state:is(.is-rejected,.is-revoked,.is-expired,.is-blocked) { color:#963239; background:#fbe9e9; }
.ut-app progress { width:100%; height:11px; accent-color:#285b45; }
.ut-list { display:grid; gap:10px; }
.ut-row { display:flex; align-items:center; justify-content:space-between; gap:18px; min-width:0; padding:16px 18px; border:1px solid var(--ut-line); border-radius:13px; background:#fff; }
.ut-row>div { min-width:0; }.ut-row strong,.ut-row p { overflow-wrap:anywhere; }.ut-row p,.ut-row small { color:var(--ut-muted); }
.ut-empty { padding:44px 24px; border:1px dashed #bccbbf; border-radius:18px; background:#fff; text-align:center; display:grid; gap:12px; }
.ut-empty strong { font-size:20px; }.ut-empty p { color:var(--ut-muted); max-width:640px; margin:auto; }
.ut-dialog { width:min(640px,calc(100vw - 36px)); max-height:calc(100dvh - 48px); border:1px solid var(--ut-line); border-radius:20px; padding:0; background:#fff; box-shadow:0 25px 90px #16372335; overflow:auto; }
.ut-dialog.ut-wide { width:min(900px,calc(100vw - 36px)); }
.ut-dialog::backdrop { background:#15251cc0; backdrop-filter:blur(3px); }
.ut-dialog-head { position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:15px; padding:18px 24px; background:#fff; border-bottom:1px solid var(--ut-line); }
.ut-dialog-head h2 { min-width:0; overflow-wrap:anywhere; font-size:21px; line-height:1.4; }
.ut-dialog-head .ut-button { flex-shrink:0; }
.ut-dialog-body { display:grid; gap:20px; padding:24px; }
.ut-dialog-body>h3 { margin-top:8px; font-size:18px; }
.ut-dialog form { display:grid; gap:18px; }
.ut-field { display:grid; gap:7px; font-size:13px; font-weight:600; min-width:0; }
.ut-field :is(input,textarea,select),.ut-option-edit>input,.ut-exam-question>textarea { width:100%; min-width:0; min-height:46px; padding:11px 12px; border:1px solid #bfcac1; border-radius:10px; background:#fff; color:#202329; font:14px/1.5 Lexend,Arial,sans-serif; }
.ut-field textarea,.ut-exam-question>textarea { resize:vertical; }
.ut-field small { color:var(--ut-muted); font-weight:400; }
.ut-form-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.ut-check,.ut-answer { display:flex; align-items:flex-start; gap:10px; min-height:44px; padding:9px 0; font-size:14px; }
.ut-check input,.ut-answer input { width:20px; height:20px; flex-shrink:0; margin:1px 0; accent-color:#285b45; }
.ut-form-actions { justify-content:flex-end; border-top:1px solid var(--ut-line); padding-top:17px; }
.ut-note { background:#f0f5f0; border-radius:12px; padding:14px 16px; color:#475d4e; font-size:13px; overflow-wrap:anywhere; }
[data-ut-error]:empty { display:none; }
[data-ut-error]:not(:empty),.ut-error { border:1px solid #e4b7b7; border-radius:10px; padding:12px 14px; background:#fff0f0; color:#862b2b; font-size:13px; overflow-wrap:anywhere; }
.ut-question-editor { min-width:0; display:grid; gap:16px; padding:18px; border:1px solid #c5d3c8; border-radius:14px; margin:16px 0; }
.ut-question-editor legend { padding:0 6px; font-weight:600; }
.ut-option-edit { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:9px; align-items:center; margin:10px 0; }
.ut-exam-question { min-width:0; border:1px solid var(--ut-line); border-radius:13px; padding:20px; }
.ut-exam-question legend { font-size:16px; font-weight:600; padding:0 7px; }
.ut-exam-question>p { color:var(--ut-muted); font-size:12px; margin-bottom:14px; }
.ut-answer { border:1px solid #d7e2d9; border-radius:11px; padding:13px; margin:9px 0; }
.ut-answer:has(input:checked) { background:#edf6ef; border-color:#64866e; }
.ut-learning-text { white-space:pre-wrap; overflow-wrap:anywhere; font-size:16px; line-height:1.85; }
.ut-video { display:block; width:100%; max-height:55dvh; border-radius:12px; background:#202329; }
.ut-score { font-size:52px; font-weight:700; color:#285b45; }
.ut-proof { padding:28px; border:2px solid #d4e0d6; border-radius:16px; display:grid; gap:15px; }
.ut-proof h2 { font-size:30px; }.ut-proof h3 { font-size:23px; }.ut-proof-status { font-weight:600; color:#285b45; }
.ut-proof dl { display:grid; grid-template-columns:140px minmax(0,1fr); gap:12px; margin:6px 0; }.ut-proof dt { font-weight:600; }.ut-proof dd { margin:0; overflow-wrap:anywhere; }
.ut-proof-hash { font:11px/1.7 ui-monospace,monospace; overflow-wrap:anywhere; color:#56665a; }
.ut-history { display:grid; gap:14px; padding-left:22px; }.ut-dialog details>summary { cursor:pointer; padding:12px 0; font-weight:600; }
.ut-dialog [hidden] { display:none!important; }
@media(max-width:700px) {
  .ut-header { align-items:flex-start; flex-direction:column; }.ut-toolbar { align-items:stretch; }.ut-toolbar>.ut-field { max-width:none; flex-basis:100%; }
  .ut-row { flex-direction:column; align-items:stretch; gap:12px; }.ut-row .ut-actions { justify-content:flex-start; }
  .ut-dialog,.ut-dialog.ut-wide { width:100%; max-width:100%; max-height:92dvh; margin:auto 0 0; border-radius:20px 20px 0 0; border:0; }
  .ut-dialog-head { padding:16px; }.ut-dialog-head h2 { font-size:18px; }.ut-dialog-head .ut-button { padding:9px 12px; }
  .ut-dialog-body { padding:20px 16px max(24px,env(safe-area-inset-bottom)); }.ut-form-grid { grid-template-columns:minmax(0,1fr); }
  .ut-field :is(input,textarea,select),.ut-option-edit>input,.ut-exam-question>textarea { font-size:16px; }.ut-option-edit { grid-template-columns:1fr auto; }.ut-option-edit>input { grid-column:1/-1; }
  .ut-proof { padding:18px; }.ut-proof dl { grid-template-columns:minmax(0,1fr); gap:5px; }.ut-proof dd { margin-bottom:9px; }
  .ut-form-actions>.ut-button { flex:1; }.ut-exam-question { padding:14px; }
  .shell[data-app="uptrack"] .content { padding:22px 14px 150px!important; }
}
@media(prefers-reduced-motion:reduce) { .ut-app *,.ut-dialog * { scroll-behavior:auto!important; transition:none!important; } }
