/* Modern Diagnostic Lab: presentation only, loaded after each tool's styles. */
:root { --v2-shadow:0 12px 32px rgba(32,43,82,.07); --v2-radius:20px; }
body { font-size:17px; line-height:1.7; color:var(--color-text); }
h1,h2,h3 { font-weight:750; letter-spacing:-.025em; }
.ui-icon { width:24px; height:24px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.site-header { background:#fff; border-bottom:1px solid var(--color-border); }
.site-brand__mark { background:var(--color-primary); color:white; border-radius:10px; width:36px; height:36px; }
.site-nav a { min-height:44px; display:inline-flex; align-items:center; color:var(--color-description); }
.eyebrow { color:var(--color-primary-dark); font-size:13px; font-weight:750; letter-spacing:.10em; }
.button,button,input,select,textarea { font:inherit; }
.button { min-height:46px; border-radius:10px; padding:10px 16px; }
.button--secondary { background:white; border:1px solid var(--color-border); color:var(--color-primary-dark); }
:where(a,button,input,select,textarea,summary):focus-visible { outline:3px solid var(--color-primary); outline-offset:3px; }
[hidden] { display:none!important; }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important; }
.card-icon,.step-icon { display:inline-flex; align-items:center; justify-content:center; width:48px; height:48px; border-radius:13px; background:var(--color-primary-light); color:var(--color-primary); }
[data-tone=violet] { --tone:var(--color-violet); --tone-soft:var(--color-violet-soft); }
[data-tone=orange] { --tone:var(--color-orange); --tone-soft:var(--color-orange-soft); }
[data-tone=sky] { --tone:var(--color-sky); --tone-soft:var(--color-sky-soft); }
[data-tone=blue] { --tone:var(--color-primary); --tone-soft:var(--color-primary-light); }
[data-tone] .card-icon { color:var(--tone); background:var(--tone-soft); }
.format-badge { display:inline-flex; width:fit-content; font-size:13px!important; font-weight:750; letter-spacing:.035em; color:var(--color-primary-dark); line-height:1.5; }
.specialist-home .section { padding-block:64px; }
.specialist-home h2 { font-size:30px; line-height:1.45; }
.specialist-home .section-heading { gap:24px; margin-bottom:26px; }
.specialist-home .section-heading > p { font-size:16px; max-width:28ch; color:var(--color-description); }
.home-hero { max-width:none; padding:64px 0 30px; background:radial-gradient(ellipse at 80% 25%,#e5e9fc 0,transparent 52%),radial-gradient(ellipse at 3% 40%,#f3effe 0,transparent 48%),#f6f7fb; }
.hero-layout { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:36px 44px; align-items:center; }
.hero-copy { min-width:0; }
.home-hero h1 { max-width:620px; margin:14px 0 20px; font-size:clamp(44px,4.3vw,56px); line-height:1.25; letter-spacing:-.045em; }
.hero-lead { color:var(--color-description); max-width:38ch; font-size:17px; margin:0 0 24px; }
.search-label { font-size:14px; font-weight:650; color:var(--color-description); margin:0 0 8px; }
.hero-search { display:flex; align-items:center; min-height:60px; border:1.5px solid #aab8de; border-radius:14px; background:white; box-shadow:0 5px 16px rgba(61,95,199,.08); padding:0 18px; gap:12px; }
.hero-search .ui-icon { color:var(--color-primary); }
.hero-search input { min-width:0; width:100%; border:0; border-radius:0; background:transparent; padding:16px 0; font-size:17px; min-height:58px; }
.hero-search:focus-within { outline:3px solid var(--color-primary); outline-offset:3px; }
.hero-search input:focus-visible { outline:0; }
.popular-queries { display:flex; gap:8px; padding:12px 0 4px; overflow-x:auto; scrollbar-width:thin; }
.popular-queries button { min-height:44px; padding:8px 13px; border:1px solid #d5dcf0; border-radius:30px; background:#fff; color:var(--color-primary-dark); font-size:14px; white-space:nowrap; cursor:pointer; }
.home-hero .trust-strip { margin:18px 0 10px; gap:8px 14px; background:transparent; padding:0; border:0; display:flex; flex-wrap:wrap; }
.trust-strip .ui-icon { width:17px; height:17px; color:var(--color-primary); }
.home-hero .trust-strip li { display:flex; align-items:center; gap:5px; font-size:13px; background:transparent; padding:0; white-space:nowrap; }
.privacy-hint { margin:8px 0; font-size:13px; color:var(--color-muted); }
.search-options { font-size:14px; margin-top:14px; }
.search-options summary { cursor:pointer; width:fit-content; min-height:44px; padding-block:10px; color:var(--color-primary-dark); }
.hero-visual { position:relative; min-width:0; padding:26px; border:1px solid #d8deee; border-radius:24px; background:rgba(255,255,255,.85); box-shadow:var(--v2-shadow); }
.hero-visual__heading { display:flex; gap:14px; align-items:center; margin:0 0 24px; }
.scan-mark { display:grid; place-items:center; background:var(--color-primary); color:white; width:48px; height:48px; border-radius:14px; flex-shrink:0; }
.hero-visual__heading h2 { margin:4px 0 0; font-size:20px; }
.hero-visual__heading .eyebrow { font-size:11px; }
.hero-example { display:flex; align-items:center; gap:14px; padding:17px 0; border-top:1px solid #e2e6f0; }
.hero-example > div { flex:1; min-width:0; }
.hero-example strong { display:block; font-size:16px; margin:4px 0; }
.hero-example div > span:last-child { font-size:14px; color:var(--color-muted); }
.hero-example > .ui-icon { width:18px; color:#77809c; }
.hero-visual > p { margin:14px 0 0; color:var(--color-muted); font-size:13px; }
.hero-results { grid-column:1/-1; min-width:0; }
.search-result-toolbar { display:flex; justify-content:space-between; gap:16px; align-items:center; }
.search-result-toolbar:has(button:disabled) { display:none; }
.tool-result-status { font-size:15px; }
.tool-grid { margin-top:18px; }
.tool-card { gap:12px; padding:24px; }
.tool-card__icon { width:40px; height:40px; background:var(--color-primary-light); color:var(--color-primary); border-radius:10px; display:grid; place-items:center; }
.tool-card__body { display:flex; flex-direction:column; gap:10px; min-width:0; }
.tool-card__title { color:var(--color-text); font-size:19px!important; line-height:1.5; font-weight:750; }
.tool-card__description { color:var(--color-description)!important; font-size:15px!important; line-height:1.7; }
.tool-card__category { font-size:13px; }
.problem-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
.problem-card { min-width:0; border:1px solid var(--color-border); border-radius:18px; background:white; padding:28px 30px; text-decoration:none; display:flex; flex-direction:column; align-items:start; }
.problem-card h3 { font-size:21px; line-height:1.5; margin:18px 0 10px; }
.problem-card p { color:var(--color-description); font-size:15px; margin:0 0 20px; flex:1; }
.problem-card .format-badge { color:var(--tone); background:var(--tone-soft); padding:5px 8px; border-radius:6px; font-size:11px!important; }
.problem-action { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:700; color:var(--color-primary-dark); margin-top:20px; }
.problem-action .ui-icon { width:18px; }
.category-links { display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; margin-top:24px; font-size:14px; }
.category-links > span { color:var(--color-muted); }
.category-links .category-hub-card { display:inline-flex; background:transparent; padding:9px 0; min-height:44px; border:0; border-radius:0; color:var(--color-primary-dark); }
.featured-section { background:#eef1f9; border-block:1px solid #e1e6f1; }
.featured-tools__grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:20px; }
.featured-tool-card { grid-column:span 3; display:flex; flex-direction:column; align-items:start; gap:14px; padding:26px; border:1px solid #dce2ed; background:white; border-radius:18px; min-width:0; }
.featured-tool-card[data-featured-size=large] { grid-column:span 6; background:linear-gradient(130deg,white,var(--tone-soft)); box-shadow:var(--v2-shadow); padding:32px; }
.featured-tool-card[data-featured-size=large] .tool-card__title { font-size:24px!important; max-width:22ch; }
.featured-tool-card .card-icon { font-size:inherit; }
.featured-tool-card .tool-card__body { flex:1; }
.featured-tool-action { color:var(--color-primary-dark); font-size:14px; font-weight:750; margin-top:10px; }
.featured-tool-card .card-arrow { display:none; }
.how-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px; padding:0; list-style:none; }
.how-grid li { min-width:0; padding:22px 0; border-top:1px solid var(--color-border); }
.how-grid .step-icon { margin-right:14px; vertical-align:middle; }
.how-grid .eyebrow { color:var(--color-muted); }
.how-grid h3 { font-size:20px; margin:20px 0 10px; }
.how-grid p { font-size:16px; color:var(--color-description); max-width:28ch; }
.lab-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.lab-card { padding:0; overflow:hidden; min-width:0; border:1px solid var(--color-border); border-radius:18px; background:white; }
.lab-card__image { display:block; aspect-ratio:1.8; overflow:hidden; background:#eef2fa; border-bottom:1px solid var(--color-border); padding:18px 12px; }
.lab-card__image img { width:100%; height:100%; object-fit:contain; }
.lab-card__body { padding:24px; }
.lab-card h3 { margin:12px 0; font-size:20px; line-height:1.55; }
.lab-card h3 a { text-decoration:none; color:var(--color-text); }
.lab-card p { font-size:15px; color:var(--color-description); line-height:1.75; margin:12px 0 20px; }
.lab-card time { font-size:13px; color:var(--color-muted); display:block; }
.lab-card__action { display:inline-flex; align-items:center; min-height:44px; font-size:14px; margin-top:8px; font-weight:750; text-decoration:none; }
.verification-policy { background:#202b52; color:white; width:100%; max-width:none; border:0; }
.verification-policy .eyebrow { color:#b9c9ff; }
.verification-policy h2 { color:white; }
.method-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:32px; margin-top:36px; }
.method-grid .ui-icon { width:30px; height:30px; color:#b9c9ff; }
.method-grid h3 { font-size:18px; margin:16px 0 10px; }
.verification-policy .method-grid p { font-size:15px; color:#d2d9ed; margin:0; }
.method-links { display:flex; flex-wrap:wrap; gap:16px 32px; margin-top:32px; }
.method-links a { color:#d5e0ff; font-size:15px; min-height:44px; display:inline-flex; align-items:center; }
/* Shared tool workspace. Analyzer controls, data and output remain owned by each tool. */
.tool-page { padding-block:24px 64px; }
.breadcrumb { font-size:13px; color:var(--color-muted); margin-bottom:24px; }
.tool-intro { margin-bottom:28px; }
.tool-intro .eyebrow { display:inline-flex; background:var(--color-primary-light); border-radius:7px; padding:5px 9px; font-size:13px; }
.tool-intro h1 { font-size:clamp(28px,3vw,38px); line-height:1.45; margin:14px 0; max-width:32ch; }
.tool-intro > p:not(.eyebrow) { font-size:17px; color:var(--color-description); max-width:64ch; }
.specialist-tool .trust-strip { background:transparent; border:0; padding:0; gap:10px 20px; }
.specialist-tool .trust-strip li { font-size:13px; color:var(--color-primary-dark); background:var(--color-primary-light); padding:5px 9px; border-radius:7px; }
.specialist-tool [data-ui-input] { border:1px solid #ccd5ee; background:linear-gradient(145deg,#fff,#f4f6ff); box-shadow:var(--v2-shadow); border-radius:20px; padding:28px; margin-top:24px; }
[data-ui-input] > h2:first-child { font-size:24px; margin-top:0; margin-bottom:20px; }
.specialist-tool [data-ui-drop] { background:#eef2ff; border:2px dashed #899ac9; border-radius:16px; padding:24px; text-align:center; }
[data-ui-drop] > .ui-icon { display:block; width:36px; height:36px; margin:0 auto 14px; color:var(--color-primary); }
[data-ui-drop] label { display:block; font-weight:700; color:var(--color-text); }
[data-ui-drop] input[type=file] { display:block; width:100%; margin:16px auto; padding:12px; border:1px solid #c6d0ec; border-radius:10px; background:#fff; font-size:14px; text-align:left; }
input[type=file]::file-selector-button { min-height:46px; padding:10px 16px; margin-right:12px; border:0; border-radius:9px; background:var(--color-primary); color:white; font:inherit; font-weight:700; cursor:pointer; }
[data-ui-drop] p { font-size:14px; color:var(--color-description); }
[data-ui-input] :where(p[class$=note],p[class*=help]) { color:var(--color-description); font-size:14px; }
[data-ui-result] { background:#fff; border:1px solid #d4dcec; border-radius:20px; padding:28px; margin-block:28px; }
[data-ui-result] > h2:first-child { font-size:26px; margin-top:0; }
.pptx-summary { display:block; margin:24px 0; }
.result-key-counts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.result-key-counts .pptx-count { background:#f6f8fc; border:1px solid #dde2ec; border-radius:12px; padding:18px; }
.result-key-counts .pptx-count strong { display:block; color:var(--color-primary-dark); font-size:32px; }
.result-key-counts .pptx-count > span { color:var(--color-description); font-size:15px; }
.result-key-counts .pptx-count[data-ui-state=issue] { background:#fff0f2; border-color:#e8acb4; }
.result-key-counts .pptx-count[data-ui-state=issue] strong { color:var(--color-danger); }
.result-key-counts .pptx-count[data-ui-state=review] { background:#fff5df; border-color:#dec599; }
.result-count-state { display:block; font-size:13px; color:var(--color-description); margin-top:8px; }
.result-all-counts { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.result-all-counts .pptx-count { background:#f6f8fc; padding:14px; border-radius:10px; }
.result-all-counts strong { color:var(--color-primary-dark); }
.result-structure-counts,.technical-details { border:1px solid var(--color-border); border-radius:12px; margin-top:22px; padding:14px 18px; }
.result-structure-counts summary,.technical-details > summary { min-height:44px; cursor:pointer; font-size:16px; font-weight:700; color:var(--color-primary-dark); }
.pptx-note { color:var(--color-description); font-size:14px; }
.tool-lab-link { display:grid; grid-template-columns:220px 1fr; gap:4px 24px; padding:24px; border-radius:16px; background:#f2eeff; border:1px solid #dfd7f7; margin-block:32px; }
.tool-lab-link > img { grid-row:1/5; width:100%; height:100%; object-fit:contain; background:white; border-radius:12px; }
.tool-lab-link > :not(img) { grid-column:2; margin:4px 0; }
.tool-lab-link h2 { font-size:20px; line-height:1.55; }
.tool-lab-link p:not(.eyebrow) { font-size:15px; color:var(--color-description); }
.tool-lab-link a { color:var(--color-primary-dark); }
.specialist-tool .content-card { background:white; border:1px solid var(--color-border); border-radius:16px; padding:28px; margin-block:24px; }
.specialist-tool .prose { font-size:17px; line-height:1.75; }
/* Reading and category surfaces. Original measurements, figures and fixtures are untouched. */
.lab-article { max-width:66ch; padding:40px; border:1px solid #dde2ec; border-radius:20px; box-shadow:none; font-size:17px; line-height:1.8; }
.lab-article .document-header h1 { font-size:clamp(30px,3.2vw,42px); line-height:1.38; margin-block:18px; }
.lab-article .document-header > p:not(.eyebrow,.lab-article__dates) { font-size:17px; color:var(--color-description); }
.lab-article__dates { font-size:13px; color:var(--color-muted); }
.lab-header-image { display:block; width:100%; max-height:320px; object-fit:contain; border:1px solid #dde2ec; border-radius:14px; background:#f6f8fc; padding:18px; margin-top:24px; }
.lab-article .lab-conclusion { border:1px solid #b8c7ed; border-left:5px solid var(--color-primary); border-radius:12px; background:#eef2ff; padding:24px; margin-block:32px; }
.lab-article .lab-conclusion h2 { margin:0 0 12px; font-size:26px; }
.lab-article .lab-overview dl { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.lab-overview dl > div { min-width:0; display:block; padding:18px; border:1px solid var(--color-border); border-radius:10px; background:#f8f9fc; }
.lab-overview dt { font-size:13px; color:var(--color-muted); margin-bottom:6px; }
.lab-overview dd { margin:0; font-size:15px; }
.lab-article > section { margin-top:44px; }
.lab-article h2 { font-size:28px; line-height:1.42; margin-block:40px 18px; }
.lab-article h3 { font-size:21px; line-height:1.55; }
.lab-article .lab-figure { margin-block:28px; border:1px solid #dde2ec; border-radius:12px; padding:16px; background:#fafbfe; }
.lab-article figcaption { color:var(--color-description); font-size:14px; margin-top:12px; line-height:1.7; }
.lab-article .lab-tool-cta { border:1px solid #b8c7ed; background:#eef2ff; border-radius:16px; padding:24px; }
.category-visual { display:flex; align-items:center; gap:18px; margin-bottom:20px; }
.category-problems { display:flex; flex-wrap:wrap; gap:8px; margin:20px 0; }
.category-problems span { font-size:14px; padding:6px 12px; background:#eef2ff; border-radius:8px; color:var(--color-primary-dark); }
.category-tool-card { padding:24px; border-radius:16px; }
.category-tool-card strong { font-size:19px; }
.category-tool-card > span:not(.card-icon,.card-arrow) { font-size:15px; color:var(--color-description); }
.category-tool-card .card-icon { width:44px; height:44px; }
.lab-hub-thumbnail { width:100%; height:190px; object-fit:contain; background:#f6f8fc; border-radius:12px; margin-bottom:18px; padding:16px; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) { .problem-card,.featured-tool-card,.lab-card,.category-tool-card,.tool-card { transition:transform 160ms,border-color 160ms,box-shadow 160ms; } .problem-card:hover,.featured-tool-card:hover,.lab-card:hover,.category-tool-card:hover,.tool-card:hover { transform:translateY(-2px); border-color:#a1b2df; box-shadow:var(--v2-shadow); } }
@media(max-width:1000px) { .hero-layout { gap:30px; } .hero-visual { padding:22px; } .home-hero h1 { font-size:44px; } .problem-grid,.method-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .featured-tool-card { grid-column:span 6; } .lab-card-grid { gap:16px; } .lab-card__body { padding:20px; } }
@media(max-width:767px) { body { font-size:16px; } .specialist-home .section { padding-block:44px; } .specialist-home h2 { font-size:26px; } .home-hero { padding:30px 0 24px; } .hero-layout { grid-template-columns:1fr; gap:26px; } .home-hero h1 { font-size:38px; line-height:1.3; margin:12px 0 16px; } .hero-lead { font-size:16px; margin-bottom:20px; max-width:none; } .hero-search { min-height:56px; } .hero-search input { min-height:54px; font-size:16px; } .hero-visual { margin-top:0; } .hero-results { grid-row:2; } .hero-visual { grid-row:3; } .home-hero .trust-strip { margin-top:14px; gap:9px; } .home-hero .trust-strip li { font-size:12px; } .privacy-hint { font-size:12px; } .search-options { margin-top:6px; } .problem-grid,.lab-card-grid,.how-grid,.tool-grid { grid-template-columns:1fr; } .method-grid { grid-template-columns:1fr 1fr; gap:26px; } .problem-card { padding:24px; } .problem-card h3 { margin-top:14px; } .problem-card p { margin-bottom:16px; } .featured-tool-card,.featured-tool-card[data-featured-size=large] { grid-column:1/-1; padding:24px; } .featured-tool-card[data-featured-size=large] .tool-card__title { font-size:22px!important; } .how-grid { gap:12px; } .how-grid li { padding:22px 0 4px; } .how-grid p { max-width:none; } .category-links { font-size:13px; } .hero-visual__heading h2 { font-size:19px; } .tool-page { padding-top:18px; } .breadcrumb { margin-bottom:20px; } .tool-intro h1 { font-size:28px; } .tool-intro > p:not(.eyebrow) { font-size:16px; } .specialist-tool [data-ui-input], [data-ui-result] { padding:20px; border-radius:16px; } .specialist-tool [data-ui-drop] { padding:20px 14px; } [data-ui-drop] input[type=file] { padding:8px; font-size:13px; } input[type=file]::file-selector-button { padding:10px 12px; margin-right:8px; } .result-key-counts,.result-all-counts { grid-template-columns:repeat(2,minmax(0,1fr)); } .result-key-counts .pptx-count { padding:14px; } .result-key-counts .pptx-count > span { font-size:14px; } .tool-lab-link { display:block; padding:20px; } .tool-lab-link > img { height:150px; margin-bottom:18px; } .specialist-tool .content-card { padding:20px; } .lab-article { padding:24px 20px; border-radius:16px; font-size:17px; } .lab-article .document-header h1 { font-size:30px; } .lab-article h2 { font-size:25px; } .lab-article .lab-conclusion { padding:20px; } .lab-header-image { padding:10px; } .lab-article .lab-overview dl { grid-template-columns:1fr; } .lab-article .lab-figure { padding:10px; } }
@media(max-width:359px) { .site-brand { font-size:15px; gap:6px; } .site-brand__mark { width:30px; height:30px; } .site-nav a { font-size:13px; padding-inline:5px; } .home-hero h1 { font-size:34px; } .home-hero .trust-strip { gap:6px; } .home-hero .trust-strip li { font-size:11px; } .method-grid { grid-template-columns:1fr; } .hero-visual { padding:18px; } .hero-example { gap:10px; } .hero-example strong { font-size:15px; } .hero-example > .card-icon { width:38px; height:38px; flex-shrink:0; } }
/* Explicit specificity for the old specialist/Lab rules. */
.site-footer { background:#fff; }
.specialist-tool .tool-intro h1 { font-size:clamp(28px,3vw,38px); margin-block:14px; line-height:1.45; }
.specialist-tool .tool-intro > p:not(.eyebrow) { font-size:17px; color:var(--color-description); }
.specialist-tool .content-card.prose { font-size:17px; }
.specialist-tool [data-ui-input] { margin-top:24px; border-color:#ccd5ee; }
.specialist-tool .pptx-page :focus-visible { outline-color:var(--color-primary); }
[data-ui-drop] .upload-prompt { font-size:18px; font-weight:700; color:var(--color-text); margin:0 0 18px; }
[data-ui-drop] .file-pick-label { display:inline-flex; flex-direction:column; padding:12px 26px; min-height:52px; border-radius:10px; background:var(--color-primary); color:white; cursor:pointer; font-size:17px; }
.file-pick-label span { font-size:13px; font-weight:400; color:#fff; }
[data-ui-drop]:has(.file-pick-label) input[type=file] { position:absolute; width:1px; height:1px; padding:0; border:0; margin:-1px; clip-path:inset(50%); overflow:hidden; }
[data-ui-drop]:has(input:focus-visible) .file-pick-label { outline:3px solid var(--color-primary); outline-offset:4px; }
.lab-reader .lab-article { max-width:66ch; margin-inline:auto; padding:40px; border:1px solid var(--color-border); border-radius:20px; font-size:17px; line-height:1.8; }
.lab-reader .lab-article .document-header h1 { font-size:clamp(30px,3.2vw,42px); font-weight:750; line-height:1.38; }
.lab-reader .lab-article h2 { font-size:28px; line-height:1.42; margin-block:40px 18px; }
.lab-reader .lab-article .lab-conclusion h2 { margin-top:0; font-size:26px; }
.lab-reader .lab-article .eyebrow { font-size:13px; }
.lab-reader .lab-article figcaption { font-size:14px; }
.lab-reader .lab-article .lab-overview dl { grid-template-columns:repeat(2,minmax(0,1fr)); }
.lab-reader .lab-article .lab-overview dl > div { display:block; }
.lab-reader .lab-article .lab-tool-cta h2 { margin-top:0; }
@media(max-width:767px) { .container { width:calc(100% - 36px); } .site-header__inner nav { width:auto; } .site-header__inner { justify-content:space-between; } .specialist-tool .tool-intro h1 { font-size:28px; } .specialist-tool .tool-intro > p:not(.eyebrow) { font-size:16px; } .specialist-tool .trust-strip { gap:8px; } .specialist-tool .trust-strip li { padding:4px 6px; font-size:12px; } .lab-reader .lab-article { padding:24px 20px; border-radius:16px; } .lab-reader .lab-article .document-header h1 { font-size:30px; } .lab-reader .lab-article h2 { font-size:25px; } .lab-reader .lab-article .lab-overview dl { grid-template-columns:1fr; } }
.lab-header-image { height:auto; max-height:none; }
.lab-reader .lab-article .document-header { margin-bottom:24px; }
@media(max-width:767px) { .lab-header-image { height:auto; } .specialist-tool .breadcrumb { margin-bottom:12px; } .specialist-tool .tool-intro { margin-bottom:20px; } }
.hero-search { border-color:#778ab7; }
.lab-reader .lab-article .lab-next { padding:24px; border:1px solid #b8c7ed; border-radius:16px; background:#eef2ff; }
.lab-reader .lab-article .lab-next h2:first-child { margin-top:0; }
.lab-header-overview { display:grid; grid-template-columns:1fr; gap:10px; margin-top:24px; padding:20px; border:1px solid var(--color-border); border-radius:14px; background:#f6f8fc; }
.lab-header-overview > div { display:flex; flex-wrap:wrap; gap:8px 20px; padding:14px; background:white; border:1px solid var(--color-border); border-radius:10px; }
.lab-header-overview strong { font-size:16px; }
[data-ui-drop] { min-width:0; }

@media(max-width:767px) { [data-ui-drop] > .ui-icon { width:32px; height:32px; margin-bottom:10px; } }

.lab-next .button,.lab-tool-cta .button { background:var(--color-primary); border-color:var(--color-primary); color:#fff; font-weight:700; }
@media(max-width:767px) { [data-pptx-result] > .pptx-actions { display:grid; grid-template-columns:1fr; gap:10px; } [data-pptx-result] > .pptx-actions > .button { width:100%; min-height:48px; } }
.docx-summary,.epub-summary { display:block; margin:24px 0; }
.result-key-counts .result-count { background:#f6f8fc; border:1px solid #dde2ec; border-radius:12px; padding:18px; }
.result-key-counts .result-count strong { display:block; color:var(--color-primary-dark); font-size:32px; }
.result-key-counts .result-count > span { color:var(--color-description); font-size:15px; }
.result-key-counts .result-count[data-ui-state=issue] { background:#fff0f2; border-color:#e8acb4; }
.result-key-counts .result-count[data-ui-state=issue] strong { color:var(--color-danger); }
.result-key-counts .result-count[data-ui-state=review] { background:#fff5df; border-color:#dec599; }
.result-all-counts .result-count { background:#f6f8fc; padding:14px; border-radius:10px; }
.result-all-counts .result-count strong { color:var(--color-primary-dark); }
@media(max-width:767px) { .result-key-counts .result-count { padding:14px; } .result-key-counts .result-count > span { font-size:14px; } [data-docx-result] > .docx-actions,[data-epub-result] > .epub-actions { display:grid; grid-template-columns:1fr; gap:10px; } [data-docx-result] > .docx-actions > .button,[data-epub-result] > .epub-actions > .button { width:100%; min-height:48px; } }

/* V3: clearer examples and optional sample controls. */
.hero-mini { width:96px; height:72px; flex-shrink:0; }
.sample-disclosure { margin-block:16px; padding:0 16px; border:1px solid var(--color-border); border-radius:12px; background:var(--color-surface); }
.sample-disclosure > summary { min-height:48px; padding-block:12px; cursor:pointer; color:var(--color-primary-dark); font-size:15px; font-weight:650; }
.sample-disclosure[open] { padding-bottom:16px; }
.sample-disclosure .pptx-actions,.sample-disclosure .docx-actions,.sample-disclosure .epub-actions,.sample-disclosure .cbz-actions { margin-top:8px; }
.directory-card[data-category="画像・写真・メディア"] { --tone:var(--color-orange); --tone-soft:var(--color-orange-soft); }
.directory-card[data-category="Web・通信・セキュリティ"] { --tone:var(--color-violet); --tone-soft:var(--color-violet-soft); }
@media(max-width:767px) { .specialist-home .site-header__inner { flex-wrap:wrap; gap:2px; padding-block:10px 4px; } .specialist-home .site-header__inner nav { width:100%; } .specialist-home .site-nav { justify-content:space-between; gap:4px; } .specialist-home .site-nav a { font-size:14px; padding-inline:4px; } .problem-card { padding:24px; } .hero-mini { width:84px; height:63px; } }
@media(max-width:359px) { .specialist-home .site-nav a { font-size:13px; } .hero-example { flex-wrap:wrap; } .hero-example > div { flex-basis:calc(100% - 112px); } }
