:root{--primary-bg:#121212;--secondary-bg:#1e1e1e;--accent-primary:#2d76cc;--accent-hover:#1d5bb1;--accent-secondary:#28a746;--text-primary:#ffffff;--text-secondary:#b0b0b0;--text-muted:#888;--border-color:rgba(255,255,255,0.1);--font-primary:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Oxygen,Ubuntu,Cantarell,'Open Sans','Helvetica Neue',sans-serif;--header-height:80px;--border-radius-soft:10px;--border-radius-round:24px;--transition-speed:0.3s}*{margin:0;padding:0;box-sizing:border-box}body{font-family:var(--font-primary);background:var(--primary-bg);color:var(--text-primary);line-height:1.6;min-height:100vh;overflow-x:hidden;padding-top:var(--header-height);font-size:15px}.content{flex:1;width:100%;max-width:1360px;margin:0 auto;padding:20px 24px 48px;position:relative}header{position:fixed;top:0;left:0;width:100%;height:var(--header-height);background:var(--secondary-bg);box-shadow:0 4px 15px rgba(0,0,0,0.2);z-index:1000;border-bottom:1px solid var(--border-color)}.header__container{max-width:1400px;margin:0 auto;padding:0 20px;height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.pattern-select-wrap{display:flex;align-items:center;gap:8px}.pattern-label{font-size:0.9rem;color:var(--text-secondary);font-weight:500}.custom-dropdown{position:relative;width:150px;font-size:0.92rem;font-weight:600}.dropdown-selected{display:flex;align-items:center;justify-content:space-between;padding:0 14px;height:42px;background:rgba(255,255,255,0.05);border:1.5px solid var(--border-color);border-radius:8px;color:var(--text-primary);cursor:pointer;transition:all 0.3s ease}.dropdown-selected:hover{border-color:var(--accent-primary);background:rgba(45,118,204,0.1)}.dropdown-selected.open{border-color:var(--accent-primary);border-bottom-left-radius:0;border-bottom-right-radius:0}.dropdown-selected svg{transition:transform 0.3s ease}.dropdown-selected.open svg{transform:rotate(180deg)}.dropdown-options{position:absolute;top:100%;left:0;width:100%;background:var(--secondary-bg);border:1.5px solid var(--accent-primary);border-top:none;border-radius:0 0 8px 8px;overflow:hidden;display:none;z-index:1000;box-shadow:0 8px 16px rgba(0,0,0,0.3)}.dropdown-options.show{display:block;animation:fadeInDropdown 0.2s ease}.dropdown-option{padding:10px 14px;color:var(--text-secondary);cursor:pointer;transition:all 0.2s ease}.dropdown-option:hover{background:rgba(45,118,204,0.15);color:var(--text-primary)}.dropdown-option.active{background:rgba(45,118,204,0.2);color:var(--accent-primary);font-weight:700}.mobile-menu-label{color:var(--text-secondary);font-size:0.78rem;font-weight:800;letter-spacing:0.08em;text-transform:uppercase;margin:0.25rem 0 0.45rem}.mobile-dropdown{width:100%;margin-bottom:14px}.logo-link{display:flex;align-items:center;text-decoration:none;flex-shrink:0;gap:12px}.logo-link h1{font-size:1.5rem;font-weight:700;color:var(--text-primary);margin:0;transition:color var(--transition-speed) ease;white-space:nowrap}.logo-link:hover h1{color:var(--accent-primary)}.header__mobile-actions{display:none;gap:8px;align-items:center}.search-container{flex-grow:1;max-width:500px;min-width:220px;margin:0 20px;display:flex;align-items:center}.search-wrapper{display:flex;align-items:center;background:var(--primary-bg);border-radius:var(--border-radius-soft);padding:0 16px;transition:all var(--transition-speed);border:1.5px solid var(--border-color);height:44px;width:100%;position:relative}.search-wrapper:hover{background:rgba(255,255,255,0.04);border-color:rgba(45,118,204,0.5)}.search-wrapper:focus-within{background:rgba(255,255,255,0.06);border-color:var(--accent-primary)}#paper-search{width:100%;background:transparent;border:none;outline:none;color:var(--text-primary);font-size:1rem;padding:8px 0}#paper-search::placeholder{color:var(--text-secondary);opacity:0.85}.search-dropdown{position:absolute;top:100%;left:0;right:0;background:var(--secondary-bg);border:1.5px solid var(--accent-primary);border-radius:var(--border-radius-soft);box-shadow:0 8px 32px rgba(0,0,0,0.3);z-index:3000;max-height:50vh;overflow-y:auto;display:none;margin-top:6px}.search-result-row{display:flex;align-items:center;padding:12px 16px;cursor:pointer;transition:all 0.2s ease;background:transparent;border-bottom:1px solid var(--border-color);gap:12px}.search-result-row:last-child{border-bottom:none}.search-result-row:hover,.search-result-row.active{background:rgba(45,118,204,0.15);border-color:rgba(45,118,204,0.3)}.result-subject{font-size:0.95rem;font-weight:600;color:var(--text-primary);flex:1}.search-result-row:hover .result-subject,.search-result-row.active .result-subject{color:var(--accent-primary)}.result-branch{font-size:0.8rem;font-weight:500;color:var(--text-secondary);background:rgba(45,118,204,0.1);padding:3px 10px;border-radius:10px;white-space:nowrap;flex-shrink:0}.search-no-results{padding:24px;text-align:center;color:var(--text-secondary);font-size:0.95rem;font-style:italic}.mobile-search-toggle{display:none;align-items:center;justify-content:center;background:#1d5bb1;border:1.5px solid #1d5bb1;border-radius:50%;color:#ffffff;cursor:pointer;height:44px;width:44px;transition:all 0.2s ease}.mobile-search-toggle:hover{background:#1d5bb1;border-color:#1d5bb1;transform:scale(1.05)}.mobile-search-toggle.active{background:#1d5bb1;border-color:#1d5bb1}.search-icon-svg{height:22px;width:22px}.mobile-menu-toggle{display:none;background:var(--accent-secondary);border:1.5px solid var(--accent-secondary);border-radius:8px;color:#ffffff;cursor:pointer;padding:8px;z-index:1001;height:44px;width:44px;align-items:center;justify-content:center;transition:all 0.2s ease}.mobile-menu-toggle:hover{background:#1f8736;border-color:#1f8736;transform:scale(1.05)}.menu-icon{position:relative;width:24px;height:2px;background-color:#ffffff;display:block;transition:all 0.3s ease}.menu-icon::before,.menu-icon::after{content:'';position:absolute;width:24px;height:2px;background-color:#ffffff;left:0;transition:all 0.3s ease}.menu-icon::before{top:-8px}.menu-icon::after{top:8px}.mobile-menu-toggle.active{background:#d43b3b;border-color:#d43b3b}.mobile-menu-toggle.active .menu-icon{background-color:transparent}.mobile-menu-toggle.active .menu-icon::before{transform:rotate(45deg);top:0}.mobile-menu-toggle.active .menu-icon::after{transform:rotate(-45deg);top:0}.mobile-menu{display:none;flex-direction:column;position:fixed;top:0;right:0;width:85vw;max-width:320px;height:100vh;background:var(--secondary-bg);box-shadow:-4px 0 24px rgba(0,0,0,0.5);z-index:2000;padding:4rem 1.5rem 2rem 1.5rem;transform:translateX(100%);transition:transform 0.3s cubic-bezier(0.4,0,0.2,1);border-left:3px solid var(--accent-primary)}.mobile-menu.open{display:flex;transform:translateX(0)}.mobile-menu__close{position:absolute;top:0.9rem;right:0.9rem;background:rgba(212,59,59,0.12);border:1.5px solid rgba(212,59,59,0.25);color:#ffdddd;font-size:22px;cursor:pointer;width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:10px;transition:transform 0.18s ease,background 0.18s ease,color 0.18s ease;box-shadow:0 8px 20px rgba(0,0,0,0.45);z-index:10;line-height:1}.mobile-menu__close:hover,.mobile-menu__close:focus{background:#d43b3b;border-color:#d43b3b;color:#fff;transform:rotate(90deg) scale(1.05);outline:none}.mobile-menu a{color:var(--text-primary);text-decoration:none;font-size:1.05rem;font-weight:500;padding:1rem 1.2rem;border-radius:10px;transition:all 0.2s ease;display:flex;align-items:center;gap:12px;background:rgba(255,255,255,0.04);margin-bottom:8px;border:1px solid transparent}.mobile-menu a:hover{background:rgba(45,118,204,0.2);transform:translateX(8px);color:var(--accent-primary);border-color:rgba(45,118,204,0.4)}.header__actions{display:flex;align-items:center;gap:12px;flex-shrink:0}.sppucodes-button{padding:0 16px;border-radius:var(--border-radius-soft);font-weight:600;font-size:0.9rem;text-decoration:none;transition:all var(--transition-speed);border:1.5px solid var(--border-color);cursor:pointer;white-space:nowrap;display:flex;align-items:center;justify-content:center;height:42px;gap:8px;background-color:var(--secondary-bg);color:var(--text-primary)}.sppucodes-button img{width:24px;height:24px;object-fit:contain;border-radius:4px}.sppucodes-button:hover{background-color:rgba(255,255,255,0.08);border-color:var(--accent-primary);transform:translateY(-2px)}.mobile-menu a.sppucodes-button{display:flex;justify-content:center;align-items:center;margin-top:0.5rem;padding:12px 14px;border-radius:var(--border-radius-round);font-weight:700;font-size:0.95rem;text-transform:uppercase;text-decoration:none;color:var(--text-primary);border:1.5px solid var(--border-color);transition:all var(--transition-speed);width:100%;gap:8px;background-color:var(--secondary-bg)}.mobile-menu a.sppucodes-button:hover{background-color:rgba(255,255,255,0.08);border-color:var(--accent-primary);transform:translateY(-2px)}.container{max-width:1200px;flex-direction:column}.nav-level{display:none;animation:fadeIn 0.4s ease-in-out}.nav-level.active{display:block}.back-nav-container{margin:0 0 1.25rem 0;padding:0}.back-button{display:inline-flex;align-items:center;gap:8px;background:transparent;color:var(--text-secondary);border:none;font-size:1rem;font-weight:500;cursor:pointer;padding:6px 12px 6px 0;transition:color 0.2s ease}.back-button:hover{color:var(--text-primary)}.back-button svg{transition:transform 0.2s ease}.back-button:hover svg{transform:translateX(-4px)}.section-title{color:var(--text-primary);font-size:1.6rem;font-weight:600;margin-bottom:30px;padding:0 16px;border-left:4px solid var(--accent-primary);padding-left:16px}@keyframes fadeIn{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;padding:0}.card{background:var(--secondary-bg);border:1px solid var(--border-color);border-radius:var(--border-radius-soft);padding:25px;cursor:pointer;transition:all var(--transition-speed) ease;display:flex;flex-direction:column;min-height:140px;position:relative;overflow:hidden;box-shadow:0 4px 10px rgba(0,0,0,0.15)}.card::before{content:'';position:absolute;bottom:0;left:50%;width:0;height:3px;background:var(--accent-primary);transition:width var(--transition-speed) ease-out,left var(--transition-speed) ease-out}.card:hover{transform:translateY(-4px);border-color:var(--accent-primary);box-shadow:0 8px 20px rgba(0,0,0,0.2)}.card:hover::before{width:100%;left:0}.card-title{font-size:1.4rem;font-weight:600;color:var(--text-primary);text-align:center;line-height:1.4;flex-grow:1;display:flex;align-items:center;justify-content:center;padding:8px 0}.subject-card{min-height:180px;cursor:default;display:flex;flex-direction:column;justify-content:space-between}.subject-card:hover{transform:translateY(-4px);border-color:var(--accent-primary)}.subject-info{flex-grow:1;display:flex;flex-direction:column;justify-content:center;padding-bottom:20px}.subject-info h3{color:var(--text-primary);margin:0;font-size:1.3rem;font-weight:600;line-height:1.4;text-align:center;word-wrap:break-word;hyphens:auto;overflow-wrap:break-word}.view-button{background:var(--accent-primary);color:white;border:none;padding:12px 20px;border-radius:8px;cursor:pointer;font-weight:500;font-size:14px;transition:all var(--transition-speed) ease;text-decoration:none;display:flex;align-items:center;justify-content:center;width:100%;text-align:center;margin-top:auto}.view-button:hover{background:var(--accent-hover)}.group{margin:0 auto 2.75rem}.semester-heading{font-size:1.5rem;margin:0 0 1.25rem 0;color:var(--text-primary);font-weight:700;text-align:left;border-left:4px solid var(--accent-primary);padding-left:12px;letter-spacing:-0.01em}.branch-list,.semester-list,.subject-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.25rem;padding:0;margin:0 0 2rem 0;list-style:none}.branch-list li,.semester-list li,.subject-list li{animation:fadeIn 0.5s ease forwards;transition:transform 0.3s ease,opacity 0.3s ease}.branch-list a,.semester-list a,.subject-list a{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0.8rem;background:var(--secondary-bg);padding:1.75rem;border-radius:var(--border-radius-soft);text-decoration:none;color:var(--text-primary);box-shadow:0 4px 10px rgba(0,0,0,0.15);height:155px;transition:transform 0.3s ease,box-shadow 0.3s ease,border-color 0.3s ease;position:relative;overflow:hidden;text-align:center;border:1px solid var(--border-color)}.subject-list a{min-height:152px}.branch-list a:focus-visible,.semester-list a:focus-visible,.subject-list a:focus-visible,.sppucodes-button:focus-visible,.mobile-menu a:focus-visible{outline:2px solid var(--accent-primary);outline-offset:4px}.branch-code,.year-code,.subject-code,.branch-name,.full-name,.sem-full{text-align:center;line-height:1.3;transition:all 0.3s ease;overflow-wrap:anywhere;max-width:100%}.branch-code,.year-code,.subject-code{color:var(--text-primary);font-size:1.6rem;font-weight:800;text-transform:uppercase;letter-spacing:0.02em}.branch-name,.full-name,.sem-full{color:var(--text-secondary);font-weight:600;font-size:1rem}.subject-group-heading{font-size:1.15rem;margin:1.75rem 0 1rem 0;color:var(--text-secondary);font-weight:600;text-align:left;border-left:3px solid rgba(255,255,255,0.2);padding-left:10px;text-transform:uppercase;letter-spacing:0.05em}.semester-heading + .group>.subject-group-heading:first-child{margin-top:0.5rem}.branch-list a:hover,.semester-list a:hover,.subject-list a:hover{transform:translateY(-4px);box-shadow:0 8px 20px rgba(0,0,0,0.2);border-color:var(--accent-primary)}.branch-list a:hover .branch-name,.branch-list a:hover .branch-code,.semester-list a:hover .year-code,.subject-list a:hover .subject-code,.semester-list a:hover .sem-full,.subject-list a:hover .full-name{color:var(--accent-primary)}.branch-list a::after,.semester-list a::after,.subject-list a::after{content:'';position:absolute;bottom:0;left:50%;width:0;height:3px;background-color:var(--accent-primary);transition:width 0.3s ease-out,left 0.3s ease-out}.branch-list a:hover::after,.semester-list a:hover::after,.subject-list a:hover::after{width:100%;left:0}@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (max-width:899px){:root{--header-height:70px}body{padding-top:var(--header-height)}header{height:var(--header-height)}.header__container{padding:0 12px}.header__mobile-actions{display:flex}.pattern-select-wrap{display:none}.header__actions{display:none !important}.mobile-menu-toggle,.mobile-search-toggle{display:flex}.search-container{position:fixed;top:var(--header-height);left:0;width:100vw;max-width:100vw;background:var(--secondary-bg);z-index:999;transform:translateY(-100%);opacity:0;visibility:hidden;transition:transform 0.3s ease,opacity 0.3s ease,visibility 0.3s ease;padding:14px;margin:0;box-shadow:0 4px 16px rgba(0,0,0,0.3);border-bottom:2px solid var(--accent-primary)}.search-container.active{transform:translateY(0);opacity:1;visibility:visible}.search-wrapper{height:48px;padding:0 14px;background:var(--primary-bg);border:2px solid var(--accent-primary)}#paper-search{font-size:1rem;padding:8px 0;color:var(--text-primary) !important}.search-dropdown{max-height:55vh;border-radius:0 0 var(--border-radius-soft) var(--border-radius-soft);border-top:none;margin-top:0}.search-result-row{padding:10px 14px}.result-subject{font-size:0.9rem}.result-branch{font-size:0.75rem;padding:2px 8px}.logo-link h1{font-size:1.2rem}.mobile-menu{padding:3.5rem 1.2rem 1.5rem 1.2rem}.mobile-menu__close{top:0.8rem;right:0.8rem;width:38px;height:38px;font-size:24px}.container{padding:20px 16px}.section-title{font-size:1.4rem;margin-bottom:25px}.cards-grid,.branch-list,.semester-list,.subject-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;margin:0 0 1.5rem 0}.semester-heading{font-size:1.3rem;margin-bottom:1.2rem;padding-left:10px}.subject-group-heading{font-size:1.05rem;margin-top:1.5rem;margin-bottom:0.75rem;padding-left:8px}.back-nav-container{margin-bottom:1rem}.card{padding:20px;min-height:120px}.card-title{font-size:1.2rem}.subject-card{min-height:160px}.subject-info h3{font-size:1.1rem}.content{padding:16px 16px 36px}}@media (max-width:480px){.header__container{padding:0 8px}.logo-link h1{font-size:1rem}.mobile-search-toggle,.mobile-menu-toggle{width:40px;height:40px}.search-container{padding:12px}.search-wrapper{height:46px}.container{padding:16px 12px}.section-title{font-size:1.2rem;margin-bottom:20px}.cards-grid{grid-template-columns:1fr;gap:14px}.card{padding:18px;min-height:110px}.card-title{font-size:1.1rem}.subject-card{min-height:150px}.subject-info h3{font-size:1rem}.breadcrumb{padding:8px 10px;gap:6px}.breadcrumb-item{padding:4px 8px;font-size:12px}.view-button{padding:10px 16px;font-size:13px}.subject-list,.branch-list,.semester-list{grid-template-columns:1fr;gap:0.75rem;margin:0 0 1.25rem 0}.subject-list a,.branch-list a,.semester-list a{padding:1.5rem;min-height:128px;gap:0.6rem}.branch-code,.year-code,.subject-code{font-size:1.3rem}.branch-name,.full-name,.sem-full{font-size:0.85rem}.semester-heading{font-size:1.15rem;margin-bottom:0.75rem;padding-left:8px}.subject-group-heading{font-size:0.95rem;margin-top:1.25rem;margin-bottom:0.5rem;padding-left:6px}.back-nav-container{margin-bottom:0.75rem}.content{padding:12px 12px 30px}.mobile-menu{width:90vw;padding:3rem 1rem 1.2rem 1rem}.mobile-menu__close{width:36px;height:36px;font-size:22px;top:0.7rem;right:0.7rem}}@media (min-width:900px) and (max-width:1024px){grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.container{padding:25px 30px}.header__container{padding:0 20px}.search-container{max-width:320px}.logo-link h1{font-size:1.3rem}}@media (min-width:900px) and (max-width:1180px){.branch-list,.semester-list,.subject-list{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:900px){.mobile-search-toggle,.mobile-menu-toggle,.mobile-menu{display:none !important}.search-container{display:flex !important;position:static;width:auto;max-width:500px;margin:0 20px;padding:0;background:none;border:none;transform:none;opacity:1;visibility:visible}}
