/* v164: guide resources as actual illustrated columns */
.site-core-resources{display:none!important}
.rv-resource-column{min-width:0;padding:14px;border:1px solid #d9dfed;border-radius:12px;background:linear-gradient(150deg,#f7faff,#fff)}
.rv-resource-column h3{margin:0 0 9px!important;color:#243650;font:700 15px/1.4 Inter,sans-serif}
.rv-resource-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.rv-resource-card{min-width:0;display:flex!important;flex-direction:column;align-items:center;gap:6px;padding:8px 5px!important;min-height:94px;border:1px solid #dce2eb;border-radius:9px;background:white;text-decoration:none!important;color:#27364b!important;box-shadow:0 2px 6px rgba(27,40,60,.07);transition:transform .16s,box-shadow .16s,border-color .16s;cursor:zoom-in}
.rv-resource-card:hover,.rv-resource-card:focus-visible{transform:translateY(-2px);border-color:#6482ae;box-shadow:0 5px 15px rgba(27,40,60,.16)}
.rv-resource-card img{display:block!important;max-width:100%!important;width:100%!important;height:55px!important;object-fit:contain!important;border-radius:4px!important;background:#f2f4f7}
.rv-resource-card span{display:block;text-align:center;font:650 11px/1.25 Inter,sans-serif!important;overflow-wrap:anywhere}
.rv-resource-card.rv-image-missing img{display:none!important}
.rv-resource-card.rv-image-missing:before{content:'▤';display:block;font-size:30px;color:#6c7894}
.p1-landing-guide .gdd-grid,.rv-has-resources{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.p1-landing-guide .rv-resource-column{padding:12px}
.rv-has-resources .rv-resource-column{height:100%;box-sizing:border-box;align-self:stretch}
.home-skill-table .rv-table-resources{min-width:200px;width:225px;vertical-align:top}
.home-skill-table .rv-resource-card{min-height:86px}
.rv-fixed-hover{position:fixed!important;z-index:2147482900!important;box-sizing:border-box!important;pointer-events:none!important;background:#fff!important;border:1px solid #cbd4e5!important;border-radius:12px!important;padding:12px!important;box-shadow:0 20px 55px rgba(10,22,40,.35)!important}
.rv-fixed-hover[hidden]{display:none!important}
.rv-fixed-hover img{display:block!important;width:100%!important;height:240px!important;object-fit:contain!important;background:#f7f9fc!important}
.rv-fixed-hover div{font:650 12px/1.4 Inter,sans-serif;color:#243650;padding-top:7px}
.site-resource-dialog{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;max-width:none!important;max-height:none!important;margin:0!important;padding:16px!important;box-sizing:border-box!important;border:0!important;background:rgba(12,20,31,.88)!important;color:#fff!important;z-index:2147483000!important;overflow:hidden!important}
.site-resource-dialog::backdrop{background:rgba(12,20,31,.88)!important}
.site-resource-dialog[open]{display:flex!important;flex-direction:column!important;gap:12px!important}
.site-resource-dialog .rv-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;flex-shrink:0}
.site-resource-dialog .rv-title{font:650 16px/1.5 Inter,sans-serif;margin-right:auto}
.site-resource-dialog button,.site-resource-dialog .rv-open{background:#fff;color:#1e2e3e;padding:9px 13px;border:0;border-radius:7px;font:650 14px/1.3 Inter,sans-serif;cursor:pointer;text-decoration:none}
.site-resource-dialog .rv-stage{flex:1;min-height:0;overflow:auto;display:flex;align-items:flex-start;justify-content:center;overscroll-behavior:contain}
.site-resource-dialog .rv-stage img{display:block;max-width:none;max-height:none;height:auto;margin:auto;cursor:zoom-in;background:white}
.site-resource-dialog .rv-hint{font:12px/1.4 Inter,sans-serif;color:#e5e5e5;margin:0}
@media(max-width:900px){.p1-landing-guide .gdd-grid,.rv-has-resources{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:600px){.p1-landing-guide .gdd-grid,.rv-has-resources{grid-template-columns:1fr!important}.rv-fixed-hover{display:none!important}.home-skill-table .rv-table-resources{min-width:140px;width:auto}.rv-resource-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* Keep the new resources column alongside each landing stage on desktop. */
body main .p2-landing-route.rv-has-resources{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
#ioLanding .io-route.rv-has-resources{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important}
@media(max-width:1050px){body main .p2-landing-route.rv-has-resources,#ioLanding .io-route.rv-has-resources{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:700px){body main .p2-landing-route.rv-has-resources,#ioLanding .io-route.rv-has-resources{grid-template-columns:1fr!important}}

/* v165: genuine side-by-side fourth column; match stage cards, no cream resource strip. */
@media(min-width:1021px){
 body .p1-start-row:has(.p1-landing-guide){display:grid!important;grid-template-columns:minmax(0,1fr)!important}
 body .p1-start-row:has(.p1-landing-guide) .p1-walkthrough{max-width:560px!important;width:100%!important;justify-self:center!important}
 body .p1-start-row .p1-landing-guide{grid-column:1/-1!important;width:100%!important;box-sizing:border-box!important}
 body .p1-start-row .p1-landing-guide .gdd-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:stretch!important}
 body #landingContent .p2-landing-route.rv-has-resources,
 body main .hl-landing .p2-landing-route.rv-has-resources,
 body #ioLanding .io-route.rv-has-resources{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;align-items:stretch!important}
}
/* Resources are a peer card: identical surface/border radius to the three stage cards. */
body .p1-landing-guide .rv-resource-column{background:#223449!important;border:1px solid #ffffff30!important;border-radius:6px!important;color:#fff!important;box-shadow:none!important;padding:12px!important}
body .p1-landing-guide .rv-resource-column h3{color:#e0c77a!important;font-size:18px!important;font-weight:750!important;margin:0 0 8px!important}
body #landingContent .p2-landing-route>.rv-resource-column,
body #ioLanding .io-route>.rv-resource-column{
 background:#f6f4f1!important;color:#1e2e3e!important;
 border:1px solid #d8dde3!important;border-radius:14px!important;
 box-shadow:inset 0 1px 0 #ffffffb0,0 3px 0 #00000020,0 4px 10px #00000012!important;
 padding:16px!important;min-height:0!important;min-width:0!important;
 height:100%!important;display:flex!important;flex-direction:column!important;gap:10px!important;
}
body #landingContent .p2-landing-route>.rv-resource-column h3,
body #ioLanding .io-route>.rv-resource-column h3{font:750 17px/1.35 Inter,sans-serif!important;color:#1e2e3e!important;margin:0!important}
body .rv-resource-column .rv-resource-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important;min-width:0!important}
body .rv-resource-column .rv-resource-card{background:#fff!important;border:1px solid #d8dde3!important;color:#1e2e3e!important;box-shadow:none!important;min-height:88px!important;padding:7px 5px!important;border-radius:8px!important}
body .rv-resource-column .rv-resource-card span{color:#1e2e3e!important}
body .rv-resource-column .rv-resource-card:hover{box-shadow:0 5px 12px #00000022!important;border-color:#6482ae!important}
@media(min-width:1021px) and (max-width:1250px){
 body #landingContent .p2-landing-route.rv-has-resources,
 body main .hl-landing .p2-landing-route.rv-has-resources,
 body #ioLanding .io-route.rv-has-resources{gap:12px!important}
 body #landingContent .p2-landing-route>.rv-resource-column,
 body #ioLanding .io-route>.rv-resource-column{padding:10px!important}
}
@media(max-width:1020px){
 body #landingContent .p2-landing-route.rv-has-resources,
 body main .hl-landing .p2-landing-route.rv-has-resources,
 body #ioLanding .io-route.rv-has-resources{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:700px){
 body #landingContent .p2-landing-route.rv-has-resources,
 body main .hl-landing .p2-landing-route.rv-has-resources,
 body #ioLanding .io-route.rv-has-resources{grid-template-columns:1fr!important}
}

/* v166: P2 / HL landing stage cards deliberately match the working IO landing. */
body #landingContent .p2-landing-route.rv-has-resources,
body #landingContent .hl-landing .p2-landing-route.rv-has-resources{
 display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:24px!important;align-items:stretch!important;overflow:visible!important;
}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card{
 --io-fill:#F4ECD9;--io-ink:#584521;--io-edge:#C7AF78;
 position:relative!important;display:flex!important;flex-direction:column!important;align-items:stretch!important;
 min-width:0!important;min-height:240px!important;height:auto!important;gap:12px!important;
 border:2px solid var(--io-edge)!important;border-left:6px solid var(--io-edge)!important;
 border-radius:18px!important;padding:22px!important;background:var(--io-fill)!important;color:var(--io-ink)!important;
 box-shadow:0 4px 10px #1e2e3e22!important;text-decoration:none!important;
 font:16px/1.6 Inter,sans-serif!important;cursor:pointer!important;
 grid-template-columns:none!important;
}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card:nth-child(2){--io-fill:#EDE2F3;--io-ink:#543267;--io-edge:#B293C5}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card:nth-child(3){--io-fill:#DFEBF5;--io-ink:#294F70;--io-edge:#8CB1D1}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card .route-no{display:block!important;background:none!important;color:var(--io-ink)!important;border:0!important;width:auto!important;height:auto!important;font:800 24px/1.3 Inter,sans-serif!important;text-align:left!important;padding:0!important}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card .route-copy{display:flex!important;flex:1!important;flex-direction:column!important;gap:10px!important;color:var(--io-ink)!important}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card .route-copy strong{font:750 20px/1.35 Inter,sans-serif!important;color:var(--io-ink)!important}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card .route-copy small{font:15px/1.6 Inter,sans-serif!important;color:var(--io-ink)!important}
body #landingContent .p2-landing-route.rv-has-resources>.p2-route-card .route-arrow{display:block!important;align-self:flex-start!important;margin-top:auto!important;padding:8px 12px!important;border-radius:24px!important;background:#ffffffb0!important;color:var(--io-ink)!important;width:auto!important;height:auto!important;font:700 13px/1.4 Inter,sans-serif!important}
body #landingContent .p2-landing-route.rv-has-resources>.rv-resource-column,
body #ioLanding .io-route.rv-has-resources>.rv-resource-column{
 background:#F3E4E7!important;color:#693E48!important;border:2px solid #BE929C!important;border-left:6px solid #BE929C!important;border-radius:18px!important;padding:22px!important;box-shadow:0 4px 10px #1e2e3e22!important;min-height:240px!important;
}
body #landingContent .p2-landing-route.rv-has-resources>.rv-resource-column h3,
body #ioLanding .io-route.rv-has-resources>.rv-resource-column h3{font:750 20px/1.35 Inter,sans-serif!important;color:#693E48!important}
/* P1: one equal-level landing table: Annotate | Practise | Write | Resources | Video. */
body .p1-start-row:has(.rv-p1-five){display:block!important;grid-template-columns:none!important;width:100%!important}
body .p1-start-row .p1-activity-route.rv-p1-five{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;align-items:stretch!important;margin:0!important;width:100%!important}
body .p1-start-row .p1-activity-route.rv-p1-five>.p2-route-card{min-height:250px!important;height:100%!important;box-sizing:border-box!important}
body .p1-start-row .p1-activity-route.rv-p1-five>.rv-resource-column{height:100%!important;min-width:0!important;box-sizing:border-box!important}
body .p1-start-row .p1-activity-route.rv-p1-five>.rv-p1-video{
 display:flex!important;flex-direction:column!important;justify-content:flex-start!important;
 width:100%!important;max-width:none!important;min-width:0!important;height:100%!important;
 padding:14px!important;align-self:stretch!important;box-sizing:border-box!important;
 border:1px solid #ffffff30!important;border-radius:6px!important;background:#223449!important;gap:8px!important;
}
body .p1-start-row .p1-activity-route.rv-p1-five>.rv-p1-video h2{color:#e0c77a!important;font:750 17px/1.35 Inter,sans-serif!important;margin:0!important}
body .p1-start-row .p1-activity-route.rv-p1-five>.rv-p1-video iframe{width:100%!important;aspect-ratio:16/9!important;min-height:0!important}
body .p1-start-row .p1-activity-route.rv-p1-five>.rv-p1-video>a{margin-top:auto!important;color:#e0c77a!important}
@media(max-width:1250px){body .p1-start-row .p1-activity-route.rv-p1-five{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:1020px){body #landingContent .p2-landing-route.rv-has-resources{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:700px){body #landingContent .p2-landing-route.rv-has-resources{grid-template-columns:1fr!important}body .p1-start-row .p1-activity-route.rv-p1-five{grid-template-columns:1fr!important}}

/* P1 fixed ordering: video | ready | do | done | resources, same single grid. */
body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:12px!important;align-items:stretch!important;overflow:visible!important}
body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five>.p1-walkthrough{grid-column:auto!important;grid-row:auto!important;display:flex!important;flex-direction:column!important;min-width:0!important;width:auto!important;max-width:none!important;height:auto!important;align-self:stretch!important;box-sizing:border-box!important;margin:0!important;padding:12px!important;background:#223449!important;border:1px solid #ffffff30!important;border-radius:6px!important}
body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five>.p1-walkthrough h2{font-size:17px!important;line-height:1.3!important;margin:0 0 8px!important;color:#e0c77a!important}
body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five>.p1-walkthrough iframe{width:100%!important;aspect-ratio:16/9!important;height:auto!important;min-height:0!important}
body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five>.p1-walkthrough>a{margin-top:auto!important}
body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five>.rv-resource-column{grid-column:auto!important;min-width:0!important;height:auto!important}
@media(max-width:1200px){body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(max-width:850px){.rv-landing-gdd-grid{grid-template-columns:1fr}}
@media(max-width:700px){body .p1-start-row .p1-landing-guide .gdd-grid.rv-p1-five{grid-template-columns:1fr!important}}

/* v168: one clickable four-column landing table, with GDD guidance INSIDE each stage card. */
body #landingContent .p2-landing-route.rv-has-resources,
body #ioLanding .io-route.rv-has-resources{
 display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
 gap:16px!important;align-items:stretch!important;overflow:visible!important;
}
body #landingContent .p2-landing-route.rv-has-resources>.rv-resource-column,
body #ioLanding .io-route.rv-has-resources>.rv-resource-column{
 grid-column:auto!important;grid-row:auto!important;min-width:0!important;
}
body .rv-stage-gdd-label{display:inline-block!important;align-self:flex-start!important;
 color:inherit!important;font:800 14px/1.35 Inter,sans-serif!important;
 letter-spacing:.02em!important;margin:0 0 4px!important;opacity:.85!important}
body .rv-stage-gdd-instructions{margin:6px 0 8px!important;color:inherit!important;
 font:14px/1.5 Inter,sans-serif!important;opacity:.94!important;text-align:left!important}
body .rv-stage-gdd-instructions ol{margin:0!important;padding-left:20px!important}
body .rv-stage-gdd-instructions li{margin:0 0 5px!important}
@media(max-width:1050px){
 body #landingContent .p2-landing-route.rv-has-resources,
 body #ioLanding .io-route.rv-has-resources{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:680px){
 body #landingContent .p2-landing-route.rv-has-resources,
 body #ioLanding .io-route.rv-has-resources{grid-template-columns:1fr!important}
}