/* Paint only: all layout and typography come from the shared style.css. */
html[data-visual-style="sketch"] body { background:#f1e8d7; color:#235c5b; }
html[data-visual-style="sketch"] .screen { background-image:url('sketch-intro-wide.png'); background-size:cover; background-position:center; }
html[data-visual-style="sketch"] h1 { color:#235c5b; text-shadow:none; }
html[data-visual-style="sketch"] h1 span { color:#d6a448; }
html[data-visual-style="sketch"] .intro-copy { background:none; }
html[data-visual-style="sketch"] .primary { background:#235c5b; color:#fff5de; box-shadow:0 5px 0 #174442,0 10px 25px #914d2822; }
html[data-visual-style="sketch"] .primary:active { box-shadow:0 2px 0 #174442; }
html[data-visual-style="sketch"] .icon,
html[data-visual-style="sketch"] .instagram-profile,
html[data-visual-style="sketch"] .style-toggle { background:#f6eddbde; border-color:#245b5938; }
html[data-visual-style="sketch"] .style-toggle button[aria-pressed="true"] { background:#285b57; }
html[data-visual-style="sketch"] .instructions { color:#47685e; }
html[data-visual-style="sketch"] .stats,
html[data-visual-style="sketch"] .zoom-wrap,
html[data-visual-style="sketch"] .card,
html[data-visual-style="sketch"] dialog { background-color:#f5eddd; border-color:#baa47b70; }
html[data-visual-style="sketch"] .lane-controls button { background:#f5ecdcd9; border-color:#235c5b60; }
html[data-visual-style="sketch"] #zoomFill { background:#d6a448; }
html[data-visual-style="sketch"] body.playing header .wordmark { color:#235c5b; text-shadow:0 1px 4px #fff8; }
@media(min-width:761px){
  html[data-visual-style="sketch"] #intro{background-image:linear-gradient(90deg,#f1e8d7ed 0%,#f1e8d7dd 38%,#f1e8d750 65%,transparent 85%),url('sketch-intro-wide.png');background-position:right center;}
}
@media(max-width:760px) {
  html[data-visual-style="sketch"] .screen { background-color:#f1e8d7;background-image:linear-gradient(0deg,#f1e8d7 0%,#f1e8d770 55%,#f1e8d745 100%),url('sketch-intro-portrait-raised.png');background-size:100% 100%,100% auto;background-position:center,center 72px;background-repeat:no-repeat; }
  html[data-visual-style="sketch"] .intro-copy { isolation:isolate; }
  html[data-visual-style="sketch"] .intro-copy::before { content:"";position:absolute;z-index:-1;pointer-events:none;left:-6%;right:-6%;top:-30px;height:250px;background:radial-gradient(ellipse at 40% 42%,#f1e8d7f2 10%,#f1e8d7cc 45%,#f1e8d700 74%);filter:blur(12px); }
}
