/* System detail v2 — compact identity + unchanged media center */
.sd-shell{width:min(1180px,calc(100% - 36px));margin-inline:auto}
.sd-systembar{padding:17px 0;background:linear-gradient(135deg,color-mix(in srgb,var(--system-accent) 5%,var(--card)),var(--card) 58%,color-mix(in srgb,var(--system-accent) 3%,var(--page)));border-bottom:1px solid var(--border)}
.sd-systembar-grid{min-height:104px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:24px}
.sd-system-info{display:flex;align-items:center;gap:14px;min-width:0}.sd-system-logo{width:64px;height:64px;flex:0 0 64px;border-radius:16px;overflow:hidden;background:var(--card);border:1px solid var(--border);box-shadow:0 8px 22px #1018280d;display:grid;place-items:center}.sd-system-logo img{width:100%;height:100%;object-fit:cover}.sd-system-logo span{font-size:27px;font-weight:900;color:#fff;background:var(--system-accent);width:100%;height:100%;display:grid;place-items:center}.sd-system-copy{min-width:0}.sd-meta-row{display:flex;align-items:center;gap:7px}.sd-badge,.sd-meta-label,.sd-kind{display:inline-flex;align-items:center;border-radius:999px;font-weight:800}.sd-badge{padding:4px 8px;background:color-mix(in srgb,var(--system-accent) 9%,#fff);color:var(--system-accent);font-size:9px}.sd-meta-label{font-size:9px;color:var(--muted)}.sd-system-copy h1{font-size:28px;line-height:1.1;margin:5px 0}.sd-system-copy p{max-width:720px;margin:0;color:var(--muted);font-size:10.5px;line-height:1.65}.sd-system-actions{display:flex;gap:8px;flex:none}.sd-btn{min-height:38px;padding:0 14px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;font-size:10.5px;font-weight:900;border:1px solid var(--border);white-space:nowrap}.sd-btn-primary{background:var(--system-accent);border-color:var(--system-accent);color:#fff;box-shadow:0 8px 20px color-mix(in srgb,var(--system-accent) 18%,transparent)}.sd-btn-light{background:var(--card);color:var(--ink)}
.sd-workspace{padding:22px 0 48px;background:var(--page);min-height:0}.sd-section-head{display:block;margin-bottom:13px}.sd-section-head>div>span{font-size:9px;font-weight:900;color:var(--system-accent)}.sd-title-line{display:flex;align-items:center;gap:9px;margin:2px 0}.sd-section-head h2{font-size:24px;line-height:1.15;margin:0}.sd-title-line>strong{padding:4px 8px;border:1px solid var(--border);border-radius:999px;background:var(--card);font-size:9px;color:var(--muted);white-space:nowrap}.sd-section-head p{margin:0;color:var(--muted);font-size:9.5px;line-height:1.6}
.sd-media-center{direction:ltr;display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"viewer library";gap:16px;align-items:start}
.sd-viewer{grid-area:viewer;direction:rtl;min-width:0}.sd-library{grid-area:library;direction:rtl;background:var(--card);border:1px solid var(--border);border-radius:17px;overflow:hidden;box-shadow:0 8px 24px #1018280a;position:sticky;top:84px}
.sd-view-panel{background:var(--card);border:1px solid var(--border);border-radius:17px;padding:14px;box-shadow:0 8px 25px #1018280a}.sd-view-panel[hidden]{display:none!important}
.sd-view-head{min-height:59px;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:1px 2px 11px}.sd-kind{padding:4px 8px;background:color-mix(in srgb,var(--system-accent) 8%,#fff);color:var(--system-accent);font-size:9px}
.sd-view-head h3{font-size:18px;margin:5px 0 2px}.sd-view-head p{margin:0;color:var(--muted);font-size:10px;line-height:1.6}.sd-view-head>a{font-size:10px;font-weight:800;color:var(--system-accent);white-space:nowrap;margin-top:4px}
.sd-stage{width:100%;height:min(56vh,535px);min-height:380px;border-radius:12px;overflow:hidden;background:#0b0f17;display:grid;place-items:center}.sd-video{display:block;width:100%;height:100%;background:#000;object-fit:contain}.sd-image{display:block;width:100%;height:100%;object-fit:contain;background:#111}
.sd-stage-pdf{background:linear-gradient(145deg,#101828,#1d2939)}.sd-pdf-card{direction:rtl;display:flex;align-items:center;gap:20px;color:#fff;padding:30px}.sd-file-icon{width:74px;height:88px;border-radius:11px;background:#fff;color:#b42318;display:grid;place-items:center;font-size:18px;font-weight:900;box-shadow:0 10px 25px #0003}.sd-pdf-card h4{font-size:20px;margin:0 0 5px}.sd-pdf-card p{color:#cbd5e1;margin:0 0 14px;font-size:12px}.sd-pdf-card a{display:inline-flex;padding:9px 14px;border-radius:9px;background:var(--system-accent);color:#fff;font-size:11px;font-weight:900}
.sd-text{align-self:stretch;width:100%;direction:rtl;background:var(--card);color:var(--ink);padding:27px;overflow:auto;line-height:2;text-align:right}.sd-empty-stage{color:#fff;padding:30px;text-align:center}
.sd-notes{margin-top:11px;padding:13px 15px;border-radius:11px;background:color-mix(in srgb,var(--system-accent) 3%,var(--card));border:1px solid var(--border);font-size:11px;line-height:1.8}.sd-notes strong{display:block;margin-bottom:3px}

.sd-library-head{display:flex;align-items:center;justify-content:space-between;padding:14px 15px 11px;border-bottom:1px solid var(--border)}.sd-library-head strong{display:block;font-size:13px}.sd-library-head small{display:block;color:var(--muted);font-size:9px;margin-top:2px}.sd-library-head>span{min-width:27px;height:27px;border-radius:8px;background:color-mix(in srgb,var(--system-accent) 8%,#fff);color:var(--system-accent);display:grid;place-items:center;font-size:10px;font-weight:900}
.sd-search{padding:10px 10px 5px}.sd-search input{width:100%;height:36px;border:1px solid var(--border);border-radius:9px;padding:0 11px;background:var(--page);font:inherit;font-size:10px;color:var(--ink);outline:none}.sd-search input:focus{border-color:color-mix(in srgb,var(--system-accent) 45%,#fff);box-shadow:0 0 0 3px color-mix(in srgb,var(--system-accent) 7%,transparent)}
.sd-filters{display:flex;gap:5px;padding:5px 10px 9px;overflow-x:auto}.sd-filters button{border:1px solid var(--border);background:var(--card);color:var(--muted);border-radius:999px;padding:5px 9px;font:inherit;font-size:9px;font-weight:800;white-space:nowrap;cursor:pointer}.sd-filters button.is-active{background:var(--system-accent);border-color:var(--system-accent);color:#fff}
.sd-library-items{max-height:min(58vh,555px);overflow:auto;padding:5px 7px 8px;border-top:1px solid var(--border)}.sd-play-item{width:100%;border:0;background:transparent;border-radius:11px;padding:7px;display:grid;grid-template-columns:56px minmax(0,1fr) 14px;gap:8px;align-items:center;text-align:right;cursor:pointer;color:var(--ink);font-family:inherit;transition:.16s}.sd-play-item[hidden]{display:none!important}
.sd-play-item:hover{background:color-mix(in srgb,var(--system-accent) 4%,var(--page))}.sd-play-item.is-active{background:color-mix(in srgb,var(--system-accent) 8%,#fff);box-shadow:inset -3px 0 0 var(--system-accent)}
.sd-thumb{width:56px;height:45px;border-radius:8px;overflow:hidden;background:color-mix(in srgb,var(--system-accent) 8%,#eef2f7);display:grid;place-items:center}.sd-thumb img{width:100%;height:100%;object-fit:cover}.sd-thumb b{font-size:10px;color:var(--system-accent)}
.sd-play-copy{min-width:0}.sd-play-copy small{display:block;color:var(--system-accent);font-size:8px;font-weight:900}.sd-play-copy strong{display:block;font-size:11px;line-height:1.45;margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sd-play-copy em{display:block;font-style:normal;font-size:8px;color:var(--muted);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sd-play-item>i{font-style:normal;color:#98a2b3;font-size:17px}.sd-library-empty{padding:28px 12px;text-align:center;color:var(--muted);font-size:10px}
.sd-no-tutorials{padding:30px;text-align:center;border:1px dashed #cbd5e1;border-radius:15px;background:var(--card);color:var(--muted)}

@media(max-width:900px){
  .sd-systembar-grid{align-items:flex-start}.sd-system-info{align-items:flex-start}.sd-system-actions{flex-direction:column}
  .sd-media-center{grid-template-columns:1fr;grid-template-areas:"library" "viewer"}.sd-library{position:static}.sd-library-items{display:flex;overflow-x:auto;max-height:none;border-top:1px solid var(--border)}.sd-play-item{min-width:245px}.sd-stage{height:auto;min-height:350px}.sd-video{aspect-ratio:16/9;height:auto}
}
@media(max-width:620px){
  .sd-shell{width:min(100% - 22px,1180px)}.sd-systembar{padding:17px 0}.sd-systembar-grid{display:block}.sd-system-logo{width:62px;height:62px;flex-basis:62px;border-radius:14px}.sd-system-copy h1{font-size:25px}.sd-system-copy p{font-size:10px}.sd-system-actions{margin-top:14px;display:flex;flex-direction:row}.sd-system-actions .sd-btn{flex:1}
  .sd-workspace{padding:27px 0 45px}.sd-section-head{display:block}.sd-section-head h2{font-size:23px}.sd-section-head>strong{display:none}.sd-view-panel{padding:9px;border-radius:14px}.sd-view-head{display:block;padding:4px 4px 10px}.sd-view-head>a{display:inline-block;margin-top:7px}.sd-stage{min-height:220px;border-radius:10px}.sd-pdf-card{display:block;text-align:center;padding:24px}.sd-file-icon{margin:0 auto 13px}.sd-library{border-radius:14px}.sd-play-item{min-width:220px}.sd-text{padding:19px}
}

/* compact header responsive overrides */
@media(max-width:900px){.sd-systembar-grid{grid-template-columns:1fr auto;align-items:center}.sd-system-info{align-items:center}.sd-system-actions{flex-direction:column}.sd-workspace{padding-top:18px}}
@media(max-width:620px){.sd-shell{width:min(100% - 22px,1180px)}.sd-systembar{padding:13px 0}.sd-systembar-grid{display:block;min-height:0}.sd-system-logo{width:56px;height:56px;flex-basis:56px;border-radius:13px}.sd-system-copy h1{font-size:23px}.sd-system-copy p{font-size:9.5px}.sd-system-actions{margin-top:11px;display:flex;flex-direction:row}.sd-system-actions .sd-btn{flex:1}.sd-workspace{padding:18px 0 38px}.sd-title-line{flex-wrap:wrap}.sd-section-head h2{font-size:21px}}