.app-shell{min-height:100vh}body:has(main.dashboard-shell,main.practice-hub){background:var(--ui-canvas)}body:has(main.dashboard-shell,main.practice-hub):before{display:none}main.dashboard-shell,main.practice-hub{scroll-margin-top:6rem}.app-shell__header{z-index:40;border-bottom:1px solid var(--ui-border-subtle);background:var(--color-surface-strong);position:sticky;top:0}.app-shell__header-inner{align-items:center;gap:var(--ui-space-4);min-height:4.5rem;display:flex}.app-shell__brand{align-items:center;gap:var(--ui-space-3);min-width:0;color:var(--ui-text-primary);text-decoration:none;display:inline-flex}.app-shell__brand-mark{width:1.5rem;color:var(--ui-text-primary);flex:none;place-items:center;font-size:1.05rem;font-weight:700;display:grid}.app-shell__brand-title{overflow-wrap:anywhere;min-width:0;font-size:1rem;font-weight:700;line-height:1.2;display:block}.app-shell__primary-nav{align-items:center;gap:.15rem;min-width:0;margin-left:auto;display:flex}.app-shell__nav-link,.app-shell__utility-summary{min-height:2.75rem;color:var(--ui-text-muted);justify-content:center;align-items:center;font-size:.9rem;font-weight:700;text-decoration:none;display:inline-flex}.app-shell__nav-link{padding-inline:.85rem}.app-shell__nav-link:hover,.app-shell__nav-link.is-active,.app-shell__nav-group[open]>.app-shell__nav-summary,.app-shell__nav-group.is-current>.app-shell__nav-summary{color:var(--ui-text-primary);text-underline-offset:.35rem;text-decoration:underline;text-decoration-thickness:1px}.app-shell__nav-group:has(.app-shell__popover-link[aria-current=page])>.app-shell__nav-summary{color:var(--ui-text-primary);text-underline-offset:.35rem;text-decoration:underline;text-decoration-thickness:1px}.app-shell__nav-group,.app-shell__utility{position:relative}.app-shell__nav-summary,.app-shell__utility-summary{cursor:pointer;-webkit-user-select:none;user-select:none;list-style:none}.app-shell__nav-summary::-webkit-details-marker{display:none}.app-shell__utility-summary::-webkit-details-marker{display:none}.app-shell__nav-summary:after,.app-shell__utility-summary:after{content:"⌄";margin-left:.4rem;line-height:1}.app-shell__nav-group[open]>.app-shell__nav-summary:after,.app-shell__utility[open]>.app-shell__utility-summary:after{transform:rotate(180deg)}.app-shell__popover,.app-shell__utility-popover{z-index:60;border:1px solid var(--ui-border-strong);border-radius:var(--ui-radius-structural);background:var(--color-surface-strong);box-shadow:var(--ui-shadow-flat);position:absolute;top:calc(100% + .45rem)}.app-shell__popover{gap:.2rem;width:min(21rem,100vw - 2rem);min-width:0;padding:.45rem;display:grid;left:0}.app-shell__popover-link{overflow-wrap:anywhere;min-width:0;color:var(--ui-text-primary);border-left:2px solid #0000;gap:.2rem;padding:.7rem .75rem;text-decoration:none;display:grid}.app-shell__popover-link:hover,.app-shell__popover-link.is-active{border-left-color:var(--ui-action-primary);background:var(--ui-action-secondary-hover)}.app-shell__popover-title{font-size:.88rem;font-weight:700}.app-shell__popover-hint{color:var(--ui-text-muted);font-size:.77rem;line-height:1.4}.app-shell__utility{margin-left:.35rem}.app-shell__utility-summary{color:var(--ui-text-primary);padding-inline:.35rem}.app-shell__utility-summary:hover,.app-shell__utility[open]>.app-shell__utility-summary{text-underline-offset:.35rem;text-decoration:underline;text-decoration-thickness:1px}.app-shell__utility-popover{width:14rem;padding:.45rem;display:grid;right:0}.app-shell__theme-control{justify-content:space-between;align-items:center;gap:var(--ui-space-3);min-height:2.75rem;color:var(--ui-text-muted);padding:.3rem .3rem .3rem .7rem;font-size:.85rem;font-weight:700;display:flex}.app-shell__theme-control .theme-toggle{border:1px solid var(--ui-border-subtle);border-radius:var(--ui-radius-structural);min-height:2.25rem;color:var(--ui-text-primary);background:0 0;padding:.45rem .7rem}.page-header{gap:var(--ui-space-5);border-bottom:1px solid var(--ui-border-strong);padding-block:var(--ui-space-5);grid-template-columns:minmax(0,1fr) auto;align-items:end;display:grid}.page-header__content{min-width:0}.page-header__title{max-width:24ch;color:var(--ui-text-primary);font-family:var(--ui-font-workspace);font-size:clamp(2rem, 4vw, var(--ui-type-page));letter-spacing:-.035em;font-weight:700;line-height:var(--ui-leading-tight);margin:.45rem 0 0}.page-header__description{max-width:48rem;margin:var(--ui-space-3) 0 0;color:var(--ui-text-muted);font-size:var(--ui-type-body);line-height:var(--ui-leading-body)}.page-header__actions{justify-content:flex-end;gap:var(--ui-space-2);flex-wrap:wrap;display:flex}@media (width<=900px){.app-shell__header-inner{gap:var(--ui-space-3);grid-template-columns:minmax(0,1fr) auto;padding-block:.8rem;display:grid}.app-shell__brand{grid-area:1/1}.app-shell__primary-nav{grid-area:2/1/auto/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:.25rem;width:100%;margin-left:0;display:grid}.app-shell__nav-link{overflow-wrap:anywhere;text-align:center;width:100%;min-width:0;min-height:2.75rem;padding-inline:.35rem}.app-shell__nav-summary{overflow-wrap:anywhere;text-align:center;justify-content:center;align-items:center;width:100%;min-width:0;display:inline-flex}.app-shell__nav-group{min-width:0;position:static}.app-shell__popover{width:auto;left:0;right:0}.app-shell__utility{grid-area:1/2;justify-self:end;margin-left:0}.page-header{grid-template-columns:minmax(0,1fr);align-items:start}.page-header__actions{justify-content:flex-start}}@media (width<=420px){.app-shell__nav-link{font-size:.82rem}.app-shell__nav-summary:after{margin-left:.2rem}}.replay-import-page{min-width:0}.replay-import-shell{gap:var(--ui-space-6);align-items:start;display:grid}.replay-import-primary,.replay-import-support{min-width:0}.replay-import-primary{gap:var(--ui-space-6);display:grid}.replay-import-form{gap:var(--ui-space-5);max-width:46rem;display:grid}.replay-import-form__heading,.replay-import-form__field{gap:var(--ui-space-2);display:grid}.replay-import-form__field label{color:var(--ui-text-primary);font-size:var(--ui-type-body);font-weight:700}.replay-import-form__field input{width:100%;min-height:2.9rem}.replay-import-form__error{color:var(--color-danger);font-size:var(--ui-type-body);line-height:var(--ui-leading-body);margin:0}.replay-import-form__actions,.replay-study-queue-row__actions{gap:var(--ui-space-3);flex-wrap:wrap;display:flex}.replay-import-disclosure{border-top:1px solid var(--ui-border-subtle);min-width:0;padding-top:var(--ui-space-4)}.replay-import-disclosure>summary{justify-content:space-between;align-items:center;gap:var(--ui-space-3);color:var(--ui-text-primary);cursor:pointer;font-size:var(--ui-type-body);font-weight:700;list-style:none;display:flex}.replay-import-disclosure>summary::-webkit-details-marker{display:none}.replay-import-disclosure>summary:after{color:var(--ui-text-muted);content:"+";flex:none;font-size:1.1rem;line-height:1}.replay-import-disclosure[open]>summary:after{content:"−"}.replay-import-disclosure>summary:focus-visible,.replay-study-queue-items>summary:focus-visible{outline-offset:4px;outline:2px solid}.replay-disclosure-meta{color:var(--ui-text-muted);font-size:var(--ui-type-label);font-weight:600}.replay-access-disclosure{max-width:46rem}.replay-access-disclosure>[aria-label=Mahjong\ Soul]{margin-top:var(--ui-space-4)}.replay-storage-body{min-width:0;padding-top:var(--ui-space-5)}.replay-import-status{border-top:1px solid var(--ui-border-subtle);min-width:0;padding-top:var(--ui-space-5)}.replay-import-status__quiet{max-width:32rem;color:var(--ui-text-muted);font-size:var(--ui-type-body);line-height:var(--ui-leading-body)}.replay-import-success-flow{gap:var(--ui-space-6);margin-top:var(--ui-space-6);display:grid}.replay-import-success,.replay-study-queues{border-top:1px solid var(--ui-border-subtle);min-width:0;padding-top:var(--ui-space-5)}.replay-study-queues{scroll-margin-top:var(--ui-space-5)}.replay-study-queue-list{gap:var(--ui-space-4);margin:var(--ui-space-4) 0 0;padding:0;list-style:none;display:grid}.replay-study-queue-row{gap:var(--ui-space-4);border-bottom:1px solid var(--ui-border-soft);padding-bottom:var(--ui-space-4);grid-template-columns:minmax(0,1fr) auto;align-items:start;display:grid}.replay-study-queue-row:last-child{border-bottom:0;padding-bottom:0}.replay-study-queue-row__actions{justify-content:flex-end}.replay-study-queue-items{color:var(--ui-text-muted)}.replay-study-queue-items>summary{color:var(--ui-text-primary);font-size:var(--ui-type-body)}.replay-hands-list{margin-top:var(--ui-space-4)}.replay-import-support{padding-top:var(--ui-space-1)}@media (width>=900px){.replay-import-shell{grid-template-columns:minmax(0,1.35fr) minmax(18rem,.65fr)}}@media (width<=899px){.replay-import-support{width:100%}}@media (width<=640px){.replay-study-queue-row{grid-template-columns:minmax(0,1fr)}.replay-study-queue-row__actions{justify-content:flex-start}}.practice-hub{max-width:78rem}.practice-hub__modes{max-width:58rem;margin-top:var(--ui-space-6)}.practice-hub__section-heading{padding-bottom:var(--ui-space-4);border-bottom:1px solid var(--ui-border-soft)}.practice-mode-list{border-top:1px solid var(--ui-border-strong);margin-bottom:0;padding:0;list-style:none}.practice-mode-list li{border-bottom:1px solid var(--ui-border-soft)}.practice-mode-link{gap:var(--ui-space-3);min-height:4.25rem;padding-block:var(--ui-space-3);color:var(--ui-text-primary);grid-template-columns:minmax(10rem,.8fr) minmax(0,1.7fr) auto auto;align-items:center;display:grid}.practice-mode-link:hover{background:color-mix(in srgb, var(--ui-action-secondary-hover) 58%, transparent)}.practice-mode-link__label{font-weight:700}.practice-mode-link__purpose,.practice-mode-link__time{color:var(--ui-text-muted);font-size:.88rem;line-height:1.4}.practice-mode-link__time{white-space:nowrap;font-variant-numeric:tabular-nums}.practice-mode-link__arrow{color:var(--ui-text-muted);font-size:1.2rem}.practice-replay-bridge{justify-content:space-between;align-items:end;gap:var(--ui-space-5);max-width:58rem;margin-top:var(--ui-space-7);border-top:1px solid var(--ui-border-strong);padding-top:var(--ui-space-5);display:flex}@media (width<=900px){.practice-mode-link{grid-template-columns:minmax(0,1fr) auto}.practice-mode-link__purpose{grid-area:2/1}.practice-mode-link__time{grid-area:2/2}.practice-mode-link__arrow{grid-area:1/2}.practice-replay-bridge{flex-direction:column;align-items:start}}