.ds-breadcrumb { font-size: .85rem; opacity: .75; margin-bottom: 14px; }
        .ds-breadcrumb a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
        .ds-breadcrumb span[aria-hidden] { margin: 0 6px; }
        .ds-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; margin-top: 28px; }
        .ds-btn-outline { display: inline-flex; align-items: center; gap: 8px; padding: 12px 22px; border-radius: 999px; border: 1px solid rgba(128,128,128,.45); color: inherit; font-weight: 600; text-decoration: none; }
        .ds-btn-outline:hover { background: rgba(128,128,128,.1); }

        .ds-section { padding: 88px 0; }
        .ds-first { padding-top: 72px; }
        .ds-split { display: grid; grid-template-columns: 1fr 1.2fr; gap: 56px; align-items: start; }
        .ds-split.ds-reverse { grid-template-columns: 1.2fr 1fr; }
        .ds-split.ds-reverse .ds-copy { order: 2; }
        .ds-copy p { line-height: 1.7; opacity: .85; }
        .ds-copy .section-header { text-align: left; margin-bottom: 18px; }
        .ds-lead { text-align: center; max-width: 700px; margin: 0 auto 36px; line-height: 1.7; opacity: .85; }
        .ds-note { font-size: .78rem; opacity: .6; margin-top: 10px; }
        .ds-note-center { text-align: center; max-width: 640px; margin-left: auto; margin-right: auto; }
        .ds-related { text-align: center; margin-top: 36px; font-size: .95rem; line-height: 1.7; }
        .ds-related a, .features-card a { color: inherit; font-weight: 600; text-underline-offset: 3px; }
        .ds-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
        .ds-list { list-style: none; padding: 0; margin: 22px 0 0; display: grid; gap: 12px; }
        .ds-list li { display: flex; gap: 12px; align-items: flex-start; line-height: 1.5; }
        .ds-tick { flex: none; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; margin-top: 1px; background: rgba(22,163,74,.15); color: #16a34a; }
        .ds-tick svg { width: 13px; height: 13px; }

        /* Window chrome */
        .ds-window { position: relative; border: 1px solid rgba(128,128,128,.28); border-radius: 18px; overflow: hidden; background: rgba(128,128,128,.06); box-shadow: 0 24px 56px -28px rgba(0,0,0,.4); min-width: 0; }
        .ds-window [hidden] { display: none !important; }
        .ds-window-bar { display: flex; align-items: center; gap: 7px; padding: 12px 16px; border-bottom: 1px solid rgba(128,128,128,.22); font-size: .82rem; }
        .ds-dot { width: 10px; height: 10px; border-radius: 50%; background: rgba(128,128,128,.4); }
        .ds-window-title { margin-left: 8px; font-weight: 700; }

        /* Learner record header */
        .ds-record { display: flex; gap: 14px; align-items: center; padding: 16px 20px 12px; }
        .ds-avatar { flex: none; width: 56px; height: 56px; border-radius: 12px; display: grid; place-items: center; font-weight: 800; background: rgba(37,99,235,.14); color: #2563eb; border: 1px solid rgba(37,99,235,.35); }
        .ds-rec-name { font-weight: 800; font-size: 1.05rem; display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; }
        .ds-pill { font-size: .66rem; font-weight: 600; border-radius: 5px; padding: 2px 8px; background: rgba(128,128,128,.18); }
        .ds-pill-ok { background: rgba(22,163,74,.16); color: #16a34a; }
        .ds-rec-prog { font-size: .78rem; opacity: .65; margin-top: 3px; }
        .ds-tabs { list-style: none; margin: 0; padding: 0 20px; display: flex; gap: 22px; overflow-x: auto; border-bottom: 1px solid rgba(128,128,128,.22); font-size: .76rem; font-weight: 600; }
        .ds-tab { padding: 10px 0; white-space: nowrap; opacity: .6; border-bottom: 2px solid transparent; }
        .ds-tab.is-on { opacity: 1; color: #0d9488; border-bottom-color: #0d9488; }

        /* Store */
        .ds-store-tools { display: flex; gap: 12px; align-items: center; justify-content: space-between; padding: 14px 16px; border-bottom: 1px solid rgba(128,128,128,.18); }
        .ds-search { position: relative; flex: 1 1 auto; max-width: 420px; min-width: 0; }
        .ds-search span { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; opacity: .55; pointer-events: none; }
        .ds-search svg { width: 16px; height: 16px; }
        .ds-search input { box-sizing: border-box; width: 100%; font: inherit; font-size: .84rem; color: inherit; background: rgba(128,128,128,.06); border: 1px solid rgba(128,128,128,.35); border-radius: 8px; padding: 9px 12px 9px 34px; min-width: 0; }
        .ds-search input:focus-visible, .ds-folder:focus-visible, .ds-src:focus-visible { outline: 2px solid #2563eb; outline-offset: 2px; }
        .ds-upload { display: inline-flex; align-items: center; gap: 7px; font-size: .78rem; font-weight: 600; border: 1px solid rgba(128,128,128,.35); border-radius: 8px; padding: 8px 12px; flex: none; }
        .ds-upload svg { width: 15px; height: 15px; }
        .ds-store-main { display: grid; grid-template-columns: 210px minmax(0, 1fr); }
        .ds-folders { border-right: 1px solid rgba(128,128,128,.18); padding: 14px 12px; }
        .ds-folders-h { margin: 0 6px 10px; font-size: .78rem; font-weight: 700; }
        .ds-folders ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
        .ds-folder { width: 100%; display: flex; align-items: center; gap: 9px; font: inherit; font-size: .78rem; font-weight: 500; color: inherit; background: none; border: 0; border-radius: 8px; padding: 8px 8px; cursor: pointer; text-align: left; }
        .ds-folder:hover { background: rgba(128,128,128,.1); }
        .ds-folder[aria-pressed="true"] { background: rgba(37,99,235,.12); color: #2563eb; font-weight: 700; }
        .ds-folder-ico svg { width: 16px; height: 16px; display: block; }
        .ds-folder-name { flex: 1; }
        .ds-folder-n { font-size: .68rem; font-weight: 600; border-radius: 999px; padding: 1px 8px; background: rgba(128,128,128,.18); color: inherit; }
        .ds-listwrap { min-width: 0; padding: 12px; }
        .ds-row { display: grid; grid-template-columns: minmax(0, 1fr) 100px 100px 64px; gap: 12px; align-items: center; padding: 0 14px; min-height: 52px; border-bottom: 1px solid rgba(128,128,128,.14); }
        .ds-row-head { min-height: 38px; font-size: .72rem; font-weight: 700; opacity: .75; border-bottom: 1px solid rgba(128,128,128,.22); }
        .ds-table > [role="rowgroup"] > .ds-row:hover { background: rgba(128,128,128,.07); }
        .ds-cell { min-width: 0; padding: 7px 0; }
        .ds-c-name { display: flex; gap: 12px; align-items: center; }
        .ds-fn { min-width: 0; }
        .ds-fn-name { font-size: .8rem; font-weight: 700; overflow-wrap: anywhere; }
        .ds-fn-meta { display: flex; flex-wrap: wrap; gap: 4px 8px; align-items: center; font-size: .7rem; opacity: .75; margin-top: 2px; }
        .ds-meta-m { display: none; }
        .ds-c-size, .ds-c-date { font-size: .74rem; opacity: .75; }
        .ds-c-act { display: flex; gap: 14px; justify-content: flex-end; opacity: .6; }
        .ds-c-act svg { width: 16px; height: 16px; }
        .ds-tag { display: inline-block; font-size: .64rem; font-weight: 600; border-radius: 5px; padding: 1px 7px; background: rgba(128,128,128,.2); }
        .ds-tag-on { background: rgba(37,99,235,.16); color: #2563eb; }
        .ds-empty { padding: 28px 16px; text-align: center; opacity: .7; font-size: .88rem; margin: 0; }
        .ds-foot { padding: 12px 14px 4px; font-size: .76rem; opacity: .7; }

        /* File type badges */
        .ds-file { flex: none; position: relative; width: 28px; height: 34px; border: 1.5px solid rgba(128,128,128,.45); border-radius: 4px 9px 4px 4px; display: inline-block; }
        .ds-file span { position: absolute; left: -4px; right: -4px; bottom: 4px; font-size: .5rem; font-weight: 800; letter-spacing: .02em; text-align: center; color: #fff; border-radius: 3px; padding: 1px 0; background: var(--ds-f, #4f46e5); line-height: 1.3; }
        .ds-f-jpg, .ds-f-png { --ds-f: #4f46e5; } .ds-f-xlsx { --ds-f: #16a34a; } .ds-f-zip { --ds-f: #7c3aed; } .ds-f-pdf { --ds-f: #dc2626; }

        /* Tagging explainer */
        .ds-flow-body { padding: 18px; display: grid; gap: 18px; }
        .ds-srcs { display: flex; flex-wrap: wrap; gap: 8px; }
        .ds-src { font: inherit; font-size: .8rem; font-weight: 600; color: inherit; background: transparent; border: 1px solid rgba(128,128,128,.4); border-radius: 999px; padding: 7px 14px; cursor: pointer; }
        .ds-src:hover { background: rgba(128,128,128,.12); }
        .ds-src[aria-pressed="true"] { background: #1e3a5f; border-color: #1e3a5f; color: #fff; }
        .ds-flow-steps { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
        .ds-flow-steps > li:not(.ds-flow-arrow) { display: flex; gap: 14px; align-items: flex-start; border: 1px solid rgba(128,128,128,.28); border-radius: 14px; padding: 16px; background: rgba(128,128,128,.05); }
        .ds-flow-n { flex: none; width: 24px; height: 24px; border-radius: 50%; background: #2563eb; color: #fff; font-size: .78rem; font-weight: 700; display: grid; place-items: center; }
        .ds-flow-h { font-size: .84rem; font-weight: 700; margin-bottom: 10px; }
        .ds-flow-file, .ds-flow-result { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: center; font-size: .82rem; font-weight: 600; }
        .ds-flow-result [data-ds-ftype] { display: inline-flex; }
        .ds-flow-arrow { display: grid; place-items: center; opacity: .5; }
        .ds-flow-arrow svg { width: 22px; height: 22px; transform: rotate(90deg); }
        .ds-flow-note { margin: 0; font-size: .88rem; line-height: 1.55; }

        .ds-steps { margin-top: 44px; }
        .ds-step-card { flex-direction: column; gap: 16px; }
        .ds-step-card .features-card-icon { color: #fff; font-weight: 800; font-size: 1.05rem; line-height: 1; }
        @media (min-width: 769px) { .ds-steps.features-grid { grid-template-columns: repeat(3, 1fr); } }

        @media (max-width: 900px) {
            .ds-section { padding: 64px 0; }
            .ds-split, .ds-split.ds-reverse { grid-template-columns: 1fr; gap: 32px; }
            .ds-split.ds-reverse .ds-copy { order: 0; }
        }
        @media (max-width: 720px) {
            .ds-store-main { grid-template-columns: 1fr; }
            .ds-folders { border-right: 0; border-bottom: 1px solid rgba(128,128,128,.18); padding: 12px; }
            .ds-folders ul { display: flex; flex-wrap: wrap; gap: 8px; }
            .ds-folder { width: auto; border: 1px solid rgba(128,128,128,.35); border-radius: 999px; padding: 6px 12px; }
            .ds-folder-ico { display: none; }
            .ds-row { grid-template-columns: minmax(0, 1fr); padding: 0 6px; }
            .ds-row-head, .ds-c-size, .ds-c-date, .ds-c-act { display: none; }
            .ds-meta-m { display: inline; }
            .ds-record { padding: 14px; }
            .ds-tabs { padding: 0 14px; }
            .ds-store-tools { padding: 12px; }
        }