/* Includes the missing V5.1 loading and responsive stylesheet. */
/* V5.1 - mobile-first enhancements, tiny pure CSS rather than Tailwind CDN */
.brand-icon{background:transparent!important;box-shadow:none!important}.brand-icon img{display:block;width:100%;height:100%;border-radius:14px}.console-brand-icon img{display:block;max-width:100%}.login-logo img{display:block;max-width:100%}.subject-icon i{font-size:22px;line-height:1}.join-notice-click{cursor:pointer}.join-notice{cursor:pointer}
.exam-grade-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.exam-grade-grid .grade-card{min-width:0;min-height:260px;overflow:hidden}.exam-grade-grid .grade-giant{font-size:clamp(42px,4vw,74px);letter-spacing:-.07em;line-height:1}.exam-grade-grid .grade-content{z-index:2}.exam-grade-grid .grade-content span i{margin-right:6px}.grade-hsa{background:linear-gradient(130deg,#5260e2,#9a8df1)}.grade-tsa{background:linear-gradient(130deg,#c56f38,#f0ad7c)}.grade-vact{background:linear-gradient(130deg,#138a85,#64c5b0)}.grade-hsa,.grade-tsa,.grade-vact{color:#fff}.grade-hsa .grade-top,.grade-tsa .grade-top,.grade-vact .grade-top{color:#fff;opacity:.86}
.v51-loading{display:flex;gap:12px;align-items:center;justify-content:center;padding:42px 12px;font-size:13px;color:#64718c}.v51-loading i{color:#5365e5;font-size:24px}
.v51-skeleton-grid{display:grid;grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;width:100%}.v51-skeleton-card{overflow:hidden;border:1px solid #e5e9f6;border-radius:19px;background:#fff}.v51-sk-image{aspect-ratio:16/9;background:#e9edfb}.v51-sk-body{padding:15px}.v51-sk-chip{height:18px;width:36%;border-radius:6px;background:#e9edfb;margin-bottom:16px}.v51-sk-line{height:13px;border-radius:4px;background:#e9edfb;margin-bottom:9px}.v51-sk-line.short{width:65%}.v51-sk-image,.v51-sk-chip,.v51-sk-line{background-image:linear-gradient(100deg,#edf0fa 10%,#f9faff 32%,#e8edfa 60%);background-size:210% 100%;animation:v51shimmer 1.45s ease-in-out infinite;animation-delay:var(--sk-delay,0ms)}@keyframes v51shimmer{to{background-position-x:-210%}}
.v51-more-container{text-align:center;margin:32px 0 8px}.v51-more-button{display:inline-flex;align-items:center;justify-content:center;gap:12px;padding:16px 26px;border:1px solid #cbd2fa;border-radius:15px;background:#fff;box-shadow:0 11px 28px #5265dc18;color:#495ae3;font-weight:800;font-size:13px;transition:transform .2s,box-shadow .2s,background .2s}.v51-more-button:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 16px 40px #5265dc2d;background:#f5f7ff}.v51-more-button:disabled{opacity:.65;cursor:progress}.v51-btn-count{font-size:10px;border-radius:30px;color:#6d799b;background:#edf0fa;padding:5px 10px}
@media(max-width:1000px){.exam-grade-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.v51-skeleton-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.exam-grade-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.exam-grade-grid .grade-card{min-height:220px}.exam-grade-grid .grade-giant{font-size:46px}.exam-grade-grid .grade-content strong{font-size:20px}.v51-skeleton-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.v51-more-button{width:100%;max-width:355px}.filter-tabs{overflow-x:auto;flex-wrap:nowrap;-webkit-overflow-scrolling:touch;scrollbar-width:none}.filter-tabs button{white-space:nowrap;flex-shrink:0}}
@media(max-width:390px){.exam-grade-grid{grid-template-columns:1fr 1fr}.exam-grade-grid .grade-giant{font-size:40px}}
@media(prefers-reduced-motion:reduce){.v51-sk-image,.v51-sk-chip,.v51-sk-line{animation:none}.v51-more-button{transition:none}}


/* V5.3: refined exam pathways. Each card uses compact real content, no oversize background letters. */
.path-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:17px;align-items:stretch}
.path-grid .path-card{--pc:#4c60e7;--pc2:#7884fb;--soft:#eef1ff;--shade:rgba(84,102,235,.14);position:relative;display:flex;flex-direction:column;gap:0;min-height:312px;height:auto!important;padding:20px 20px 18px!important;border-radius:22px!important;overflow:hidden!important;border:1px solid #e6e9f6!important;background:linear-gradient(160deg,#fff 38%,var(--soft) 170%)!important;color:#242d4f!important;isolation:isolate;box-shadow:0 5px 12px rgba(46,59,120,.025),0 18px 34px rgba(46,59,120,.035);transition:transform .32s cubic-bezier(.2,.8,.2,1),box-shadow .32s,border-color .3s!important}
.path-grid .path-card:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:linear-gradient(90deg,var(--pc),var(--pc2));z-index:2}
.path-grid .path-card:after{content:"";position:absolute;width:180px;height:180px;right:-112px;top:80px;border:26px solid var(--shade);border-radius:44%;pointer-events:none;z-index:-1;transform:rotate(-25deg);transition:transform .55s ease}
.path-grid .grade-hsa{--pc:#5262dd;--pc2:#9b8af2;--soft:#edf0ff;--shade:rgba(98,100,220,.10)}
.path-grid .grade-tsa{--pc:#ac6a42;--pc2:#e5a478;--soft:#fff3eb;--shade:rgba(200,126,74,.10)}
.path-grid .grade-vact{--pc:#168c83;--pc2:#54bfb4;--soft:#eaf9f5;--shade:rgba(23,156,134,.10)}
.path-grid .grade-12{--pc:#cf8547;--pc2:#f0b36b;--soft:#fff5e8;--shade:rgba(223,156,75,.12)}
.path-grid .path-card:hover{transform:translateY(-7px)!important;border-color:var(--pc2)!important;box-shadow:0 24px 44px var(--shade)}
.path-grid .path-card:hover:after{transform:rotate(3deg) translateX(-10px)}
.path-top{display:flex;align-items:center;justify-content:space-between;gap:10px;position:relative;z-index:1}
.path-icon{width:48px;height:48px;border-radius:15px;background:var(--soft);border:1px solid var(--shade);color:var(--pc);display:grid;place-items:center;font-size:20px;transition:transform .3s,background .3s}
.path-card:hover .path-icon{transform:rotate(-7deg) scale(1.06);background:#fff}
.path-index{font-size:10px;font-weight:800;letter-spacing:1.5px;color:#9aa4bc}
.path-info{position:relative;z-index:1;flex:1;display:flex;flex-direction:column;padding:22px 0 17px}
.path-eyebrow{font-size:9px;font-weight:900;color:var(--pc);letter-spacing:1.2px;text-transform:uppercase}
.path-info h3{font-size:clamp(29px,2.8vw,38px);font-weight:900;letter-spacing:-1.5px;line-height:1.1;margin:6px 0 8px;color:#202b52}
.path-institution{font-size:11px!important;color:#67738b!important;font-weight:700;line-height:1.5!important;margin:0 0 13px!important}
.path-description{font-size:11px!important;color:#7f89a1!important;line-height:1.7!important;margin:0!important;max-width:230px}
.path-bottom{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:9px;padding-top:14px;border-top:1px solid #e9eaf3;font-size:11px;font-weight:800;color:var(--pc)}
.path-arrow{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:var(--soft);color:var(--pc);font-size:12px;transition:background .25s,color .25s,transform .25s}
.path-card:hover .path-arrow{background:var(--pc);color:#fff;transform:translate(2px,-2px)}
.path-decoration{display:none}
/* Skeletons visible on the very first paint; JS replaces them when results arrive. */
.v53-loading-shell{grid-column:1/-1;width:100%;min-width:0;padding:6px 0 4px}
.v53-loading-heading{display:flex;align-items:center;justify-content:center;gap:11px;color:#7382a4;font-size:12px;font-weight:700;margin:1px 0 17px;min-height:23px}
.v53-loading-pulse{width:10px;height:10px;flex:0 0 10px;border-radius:50%;background:#6373ed;box-shadow:0 0 0 5px #e9ebff;animation:v53pulse 1.4s ease-in-out infinite}
@keyframes v53pulse{0%,100%{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1.12)}}
.v53-loading-shell .v51-skeleton-grid{grid-column:auto}
.v51-skeleton-grid{align-self:start;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.v51-skeleton-card{box-shadow:0 8px 25px #374b9b09}
.v51-sk-image{aspect-ratio:16/9;min-height:135px}
.v51-sk-body{min-height:110px}
.v51-sk-line{height:13px}
#popular-list:has(.v53-loading-shell),#library-list:has(.v53-loading-shell){min-height:260px}
#popular-list:has(.v51-skeleton-grid),#library-list:has(.v51-skeleton-grid){min-height:260px}
@media(max-width:1080px){.path-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}.path-grid .path-card{min-height:295px}}
@media(max-width:690px){.path-grid{gap:13px!important}.path-grid .path-card{padding:17px!important;min-height:285px}.path-info{padding:16px 0 14px}.path-info h3{font-size:30px}.path-description{font-size:10px!important}.v51-skeleton-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:11px}.v51-sk-image{min-height:80px}.v53-loading-heading{font-size:11px}}
@media(max-width:430px){.path-grid{grid-template-columns:1fr!important}.path-grid .path-card{min-height:245px}.path-info{padding:14px 0}.path-description{max-width:none}}
@media(prefers-reduced-motion:reduce){.v53-loading-pulse{animation:none}.path-grid .path-card,.path-icon,.path-arrow{transition:none!important}}
