#tutorial-selection-dialog { width: min(540px,calc(100vw - 24px)); height: min(1060px,calc(100dvh - 32px)); max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; }
#tutorial-selection-dialog[open] { display: grid; grid-template-rows: 64px minmax(0,1fr) auto; }
.tutorial-selection-header { position: relative; height: 64px; display: grid; place-items: center; border-bottom: 1px solid var(--kit-rule); padding: 0 60px; }
.tutorial-selection-header .sheet-title { margin: 0; padding: 0; text-align: center; font-size: 22px; }
.tutorial-selection-scroll { min-height: 0; overflow-y: auto; overscroll-behavior: contain; touch-action: pan-y; padding: 0 24px; scrollbar-width: thin; }
.tutorial-selection-row { display: grid; grid-template-columns: 34px minmax(42px,1fr) 126px 76px; gap: 12px; align-items: center; min-height: 100px; padding: 14px 0; border-bottom: 1px solid var(--kit-rule); }
.tutorial-selection-launch { display: grid; place-items: center; min-width: 0; min-height: 44px; padding: 8px 6px; border: 1px solid #aa8545; border-radius: 7px; color: var(--kit-ink,#292724); background: linear-gradient(180deg,#f4f0e6,#f4f0e6); font: 650 14px var(--font-ui); touch-action: pan-y; }
.tutorial-selection-launch:disabled { opacity: .35; filter: saturate(.25); cursor: default; }
.tutorial-selection-number { font-size: 23px; color: var(--kit-quiet-ink,#706b63); font-family: var(--font-ui); font-weight: 650; text-align: center; }
.tutorial-selection-name { font: 650 18px var(--font-ui); color: var(--kit-ink,#292724); white-space: nowrap; }
.tutorial-selection-row[data-locked="true"] > .tutorial-selection-number,.tutorial-selection-row[data-locked="true"] > .tutorial-selection-name { opacity: .48; }
.tutorial-selection-rewards { display: grid; grid-template-columns: repeat(2,60px); gap: 6px; }
.tutorial-selection-rewards > :only-child { grid-column: 2; }
.tutorial-selection-rewards .reward-entry { width: 60px; min-width: 0; }
.tutorial-selection-rewards .reward-icon { width: 56px; height: 56px; }
.tutorial-selection-footer { padding: 14px 24px 26px; }
.tutorial-selection-footer button { width: 100%; min-height: 52px; font-size: 15px; }
@media(max-width:480px) { .tutorial-selection-scroll { padding: 0 16px; }.tutorial-selection-row { grid-template-columns: 28px minmax(36px,1fr) 102px 62px; gap: 6px; }.tutorial-selection-name { font-size: 16px; }.tutorial-selection-launch { font-size: 13px; }.tutorial-selection-rewards { grid-template-columns: repeat(2,48px); }.tutorial-selection-rewards .reward-entry { width: 48px; }.tutorial-selection-rewards .reward-icon { width: 46px; height: 46px; } }


/* Unavailable tutorial actions explain why when tapped; the detail setting is
   absent because lessons always show the revealed card in detail. */
#auto[aria-disabled="true"]:not(:disabled){opacity:.42;filter:saturate(.35);cursor:default}
#explain-toggle[hidden]{display:none}

#tutorial-selection-dialog{color:var(--kit-ink,#292724);color-scheme:light}
