/* THPT Practice Hub — Google Material 3 + smooth natural scrolling */
html:has(.thpt-practice-page){scroll-behavior:auto!important;background:#f8fafd!important}
html:has(.thpt-practice-page) body,
html:has(.thpt-practice-page) #root,
html:has(.thpt-practice-page) .app-shell,
html:has(.thpt-practice-page) .metro-clean-system,
html:has(.thpt-practice-page) main.wp8-page-stage{max-width:none!important;transform:none!important;scale:none!important;zoom:1!important;perspective:none!important;filter:none!important}
html:has(.thpt-practice-page) main.wp8-page-stage{width:100%!important;overflow:visible!important;background:#f8fafd!important}
html:has(.thpt-practice-page) body{background:#f8fafd!important;background-attachment:scroll!important}

html body #root .thpt-practice-page{
 --g-blue:#0b57d0;--g-blue-hover:#0842a0;--g-blue-soft:#e8f0fe;
 --g-green:#137333;--g-green-soft:#e6f4ea;--g-yellow:#b06000;--g-yellow-soft:#fef7e0;
 --g-red:#b3261e;--g-red-soft:#fce8e6;--g-purple-soft:#f3e8fd;
 --g-ink:#202124;--g-muted:#5f6368;--g-line:#dadce0;--g-line-soft:#e8eaed;
 width:min(1480px,calc(100vw - 48px))!important;max-width:1480px!important;min-width:0!important;
 margin:0 auto!important;padding:30px 0 88px!important;color:var(--g-ink)!important;background:transparent!important;
 transform:none!important;animation:none!important;transition:none!important;scroll-behavior:auto!important
}
html body #root .thpt-practice-page *,.thpt-player *{box-sizing:border-box}

/* Hero */
html body #root .thpt-practice-page .thpt-hero{
 position:relative!important;isolation:isolate;display:grid!important;grid-template-columns:minmax(0,1.45fr) minmax(360px,.55fr)!important;
 gap:32px!important;align-items:center!important;min-height:330px!important;padding:clamp(30px,4vw,54px)!important;overflow:hidden!important;
 border:1px solid #c4d7f5!important;border-radius:32px!important;background:linear-gradient(135deg,#e8f0fe 0%,#f6f9ff 58%,#e6f4ea 100%)!important;
 box-shadow:0 1px 2px rgba(60,64,67,.08),0 8px 24px rgba(60,64,67,.08)!important;transform:none!important;animation:none!important
}
html body #root .thpt-practice-page .thpt-hero:before,html body #root .thpt-practice-page .thpt-hero:after{content:"";position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
html body #root .thpt-practice-page .thpt-hero:before{width:380px;height:380px;right:-145px;top:-180px;background:rgba(66,133,244,.11)}
html body #root .thpt-practice-page .thpt-hero:after{width:260px;height:260px;right:250px;bottom:-190px;background:rgba(52,168,83,.1)}
html body #root .thpt-practice-page .eyebrow{width:max-content!important;max-width:100%!important;display:inline-flex!important;align-items:center!important;min-height:32px!important;padding:0 13px!important;border:1px solid #a8c7fa!important;border-radius:999px!important;background:rgba(255,255,255,.78)!important;color:#174ea6!important;font-size:.77rem!important;font-weight:700!important;letter-spacing:.055em!important}
html body #root .thpt-practice-page .thpt-hero-copy h1{max-width:820px!important;margin:18px 0 14px!important;color:var(--g-ink)!important;font-size:clamp(3.3rem,5.6vw,6rem)!important;font-weight:560!important;line-height:.94!important;letter-spacing:-.06em!important;text-wrap:balance}
html body #root .thpt-practice-page .thpt-hero-copy p{max-width:820px!important;margin:0!important;color:#46515f!important;font-size:clamp(1rem,1.35vw,1.16rem)!important;line-height:1.62!important}
html body #root .thpt-practice-page .thpt-hero-actions{display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:10px!important;margin-top:24px!important}
html body #root .thpt-practice-page button,html body #root .thpt-practice-page select,html body #root .thpt-practice-page input,html body #root .thpt-practice-page textarea{font:inherit!important}
html body #root .thpt-practice-page button{box-shadow:none!important;transform:none!important;transition:background-color .15s ease,border-color .15s ease,color .15s ease!important}
html body #root .thpt-practice-page .thpt-hero-actions button,html body #root .thpt-practice-page .thpt-toolbar>button,html body #root .thpt-practice-page .thpt-card-actions button,html body #root .thpt-practice-page .thpt-modal footer button{min-height:44px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;padding:0 18px!important;border:1px solid var(--g-line)!important;border-radius:999px!important;background:#fff!important;color:#174ea6!important;font-weight:650!important}
html body #root .thpt-practice-page .primary{border-color:var(--g-blue)!important;background:var(--g-blue)!important;color:#fff!important}
html body #root .thpt-practice-page .primary:hover{border-color:var(--g-blue-hover)!important;background:var(--g-blue-hover)!important}
html body #root .thpt-practice-page .thpt-hero-actions>span{flex-basis:100%;color:var(--g-muted)!important;font-size:.82rem!important;font-weight:550!important}
html body #root .thpt-practice-page .thpt-stat-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:12px!important;align-content:center!important}
html body #root .thpt-practice-page .thpt-stat-grid article{min-height:112px!important;display:grid!important;align-content:center!important;gap:8px!important;padding:20px!important;border:1px solid rgba(95,99,104,.18)!important;border-radius:22px!important;background:rgba(255,255,255,.86)!important;box-shadow:none!important}
html body #root .thpt-practice-page .thpt-stat-grid article:nth-child(1){background:rgba(232,240,254,.94)!important}html body #root .thpt-practice-page .thpt-stat-grid article:nth-child(2){background:rgba(230,244,234,.94)!important}html body #root .thpt-practice-page .thpt-stat-grid article:nth-child(3){background:rgba(254,247,224,.96)!important}html body #root .thpt-practice-page .thpt-stat-grid article:nth-child(4){background:rgba(243,232,253,.94)!important}
html body #root .thpt-practice-page .thpt-stat-grid strong{color:var(--g-ink)!important;font-size:clamp(1.9rem,2.5vw,2.6rem)!important;font-weight:560!important;line-height:1!important}
html body #root .thpt-practice-page .thpt-stat-grid span{margin:0!important;color:var(--g-muted)!important;font-size:.75rem!important;font-weight:650!important;letter-spacing:.035em!important;text-transform:uppercase!important}

/* Summary and toolbar */
html body #root .thpt-practice-page .thpt-notice{margin:18px 0 0!important;padding:14px 16px!important;border:1px solid #a8c7fa!important;border-radius:16px!important;background:var(--g-blue-soft)!important;color:#174ea6!important;box-shadow:none!important}
html body #root .thpt-practice-page .thpt-source-summary{display:grid!important;grid-template-columns:minmax(230px,.72fr) minmax(230px,.72fr) minmax(320px,1.5fr)!important;gap:12px!important;margin:22px 0 0!important;padding:0!important;border:0!important;background:transparent!important}
html body #root .thpt-practice-page .thpt-source-summary>div,html body #root .thpt-practice-page .thpt-source-summary>p{min-height:72px!important;margin:0!important;padding:14px 16px!important;border:1px solid var(--g-line)!important;border-radius:18px!important;background:#fff!important;box-shadow:none!important}
html body #root .thpt-practice-page .thpt-source-summary>div{display:grid!important;grid-template-columns:auto auto minmax(0,1fr)!important;align-items:center!important;gap:10px!important}
html body #root .thpt-practice-page .thpt-source-summary>p{display:flex!important;align-items:center!important;border-color:#c4d7f5!important;background:#f4f8ff!important;color:#3c4858!important;font-weight:550!important;line-height:1.45!important}
html body #root .thpt-practice-page .thpt-source-summary strong{font-size:1.6rem!important;font-weight:560!important}html body #root .thpt-practice-page .thpt-source-summary small{color:var(--g-muted)!important;font-weight:550!important}
html body #root .thpt-practice-page .thpt-source-dot{width:12px!important;height:12px!important;border:0!important;box-shadow:0 0 0 5px rgba(26,115,232,.1)!important}.thpt-source-dot.resource{background:#1a73e8!important}.thpt-source-dot.hub{background:#f9ab00!important;box-shadow:0 0 0 5px rgba(249,171,0,.12)!important}
html body #root .thpt-practice-page .thpt-toolbar{display:grid!important;grid-template-columns:minmax(220px,1fr) minmax(220px,1fr) auto!important;gap:10px!important;align-items:center!important;margin:22px 0 0!important;padding:12px!important;border:1px solid var(--g-line)!important;border-radius:22px!important;background:#fff!important;box-shadow:0 1px 2px rgba(60,64,67,.08)!important}
html body #root .thpt-practice-page .thpt-search{display:none!important}
html body #root .thpt-practice-page .thpt-toolbar select{width:100%!important;min-height:48px!important;padding:0 42px 0 15px!important;border:1px solid var(--g-line)!important;border-radius:14px!important;background-color:#fff!important;color:var(--g-ink)!important;outline:none!important}
html body #root .thpt-practice-page .thpt-toolbar select:focus{border-color:var(--g-blue)!important;box-shadow:0 0 0 3px rgba(11,87,208,.14)!important}
html body #root .thpt-practice-page .thpt-toolbar>button{min-width:150px!important;border-color:#a8c7fa!important;background:var(--g-blue-soft)!important;color:#174ea6!important}

/* Lesson cards — page scroll only, no nested scroller */
html body #root .thpt-practice-page .thpt-library-heading{display:flex!important;align-items:end!important;justify-content:space-between!important;gap:20px!important;margin:34px 2px 16px!important}
html body #root .thpt-practice-page .thpt-library-heading .eyebrow{min-height:28px!important;padding:0!important;border:0!important;background:transparent!important;color:#1967d2!important}
html body #root .thpt-practice-page .thpt-library-heading h2{margin:5px 0 0!important;color:var(--g-ink)!important;font-size:clamp(2rem,3vw,3rem)!important;font-weight:560!important;letter-spacing:-.04em!important}
html body #root .thpt-practice-page .thpt-library-heading>small{padding:8px 12px!important;border-radius:999px!important;background:#f1f3f4!important;color:var(--g-muted)!important;font-weight:650!important}
html body #root .thpt-practice-page .thpt-card-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important;max-height:none!important;min-height:0!important;overflow:visible!important;overscroll-behavior:auto!important;scrollbar-gutter:auto!important;padding:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
html body #root .thpt-practice-page .thpt-lesson-card{position:relative!important;display:grid!important;grid-template-columns:58px minmax(0,1fr)!important;grid-template-areas:"top copy" "meta meta" "owner owner" "review review" "actions actions"!important;gap:12px 16px!important;align-content:start!important;min-width:0!important;min-height:300px!important;padding:20px!important;overflow:hidden!important;border:1px solid var(--g-line)!important;border-radius:24px!important;background:#fff!important;box-shadow:0 1px 2px rgba(60,64,67,.08)!important;transform:none!important;animation:none!important;transition:border-color .15s ease,background-color .15s ease!important;content-visibility:auto;contain-intrinsic-size:320px;contain:layout paint style}
html body #root .thpt-practice-page .thpt-lesson-card:before{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--g-blue)}
html body #root .thpt-practice-page .thpt-lesson-card:hover,html body #root .thpt-practice-page .thpt-lesson-card:focus-within{border-color:#a8c7fa!important;background:#fbfdff!important;transform:none!important}
html body #root .thpt-practice-page .thpt-lesson-card.status-pending{background:#fffdf7!important}.thpt-lesson-card.status-pending:before{background:#f9ab00!important}.thpt-lesson-card.status-revision:before{background:#e8710a!important}.thpt-lesson-card.status-rejected:before{background:#d93025!important}.thpt-lesson-card.is-resource-linked{border-color:#c4d7f5!important;background:#f8fbff!important}
html body #root .thpt-practice-page .thpt-card-top{grid-area:top!important;display:block!important}.thpt-card-icon{width:52px!important;height:52px!important;display:grid!important;place-items:center!important;border-radius:16px!important;background:var(--g-blue-soft)!important;color:#174ea6!important;font-size:.86rem!important;font-weight:750!important;box-shadow:none!important}.is-resource-linked .thpt-card-icon{background:var(--g-green-soft)!important;color:var(--g-green)!important}
html body #root .thpt-practice-page .thpt-card-badges{position:absolute!important;top:18px!important;right:18px!important;display:flex!important;flex-direction:row!important;align-items:center!important;flex-wrap:wrap!important;justify-content:flex-end!important;gap:6px!important;max-width:calc(100% - 110px)!important}
html body #root .thpt-practice-page .thpt-status,html body #root .thpt-practice-page .thpt-source-badge{display:inline-flex!important;align-items:center!important;min-height:28px!important;padding:0 10px!important;border:0!important;border-radius:999px!important;font-size:.69rem!important;font-weight:700!important;letter-spacing:.025em!important;text-transform:none!important;white-space:nowrap!important}
.thpt-status.status-approved{background:var(--g-green-soft)!important;color:var(--g-green)!important}.thpt-status.status-pending{background:var(--g-yellow-soft)!important;color:var(--g-yellow)!important}.thpt-status.status-revision{background:#fff0e0!important;color:#a14200!important}.thpt-status.status-rejected{background:var(--g-red-soft)!important;color:var(--g-red)!important}.thpt-source-badge{background:var(--g-blue-soft)!important;color:#174ea6!important}
html body #root .thpt-practice-page .thpt-card-copy{grid-area:copy!important;min-width:0!important;margin:0!important;padding:2px 0 0!important}.thpt-card-copy>small{display:block!important;max-width:calc(100% - 145px)!important;overflow:hidden!important;color:#1967d2!important;font-size:.73rem!important;font-weight:700!important;letter-spacing:.045em!important;text-overflow:ellipsis!important;text-transform:uppercase!important;white-space:nowrap!important}.thpt-card-copy h3{margin:7px 0 8px!important;color:var(--g-ink)!important;font-size:clamp(1.25rem,1.8vw,1.55rem)!important;font-weight:620!important;line-height:1.2!important;letter-spacing:-.03em!important;display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}.thpt-card-copy p{margin:0!important;color:var(--g-muted)!important;font-size:.9rem!important;line-height:1.5!important;-webkit-line-clamp:2!important}
html body #root .thpt-practice-page .thpt-meta{grid-area:meta!important;display:flex!important;flex-wrap:wrap!important;gap:7px!important;margin:2px 0 0!important}.thpt-meta span{min-height:28px!important;display:inline-flex!important;align-items:center!important;padding:0 10px!important;border:0!important;border-radius:999px!important;background:#f1f3f4!important;color:#3c4043!important;font-size:.72rem!important;font-weight:600!important}
html body #root .thpt-practice-page .thpt-owner{grid-area:owner!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;min-width:0!important;margin:0!important;padding:12px 0 0!important;border:0!important;border-top:1px solid var(--g-line-soft)!important}.thpt-owner span{min-width:0!important;overflow:hidden!important;color:#3c4043!important;font-size:.82rem!important;font-weight:650!important;text-overflow:ellipsis!important;white-space:nowrap!important}.thpt-owner small{flex:0 0 auto!important;color:#80868b!important;font-size:.74rem!important;white-space:nowrap!important}
html body #root .thpt-practice-page .thpt-review-note{grid-area:review!important;margin:0!important;padding:11px 13px!important;border:0!important;border-radius:12px!important;background:var(--g-yellow-soft)!important;color:#6f4e00!important;font-size:.8rem!important;line-height:1.45!important}
html body #root .thpt-practice-page .thpt-card-actions{grid-area:actions!important;display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:7px!important;margin:auto 0 0!important;padding:14px 0 0!important;border:0!important;border-top:1px solid var(--g-line-soft)!important}.thpt-card-actions button{min-height:38px!important;padding:0 13px!important;font-size:.78rem!important}.thpt-card-actions button.primary{margin-right:auto!important}.thpt-card-actions .approve{border-color:#b7dfc3!important;background:var(--g-green-soft)!important;color:var(--g-green)!important}.thpt-card-actions .danger-text{border-color:transparent!important;background:transparent!important;color:var(--g-red)!important}
html body #root .thpt-practice-page .thpt-empty{grid-column:1/-1!important;min-height:360px!important;display:grid!important;place-content:center!important;padding:48px!important;border:1px dashed #a8c7fa!important;border-radius:24px!important;background:#f8fbff!important;box-shadow:none!important}

/* Modals and player: reduce GPU-heavy effects */
html body #root .thpt-practice-page .thpt-modal-backdrop{padding:20px!important;background:rgba(32,33,36,.6)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html body #root .thpt-practice-page .thpt-modal{width:min(920px,calc(100vw - 32px))!important;max-height:min(880px,calc(100dvh - 32px))!important;overflow:hidden!important;border:1px solid var(--g-line)!important;border-radius:28px!important;background:#fff!important;box-shadow:0 24px 64px rgba(32,33,36,.24)!important}.thpt-modal>header{padding:24px 26px 20px!important;border-bottom:1px solid var(--g-line-soft)!important;background:#f8fafd!important}.thpt-modal>header h2{color:var(--g-ink)!important;font-size:2rem!important;font-weight:560!important}.thpt-modal>header p{color:var(--g-muted)!important}.thpt-modal>header>button{width:40px!important;height:40px!important;padding:0!important;border:0!important;border-radius:50%!important;background:#f1f3f4!important;color:var(--g-ink)!important}
.thpt-form-grid input,.thpt-form-grid select,.thpt-form-grid textarea{border:1px solid var(--g-line)!important;border-radius:12px!important;background:#fff!important;color:var(--g-ink)!important;outline:none!important}.thpt-form-grid input:focus,.thpt-form-grid select:focus,.thpt-form-grid textarea:focus{border-color:var(--g-blue)!important;box-shadow:0 0 0 3px rgba(11,87,208,.12)!important}.thpt-file-field,.thpt-form-note{border-color:#a8c7fa!important;border-radius:14px!important;background:#f4f8ff!important}.thpt-modal footer{border-top:1px solid var(--g-line-soft)!important;background:#fff!important}
html body #root .thpt-player{width:min(1500px,calc(100vw - 32px))!important;height:calc(100dvh - 118px)!important;min-height:620px!important;margin:18px auto 40px!important;overflow:hidden!important;border:1px solid #dadce0!important;border-radius:24px!important;background:#fff!important;box-shadow:0 8px 28px rgba(60,64,67,.12)!important}.thpt-player-bar{height:72px!important;border-bottom:1px solid #e8eaed!important;background:#fff!important}.thpt-player-bar button{min-height:40px!important;padding:0 14px!important;border:1px solid #dadce0!important;border-radius:999px!important;background:#fff!important;color:#174ea6!important;box-shadow:none!important}.thpt-player-bar button.primary{border-color:#0b57d0!important;background:#0b57d0!important;color:#fff!important}.thpt-player-title>span{border-radius:14px!important;background:#e8f0fe!important;color:#174ea6!important}.thpt-player iframe{contain:strict}

@media(min-width:1600px){html body #root .thpt-practice-page .thpt-card-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:1100px){html body #root .thpt-practice-page{width:min(100% - 28px,1000px)!important}.thpt-practice-page .thpt-hero{grid-template-columns:1fr!important}.thpt-practice-page .thpt-stat-grid{grid-template-columns:repeat(4,minmax(0,1fr))!important}.thpt-practice-page .thpt-stat-grid article{min-height:92px!important}.thpt-practice-page .thpt-source-summary{grid-template-columns:repeat(2,minmax(0,1fr))!important}.thpt-practice-page .thpt-source-summary>p{grid-column:1/-1!important}}
@media(max-width:780px){html body #root .thpt-practice-page{width:calc(100% - 20px)!important;padding-top:16px!important}.thpt-practice-page .thpt-hero{min-height:0!important;padding:24px 20px!important;border-radius:24px!important}.thpt-practice-page .thpt-hero-copy h1{font-size:clamp(2.8rem,13vw,4.5rem)!important}.thpt-practice-page .thpt-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.thpt-practice-page .thpt-source-summary,.thpt-practice-page .thpt-toolbar,.thpt-practice-page .thpt-card-grid{grid-template-columns:1fr!important}.thpt-practice-page .thpt-toolbar>button{width:100%!important}.thpt-practice-page .thpt-library-heading{align-items:flex-start!important;flex-direction:column!important}.thpt-practice-page .thpt-lesson-card{min-height:0!important}.thpt-practice-page .thpt-card-badges{position:static!important;max-width:none!important;margin-top:10px!important;justify-content:flex-start!important}.thpt-practice-page .thpt-card-copy>small{max-width:100%!important}.thpt-practice-page .thpt-owner{align-items:flex-start!important;flex-direction:column!important}.thpt-practice-page .thpt-owner small{white-space:normal!important}.thpt-player{width:100vw!important;height:100dvh!important;min-height:0!important;margin:0!important;border:0!important;border-radius:0!important}}
@media(prefers-reduced-motion:reduce){html body #root .thpt-practice-page *,html body #root .thpt-player *{scroll-behavior:auto!important;animation:none!important;transition:none!important}}
