:root{--accent:#d78b32;--soft:#fcebd9;--image:#f4f6f6;--pale:#f5d9af;}
/* Supplied desktop mocks; shared structure, theme-specific palette and SVG. */
:root{--ink:#28343c;--muted:#7f878d;--paper:#fcfcfc;--white:#fff;--line:#e5e6e7;--serif:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
body{font:18px/1.55 var(--serif);background:var(--paper);color:var(--ink)}
a:hover{color:var(--accent)}.site-header{border:0}.bar{max-width:1220px;min-height:116px;padding:20px 0;border-bottom:1px solid var(--line);gap:30px}.brand{display:flex;align-items:center;gap:10px;flex:0 1 260px;font-size:23px;letter-spacing:0;line-height:1.15}.theme-icon{width:60px;height:60px;flex-shrink:0}.topnav{margin:0;gap:30px;font-size:18px;flex:1}.topnav a[aria-current]{color:var(--ink)}.header-search{width:220px;border:0;gap:8px}.header-search input{border-bottom:1px solid var(--line);font-size:14px}.header-search button{padding:7px;color:var(--ink)}.header-search svg{width:27px;height:27px;fill:none;stroke:currentColor;stroke-width:1.5;display:block}
.layout{display:block;max-width:1220px;margin:36px auto 0;padding:0}.intro{position:relative;max-width:none;margin:0 0 42px;padding:28px 300px 35px 30px;min-height:318px;background:var(--soft);border-radius:13px}.intro .eyebrow{font-size:14px;color:var(--accent);margin:0 0 28px;letter-spacing:.3px}.intro h1{font:750 44px/1.22 var(--serif);letter-spacing:.1px;margin:0 0 16px}.intro p{font-size:22px;line-height:1.4;margin:0;max-width:none}.intro-art{position:absolute;right:30px;top:36px;width:260px;height:240px;object-fit:cover}.sectionline{border:0;margin:0 0 36px;padding:0;align-items:center}.sectionline h2{font:750 30px/1.25 var(--serif);letter-spacing:0;text-transform:none}.sectionline a{font-size:16px;text-decoration:none}.grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 30px}.card,.card.has-image{display:flex;flex-direction:column;gap:0;padding:0;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--white);min-width:0;min-height:495px}.card img{display:block;flex-shrink:0;width:100%;height:auto;aspect-ratio:1.73;object-fit:cover;border-radius:0;align-self:stretch}.card .eyebrow{font:700 13px/1.5 var(--serif);letter-spacing:.3px;color:var(--accent);margin:20px 21px 0}.card h2{font:750 25px/1.22 var(--serif);letter-spacing:0;margin:12px 21px 20px}.card p{font-size:17px;line-height:1.4;margin:0 21px 20px;-webkit-line-clamp:3}.card .card-meta{margin: auto 21px 20px;padding-top:26px;font-size:13px;color:var(--muted)}.more{display:table;margin:76px auto 60px;border:1px solid var(--accent);border-radius:6px;min-width:310px;text-align:center;padding:14px 24px;font:500 18px/1.5 var(--serif);text-decoration:none}.more:hover{background:var(--soft)}
.design-article .main-column>article,.design-article .related,.design-article .preserved-links{max-width:930px;margin-left:auto;margin-right:auto}.breadcrumb{font-size:15px;margin:0 0 38px;color:var(--muted)}.breadcrumb a{color:inherit;text-decoration:none}.article-head{margin:0 0 34px}.article-head h1{font:750 46px/1.18 var(--serif);letter-spacing:.1px;margin:0 0 25px}.meta{font-size:15px;margin-top:28px}.content{max-width:none;font-size:21px;line-height:1.5}.content h2{font:750 30px/1.25 var(--serif);margin:32px 0 14px;letter-spacing:0}.content h3{font:700 25px/1.3 var(--serif)}.content p{margin-bottom:22px}.content img{max-width:100%;height:auto;object-fit:contain}.article-placeholder{display:block;width:100%;height:auto;aspect-ratio:2.62;object-fit:contain;background:var(--image);margin:0 0 34px}.content blockquote{background:var(--soft);border-left:4px solid var(--accent);border-radius:3px 10px 10px 3px;padding:22px 26px;color:var(--ink);margin:28px 0}.toc{background:var(--soft);border-color:var(--line)}.content table{display:block;max-width:100%;overflow:auto}.content pre{max-width:100%;overflow:auto}.content iframe,.content video,.content svg{max-width:100%}.related{border-top:1px solid var(--line);margin-top:44px;padding-top:24px}.related>h2{font:750 27px var(--serif);text-transform:none;letter-spacing:0;margin:0 0 22px}.related .grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}.related .card{display:grid;grid-template-columns:130px 1fr;grid-template-rows:auto 1fr;border:0;background:none;border-radius:0;min-height:104px;gap:0 18px}.related .card img{grid-column:1;grid-row:1/3;width:130px;height:104px;aspect-ratio:auto;object-fit:cover}.related .card .eyebrow{grid-column:2;margin:0 0 8px;font-size:12px}.related .card h2{grid-column:2;margin:0;font:750 21px/1.22 var(--serif)}.related .card p,.related .card-meta{display:none}.site-footer{max-width:1220px;margin:62px auto 0;padding:24px 0 30px;font-size:14px;border-top:1px solid var(--line);gap:30px}.site-footer a{color:var(--muted)}.catalog-count{margin-top:-15px}.main-column> .intro:not(:has(.intro-art)){padding-right:30px;min-height:0}.search-form>*{max-width:100%}.search-results h2{font-family:var(--serif)}
@media(max-width:1280px){.bar,.layout,.site-footer{margin-left:32px;margin-right:32px}.brand{flex-basis:220px}.intro h1{font-size:40px}.intro{padding-right:280px}.intro-art{width:230px}.header-search{width:200px}}
@media(max-width:1050px){.brand{flex-basis:auto;font-size:22px}.bar{gap:24px}.topnav{gap:20px}.grid{gap:28px 22px}.card h2{font-size:23px}.card{min-height:480px}.intro{padding-right:250px}.intro-art{width:205px}.intro h1{font-size:36px}.intro p{font-size:20px}.content{font-size:20px}.article-head h1{font-size:42px}}
@media(max-width:820px){.bar{flex-wrap:wrap;gap:12px 24px;padding:18px 0}.brand{flex:1}.topnav{flex:0 1 auto;margin-left:auto}.header-search{flex-basis:100%;width:100%}.header-search input{padding:9px 0}.layout{margin-top:28px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.intro{padding:26px 200px 28px 26px;min-height:280px}.intro-art{width:160px;height:180px;right:24px;top:45px}.intro h1{font-size:32px}.intro .eyebrow{font-size:12px;margin-bottom:20px}.intro p{font-size:18px}.sectionline h2{font-size:26px}.sectionline a{font-size:14px}.article-head h1{font-size:38px}.related .card{grid-template-columns:90px 1fr;gap:0 12px}.related .card img{width:90px;height:90px}.related .card h2{font-size:18px}.site-footer{display:flex;font-size:13px}.site-footer span{margin:0}}
@media(max-width:560px){.bar,.layout,.site-footer{margin-left:20px;margin-right:20px}.brand{font-size:21px;gap:5px}.theme-icon{width:42px;height:46px}.topnav{gap:16px;font-size:15px}.intro{display:flex;flex-direction:column;padding:24px;min-height:0;margin-bottom:32px}.intro h1{font-size:31px;line-height:1.2}.intro p{font-size:18px}.intro .eyebrow{font-size:11px;line-height:1.5;margin-bottom:18px}.intro-art{position:static;width:100%;height:155px;object-fit:contain;background:var(--image);margin-top:23px}.sectionline{gap:12px;margin-bottom:24px;align-items:flex-start}.sectionline h2{font-size:23px;max-width:180px}.sectionline a{font-size:13px;max-width:110px;text-align:right}.grid{grid-template-columns:minmax(0,1fr);gap:24px}.card,.card.has-image{min-height:440px}.card h2{font-size:24px}.card .card-meta{padding-top:18px}.more{min-width:0;width:100%;margin:34px auto 40px}.article-head h1{font-size:32px;line-height:1.2}.breadcrumb{font-size:13px;margin-bottom:25px}.meta{font-size:13px;margin-top:22px}.content{font-size:18px;line-height:1.6}.content h2{font-size:26px;margin-top:28px}.article-placeholder{aspect-ratio:1.73;margin-bottom:26px}.related .grid{grid-template-columns:minmax(0,1fr);gap:24px}.related .card,.related .card.has-image{min-height:90px}.site-footer{display:block;padding:22px 0;margin-top:40px;line-height:1.7}.site-footer span{display:block;margin-bottom:12px}.search-form input{min-width:0;flex-basis:100%}.search-form select{width:100%}.content blockquote{padding:18px}.content figure{margin-left:0;margin-right:0}}

/* Automotive mock: compact orange hero, varied illustrations, wide article. */
body[data-theme="auto"]{--paper:#fff;--ink:#292e31;--line:#dedfe0}
[data-theme="auto"] .bar{min-height:96px}
[data-theme="auto"] .intro{min-height:275px;padding:35px 53% 32px 42px;margin-bottom:38px;background:#fcebd9;overflow:hidden}
[data-theme="auto"] .intro .eyebrow{font-size:16px;margin-bottom:12px}
[data-theme="auto"] .intro h1{font-size:48px;margin-bottom:12px}
[data-theme="auto"] .intro p{font-size:23px}
[data-theme="auto"] .intro-art{width:57%;height:100%;right:0;top:0;object-fit:contain;object-position:right bottom}
[data-theme="auto"] .sectionline{margin-bottom:28px}
[data-theme="auto"] .sectionline h2{font-size:35px}
[data-theme="auto"] .grid{gap:26px 24px}
[data-theme="auto"] .card,[data-theme="auto"] .card.has-image{min-height:430px}
[data-theme="auto"] .card img{aspect-ratio:1.83}
[data-theme="auto"] .card h2{font-size:25px;margin:8px 23px 14px}
[data-theme="auto"] .card .eyebrow{margin:18px 23px 0;font-size:14px}
[data-theme="auto"] .card p{margin:0 23px 18px;font-size:18px}
[data-theme="auto"] .card .card-meta{margin: auto 23px 20px;padding-top:14px;font-size:14px}
[data-theme="auto"] .more{background:var(--accent);color:white;border:0;min-width:270px;margin:34px auto 38px;padding:12px 24px;border-radius:12px}
[data-theme="auto"] .more:hover{background:#bd7123;color:white}
[data-theme="auto"].design-article .main-column>article,[data-theme="auto"].design-article .related,[data-theme="auto"].design-article .preserved-links{max-width:1220px}
[data-theme="auto"] .article-head h1{font-size:52px;line-height:1.12}
[data-theme="auto"] .article-placeholder{aspect-ratio:3.2;object-fit:fill;background:white;margin-bottom:25px}
[data-theme="auto"] .content h2{font-size:34px}
[data-theme="auto"] .related .card{border:1px solid var(--line);border-radius:7px;padding:8px;min-height:112px;background:white}
[data-theme="auto"] .related .card h2{font-size:22px;margin:0}
[data-theme="auto"] .related .card .eyebrow{margin:0 0 6px;font-size:12px}
[data-theme="auto"] .related .card img{border-radius:4px}
[data-theme="auto"] .site-footer{margin-top:36px}
@media(max-width:1050px){[data-theme="auto"] .intro{padding:28px 48% 28px 30px;min-height:250px}[data-theme="auto"] .intro h1{font-size:39px}[data-theme="auto"] .intro p{font-size:21px}[data-theme="auto"] .intro-art{width:50%}[data-theme="auto"] .card h2{font-size:22px}[data-theme="auto"] .article-head h1{font-size:44px}}
@media(max-width:820px){[data-theme="auto"] .intro{padding:26px 47% 26px 26px;min-height:240px}[data-theme="auto"] .intro h1{font-size:34px}[data-theme="auto"] .intro p{font-size:19px}[data-theme="auto"] .intro .eyebrow{font-size:13px}[data-theme="auto"] .sectionline h2{font-size:29px}[data-theme="auto"] .article-head h1{font-size:38px}[data-theme="auto"] .related .card h2{font-size:18px}}
@media(max-width:560px){[data-theme="auto"] .intro{padding:24px 24px 0;min-height:0}[data-theme="auto"] .intro-art{position:static;width:calc(100% + 48px);max-width:none;height:auto;margin:15px -24px 0;background:transparent;aspect-ratio:1.875}[data-theme="auto"] .intro h1{font-size:34px}[data-theme="auto"] .sectionline h2{font-size:25px}[data-theme="auto"] .card,[data-theme="auto"] .card.has-image{min-height:410px}[data-theme="auto"] .card h2{font-size:24px}[data-theme="auto"] .article-head h1{font-size:32px}[data-theme="auto"] .content h2{font-size:27px}[data-theme="auto"] .article-placeholder{aspect-ratio:1.875}[data-theme="auto"] .related .card,[data-theme="auto"] .related .card.has-image{min-height:106px}}
[data-theme="auto"] .related .card img{display:block;visibility:visible}