/* Original, standalone styles; no dependency on other challenge runtime CSS. */
:root {color-scheme: light; font-family: system-ui, sans-serif; color: #243c36; background: #f3f4eb;}
* {box-sizing: border-box;}
body {margin: 0;}
/* The generated entry inherits dark felt on body; this component owns its paper palette. */
.sm-shell {color: #243c36; background: #f3f4eb; max-width: 560px; padding: 20px 20px 40px; margin: auto;}
.sm-shell nav {display: flex; justify-content: space-between; gap: 16px;}
.sm-shell a {color: #215f4e; display: inline-block; padding: 12px 0;}
.sm-shell nav a {min-width: 44px; text-align: center;}
.sm-shell h1 {font-size: clamp(27px, 7vw, 38px); margin: 16px 0 5px;}
.sm-kicker {margin: 0; color: #53665c;}
.sm-shell h2 {font-size: 22px; margin: 22px 0 12px;}
.sm-shell p, .sm-shell li {line-height: 1.5;}
.sm-grid {display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px;}
.sm-pad {font: inherit; min-height: 100px; border: 2px solid #71877a; border-radius: 16px; background: #fffef8; color: #243c36; touch-action: manipulation;}
.sm-pad > span {display: block; font-size: 32px; line-height: 1.2;}
.sm-pad small {display: block; font-size: 12px; margin-top: 9px;}
.sm-pad:disabled {opacity: 1; cursor: default;}
.sm-pad.sm-lit {background: #234f41; color: #fff; border: 5px double #fff; outline: 3px solid #234f41;}
.sm-pad:not(:disabled):active {background: #dbe9dd;}
.sm-action, .sm-secondary {font: inherit; font-weight: 650; min-height: 48px; padding: 12px 18px; border: 2px solid #234f41; border-radius: 12px; cursor: pointer; touch-action: manipulation;}
.sm-action {width: 100%; color: white; background: #234f41; margin-top: 12px;}
.sm-secondary {color: #234f41; background: transparent;}
.sm-shell :focus-visible {outline: 3px solid #a04415; outline-offset: 4px;}
.sm-cue {min-height: 24px; font-weight: 650;}
.sm-best {padding-top: 16px; border-top: 1px solid #c8d3c7;}
.sm-notice {font-size: 13px; color: #53665c;}
.sm-result {background: #e2eadc; border-radius: 16px; padding: 24px; text-align: center;}
.sm-result strong {display: block; font-size: 56px;}
.sm-result span {display: block;}
.sm-shell summary {min-height: 44px; padding: 12px 0; cursor: pointer; font-weight: 650;}
.sm-shell ol {padding-left: 24px;}
.sm-shell li {margin-bottom: 10px;}
@media (max-width: 360px) {.sm-shell {padding: 14px 12px 28px;}.sm-grid {gap: 8px;}.sm-pad {min-height: 90px;}.sm-pad small {font-size: 11px;}}
@media (prefers-reduced-motion: reduce) {* {scroll-behavior: auto;}}