/* Sketchbook identity, including the matching vector intro. */
body:not([data-phase="intro"]) {
  --lab-ink:#373d42; --lab-accent:#466f86;
  --lab-a:#faf6e9; --lab-b:#e8d6b5; --lab-c:#f0d9ca;
  --lab-card:#fffdf5; --lab-border:#56594b;
  background:linear-gradient(112deg,var(--lab-a) 15%,color-mix(in srgb,var(--lab-b),var(--lab-a) 74%) 58%,color-mix(in srgb,var(--lab-c),var(--lab-a) 68%)) !important;
}
body[data-phase="drawing"] { --lab-b:#dfdab6; --lab-c:#e8d0b8; --lab-accent:#6c7955; }
body[data-phase="guess"] { --lab-b:#cddccf; --lab-c:#d8e0dc; --lab-accent:#497968; }
body[data-phase="vote"] { --lab-b:#dbd1dd; --lab-c:#e8d3c7; --lab-accent:#7c647e; }
body[data-phase="reveal"] { --lab-b:#d5dfbc; --lab-c:#f0dfb1; --lab-accent:#628061; }
body:is([data-phase="scoreboard"],[data-phase="final"]) { --lab-b:#f0d7a2; --lab-c:#e4c9b6; --lab-accent:#9b7040; }
body[data-screen] { --phone-bg:#f8f2e3; --phone-paper:#fffdf5; --phone-paper-soft:#f3eddd; --phone-blue:#466f86; --phone-coral:#bb7566; --phone-yellow:#e8c777; }
/* Notebook ruling, a double pencil margin, and a quiet page edge. */
.lab-world::before {
  inset:0; mask-image:none;
  background-image:linear-gradient(to bottom,transparent 31px,#748e9c18 31px,#748e9c18 32px),linear-gradient(to right,transparent 53px,#b96d6630 53px,#b96d6630 54px,transparent 54px,transparent 58px,#b96d661c 58px,#b96d661c 59px,transparent 59px);
  background-size:100% 32px,100% 100%;
}
.lab-world::after { content:''; position:absolute; inset:0; box-shadow:inset 14px 0 20px -18px #79684955,inset -8px 0 20px -18px #79684955; }
.lab-doodle { position:absolute; width:clamp(38px,5.5vw,78px); height:auto; color:#707768; opacity:.32; overflow:visible; animation:sketch-fidget 19s ease-in-out infinite; animation-delay:var(--doodle-delay); transform:rotate(var(--tilt,0deg)); }
.lab-doodle path { fill:none; stroke:currentColor; stroke-width:2.3; stroke-linecap:round; stroke-linejoin:round; }
.lab-doodle--cat { left:1%; top:15%; --tilt:-12deg; color:#6b7b84; }
.lab-doodle--ufo { right:2%; top:18%; --tilt:13deg; color:#997d65; }
.lab-doodle--pencil { left:2%; top:69%; --tilt:-15deg; color:#8a7561; }
.lab-doodle--star { right:1%; top:71%; --tilt:14deg; color:#b28a47; }
.lab-doodle--cup { left:20%; top:2%; --tilt:-8deg; width:50px; }
.lab-doodle--snail { right:25%; bottom:2%; --tilt:4deg; width:64px; }
.lab-doodle--spark { left:41%; top:20%; --tilt:8deg; width:36px; opacity:.22; }
.lab-doodle--swirl { right:39%; bottom:9%; width:42px; opacity:.22; }
@keyframes sketch-fidget { 0%,86%,100% { transform:rotate(var(--tilt,0deg)) translateY(0); } 90% { transform:rotate(calc(var(--tilt,0deg) + 4deg)) translateY(-2px); } 94% { transform:rotate(calc(var(--tilt,0deg) - 2deg)) translateY(0); } }
body.lab-still .lab-doodle { animation:none; }
/* Slightly imperfect ink outlines and cut-paper shadows. */
body:not([data-phase="intro"]) :is(.setup-card,.lobby-join-card,.lobby-roster-card,.lobby-guide-card,.paper-drawing-instruction,.quiet-reveal-panel,.scoreboard-ranking-list,.final-awards-board,.gallery-salon-best-lie) {
  border:1.5px solid #66685b !important; border-radius:9px 13px 8px 12px / 12px 8px 14px 7px !important;
  background:var(--lab-card) !important; box-shadow:4px 5px 0 #77684f19 !important;
}
body:not([data-phase="intro"]) :is(.spotlight-drawing-frame,.evidence-drawing-frame,.choice-arena-drawing-frame,.quiet-reveal-drawing-frame,.gallery-salon-drawing-frame) {
  border:9px solid #fffdf7; border-radius:3px 7px 4px 6px; outline:1.5px solid #66685b; box-shadow:5px 7px 0 #77684f1c; background:#fffdf7;
}
/* Little pieces of washi tape stay on the card edge, away from text. */
body:not([data-phase="intro"]) :is(.setup-card,.lobby-join-card,.paper-drawing-instruction)::after {
  content:''; position:absolute; top:-10px; left:calc(50% - 42px); width:84px; height:22px; background:repeating-linear-gradient(110deg,#d6bf86b5 0 7px,#e3d3a8b5 7px 9px); transform:rotate(-3deg); pointer-events:none; clip-path:polygon(2% 0,98% 2%,100% 91%,96% 100%,0 97%,3% 66%);
}
body:not([data-phase="intro"]) :is(.lab-phase-heading,.round-rocket-label,.scoreboard-spotlight-title,.final-scrapbook-title,.gallery-salon-title) { color:var(--lab-ink); text-shadow:none; }
body:not([data-phase="intro"]) .lab-phase-heading::after { content:''; display:block; width:110px; height:5px; margin:10px auto 0; border-bottom:3px solid #b4864d80; border-radius:50%; transform:rotate(-2deg); }
body:not([data-phase="intro"]) :is(.choice-timer-value,.evidence-timer-value) { color:var(--lab-accent); border:2px solid #65695d; border-radius:45% 49% 43% 48%; background:#fff9e6; box-shadow:2px 3px 0 #79684925; }
body:not([data-phase="intro"]) .paper-timer-value { color:var(--lab-accent); }
.choice-arena-stage .choice-arena-options .choice-arena-option { background:#fffdf5; border:1.5px solid #686759; border-radius:6px 11px 7px 10px; box-shadow:3px 4px 0 #79684920; }
.choice-arena-stage .choice-arena-option:nth-child(3n+1) { background:#fcf0cd; }
.choice-arena-stage .choice-arena-option:nth-child(3n+2) { background:#eaf0df; }
.choice-arena-stage .choice-arena-option:nth-child(3n+3) { background:#f4e5df; }
.choice-arena-stage .choice-arena-number { background:#686653; color:#fffdf5; box-shadow:none; }
.lobby-canvas .lobby-player-card { background:#f3eedf !important; border:1px dashed #a69b82; border-radius:8px 12px 9px 7px; }
.lobby-canvas :is(.lobby-phone-prompt,.lobby-qr-card) { background:#f7e6b2; border-color:#a18b5e; box-shadow:2px 3px 0 #79684925; }
.lobby-canvas .room-code-cell { background:#e2c98d; color:#41483e; border-color:#797565; box-shadow:2px 3px 0 #79684925; border-radius:7px 10px 6px 8px; }
.lobby-canvas .room-code-cell:nth-child(2) { background:#c8d8c0; }
.lobby-canvas .room-code-cell:nth-child(3) { background:#e8c5b7; }
.lobby-canvas .room-code-cell:nth-child(4) { background:#c4d5de; }
body:not([data-phase="intro"]) .create-button { background:#60755d !important; border:2px solid #435640 !important; box-shadow:3px 4px 0 #43564025 !important; border-radius:8px 12px 7px 10px; }
body:not([data-phase="intro"]) .setup-intro .eyebrow { color:#687c63; }
body:not([data-phase="intro"]) .step-index { background:#758a78; }
body:not([data-phase="intro"]) .asset-progress { accent-color:#758a78; }
body:not([data-phase="intro"]) .asset-progress::-webkit-progress-value { background:#758a78; }
body:not([data-phase="intro"]) :is(.scoreboard-spotlight-stage,.final-scrapbook-stage)::before { background:#fffdf5; border:1.5px solid #66685b; border-radius:8px 14px 9px 12px; box-shadow:4px 5px 0 #77684f19; }
body:not([data-phase="intro"]) .scoreboard-rank-badge { background:#7c8167 !important; }
body:not([data-phase="intro"]) :is(.scoreboard-winner-delta,.scoreboard-row-delta) { background:#e8d69e; color:#4e5648; box-shadow:none; }
body:not([data-phase="intro"]) :is(.final-champion-score,.final-runner-score) { color:#a36252; }
body:not([data-phase="intro"]) .lab-tools summary { background:#fff9e6; border:1px dashed #8d836d; border-radius:5px 9px 4px 8px; box-shadow:2px 3px 0 #79684920; }
body[data-screen] .lab-world { z-index:-1; }
@media(prefers-reduced-motion:reduce) { .lab-doodle { animation:none; } }
@media(max-width:600px) { .lab-doodle { width:34px; opacity:.22; } .lab-doodle--cup,.lab-doodle--spark,.lab-doodle--swirl,.lab-doodle--snail { display:none; } .lab-world::before { background-size:100% 28px,100% 100%; } }
/* Extra notebook margins: small characters and scattered pencil squiggles. */
.lab-doodle--ghost { left:.5%; top:39%; width:48px; --tilt:9deg; color:#8c8291; }
.lab-doodle--planet { right:.5%; top:43%; width:56px; --tilt:-17deg; color:#8a826a; }
.lab-doodle--flower { left:9%; bottom:2%; width:44px; --tilt:-9deg; color:#85906e; }
.lab-doodle--fish { right:10%; top:2%; width:46px; --tilt:11deg; color:#748b94; }
.lab-doodle--toast { left:34%; top:1%; width:43px; --tilt:8deg; color:#a18b68; }
.lab-doodle--kite { right:3%; bottom:9%; width:48px; --tilt:-12deg; color:#9b7d76; }
.lab-doodle[class*="--squiggle-"] { width:clamp(65px,7vw,105px); opacity:.23; color:#8c836f; }
.lab-doodle--squiggle-a { left:1%; top:27%; --tilt:73deg; }
.lab-doodle--squiggle-b { right:2%; top:29%; --tilt:-65deg; color:#839080 !important; }
.lab-doodle--squiggle-c { left:25%; bottom:1%; --tilt:-6deg; }
.lab-doodle--squiggle-d { right:27%; top:13%; --tilt:8deg; }
@media(max-width:600px) {
  .lab-doodle--toast,.lab-doodle--fish,.lab-doodle--kite,.lab-doodle--flower,
  .lab-doodle--squiggle-c,.lab-doodle--squiggle-d { display:none; }
  .lab-doodle--ghost,.lab-doodle--planet { width:28px; }
  .lab-doodle[class*="--squiggle-"] { width:45px; opacity:.16; }
}
/* Quiet cultural details, drawn with the same pencil line as the other doodles. */
.lab-doodle--dallah { right:1.2%; top:56%; width:55px; --tilt:8deg; color:#9b815a; }
.lab-doodle--oud { left:.6%; top:53%; width:55px; --tilt:-12deg; color:#8f7864; }
.lab-doodle--lantern { right:18%; bottom:1%; width:43px; --tilt:7deg; color:#81856b; }
@media(max-width:600px) {
  .lab-doodle--dallah,.lab-doodle--oud { width:28px; opacity:.2; }
  .lab-doodle--lantern { display:none; }
}