body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}#root{min-height:100vh}:root{--primary:#2563eb;--primary-dark:#1d4ed8;--primary-light:#eff6ff;--bg:#f8fafc;--surface:#fff;--border:#e2e8f0;--text:#1e293b;--text-light:#64748b;--error:#dc2626;--success:#059669}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.6}.app{flex-direction:column;height:100vh;display:flex;overflow:hidden}.container{flex:1;height:calc(100vh - 80px);display:flex;overflow:hidden}.content{flex:1;padding:2rem;overflow-y:auto}.sidebar{background:var(--surface);border-right:1px solid var(--border);flex-direction:column;width:350px;min-width:350px;display:flex}.search{border:none;border-bottom:1px solid var(--border);outline:none;width:100%;padding:1rem;font-size:.95rem}.search:focus{box-shadow:inset 0 0 0 2px var(--primary)}.sidebar-header{border-bottom:1px solid var(--border);padding:1rem}.back-link{color:var(--primary);margin-bottom:.75rem;font-size:.85rem;text-decoration:none;display:block}.back-link:hover{text-decoration:underline}.qual-info{margin-bottom:.75rem}.qual-code{color:var(--primary);font-size:.9rem;font-weight:600;display:block}.qual-title{color:var(--text-light);font-size:.8rem;display:block}.unit-list{flex:1;overflow-y:auto}.unit-item{cursor:pointer;border-bottom:1px solid var(--border);padding:.75rem 1rem;transition:background .15s}.unit-item:hover{background:var(--bg)}.unit-item.active{background:var(--primary-light);border-left:3px solid var(--primary)}.unit-code{color:var(--primary);font-size:.85rem;font-weight:600;display:block}.unit-title{color:var(--text-light);font-size:.9rem;display:block}.unit-type{border-radius:3px;margin-left:.5rem;padding:.15rem .4rem;font-size:.7rem}.unit-type.core{color:#1e40af;background:#dbeafe}.unit-type.elective{color:#4b5563;background:#f3f4f6}.qual-stats{color:var(--text-light);gap:1.5rem;margin-top:1rem;font-size:.9rem;display:flex}.loading-small{text-align:center;color:var(--text-light);padding:1rem;font-size:.9rem}.loading,.error,.placeholder{text-align:center;flex-direction:column;justify-content:center;align-items:center;height:100%;padding:2rem;display:flex}.loading{color:var(--text-light);gap:1rem}.error{color:var(--error);gap:1rem}.placeholder{color:var(--text-light)}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:40px;height:40px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.unit-detail{flex-direction:column;height:100%;display:flex}.unit-header{border-bottom:2px solid var(--border);justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1.5rem;padding-bottom:1rem;display:flex}.unit-header h2{color:var(--primary-dark);flex:1}.version{color:var(--text-light);background:var(--bg);border:1px solid var(--border);border-radius:20px;padding:.25rem .75rem;font-size:.85rem}.version-select{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:6px;outline:none;padding:.35rem .75rem;font-size:.85rem}.version-select:focus{border-color:var(--primary);box-shadow:0 0 0 2px var(--primary-light)}.header-controls{align-items:center;gap:.75rem;display:flex}.export-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:.5rem 1rem;font-size:.9rem}.export-btn:hover{background:var(--primary-dark)}.tabs{flex-wrap:wrap;gap:.5rem;margin-bottom:1.5rem;display:flex}.tab{border:1px solid var(--border);background:var(--surface);cursor:pointer;border-radius:6px;padding:.5rem 1rem;font-size:.85rem;transition:all .15s}.tab:hover{background:var(--bg)}.tab.active{background:var(--primary);color:#fff;border-color:var(--primary)}.tab-content{flex:1;overflow-y:auto}.mapping-bar{background:var(--surface);border-bottom:1px solid var(--border);align-items:center;gap:1rem;padding:.5rem 2rem;display:flex}.task-pills{flex-wrap:wrap;flex:1;gap:.5rem;display:flex}.task-pill{color:#1e40af;background:#dbeafe;border-radius:4px;align-items:center;gap:.25rem;padding:.25rem .5rem;font-size:.8rem;display:flex}.task-pill-remove{color:#1e40af;cursor:pointer;background:0 0;border:none;padding:0 .25rem;font-size:1rem;line-height:1}.task-pill-remove:hover{color:var(--error)}.mapping-export-btn{background:var(--primary);color:#fff;cursor:pointer;white-space:nowrap;border:none;border-radius:6px;padding:.4rem .75rem;font-size:.85rem}.mapping-export-btn:hover{background:var(--primary-dark)}.docx-uploads{margin-top:.75rem}.upload-label{color:var(--text-light);margin-bottom:.5rem;font-size:.8rem}.docx-upload-row{margin-bottom:.25rem}.upload-btn{background:var(--bg);border:1px solid var(--border);cursor:pointer;text-align:left;text-overflow:ellipsis;white-space:nowrap;border-radius:4px;width:100%;padding:.4rem .5rem;font-size:.8rem;overflow:hidden}.upload-btn:hover{background:var(--border)}.upload-btn.has-file{color:#1e40af;background:#dbeafe;border-color:#93c5fd}.map-btn{background:var(--bg);border:1px solid var(--border);cursor:pointer;white-space:nowrap;border-radius:4px;margin-left:.5rem;padding:.2rem .5rem;font-size:.75rem}.map-btn:hover{background:var(--primary-light);border-color:var(--primary)}.mapping-badges{gap:.25rem;margin-left:.5rem;display:inline-flex}.clickable{cursor:pointer}.clickable:hover{background:var(--primary-light)}.mapped-badge{color:#1e40af;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;background:#dbeafe;border-radius:3px;max-width:200px;margin-left:.5rem;padding:.15rem .4rem;font-size:.75rem;display:inline-block;overflow:hidden}.modal-overlay{z-index:1000;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border-radius:12px;flex-direction:column;width:90%;max-width:500px;max-height:80vh;padding:1.5rem;display:flex}.modal h3{margin-bottom:.5rem}.modal-desc{color:var(--text-light);margin-bottom:1rem;font-size:.9rem}.modal-tabs{background:var(--bg);border-radius:6px;gap:.25rem;margin-bottom:.75rem;padding:.25rem;display:flex}.modal-tab{cursor:pointer;background:0 0;border:none;border-radius:4px;flex:1;padding:.5rem;font-size:.85rem;transition:all .15s}.modal-tab:hover{background:var(--surface)}.modal-tab.active{background:var(--primary);color:#fff}.modal-task-name{color:var(--text-light);margin-bottom:.75rem;font-size:.8rem}.modal-list{flex-direction:column;flex:1;gap:.5rem;margin-bottom:1rem;display:flex;overflow-y:auto}.modal-item{background:var(--bg);border:1px solid var(--border);cursor:pointer;text-align:left;border-radius:6px;align-items:center;gap:.75rem;padding:.75rem;font-size:.9rem;display:flex}.modal-item:hover,.modal-item.active{background:var(--primary-light);border-color:var(--primary)}.modal-item.active{font-weight:600}.heading-level{color:var(--primary);background:var(--primary-light);border-radius:4px;padding:.15rem .4rem;font-size:.75rem;font-weight:600}.heading-text{flex:1}.modal-remove{width:100%;color:var(--error);cursor:pointer;background:#fef2f2;border:1px solid #fecaca;border-radius:6px;margin-bottom:.75rem;padding:.5rem;font-size:.85rem}.modal-remove:hover{background:#fecaca}.modal-cancel{background:var(--bg);border:1px solid var(--border);cursor:pointer;border-radius:6px;width:100%;padding:.5rem}.no-content{color:var(--text-light);font-style:italic}.criteria-list{flex-direction:column;gap:1.5rem;display:flex}.element{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1.25rem}.element h3{color:var(--primary-dark);border-bottom:1px solid var(--border);margin-bottom:1rem;padding-bottom:.5rem;font-size:1rem}.performance-criteria{flex-direction:column;gap:.5rem;list-style:none;display:flex}.performance-criteria li{background:var(--bg);border-radius:4px;gap:.75rem;padding:.5rem;display:flex}.pc-number{color:var(--primary);min-width:2.5rem;font-weight:600}.pc-desc{flex:1}.evidence{flex-direction:column;gap:1rem;display:flex}.evidence-intro{color:var(--text-light);border-bottom:1px solid var(--border);padding-bottom:.5rem;font-style:italic}.evidence-note{color:var(--text-light);border-top:1px solid var(--border);padding-top:.5rem;font-size:.85rem;font-style:italic}.evidence-list{flex-direction:column;gap:.5rem;list-style:none;display:flex}.evidence-list>li{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:.75rem 1rem}.item-number{color:var(--primary);min-width:2rem;margin-right:.5rem;font-weight:600;display:inline-block}.item-text{flex:1}.item-content{align-items:flex-start;gap:.5rem;display:flex}.item-content.clickable{cursor:pointer;border-radius:4px;margin:-.25rem;padding:.25rem}.item-content.clickable:hover{background:var(--primary-light)}.nested-items{border-left:2px solid var(--border);margin-top:.5rem;padding-left:1.5rem;list-style:none}.nested-items li{background:0 0;border:none;padding:.25rem 0;font-size:.95rem}.nested-items li.clickable{cursor:pointer;border-radius:4px;padding:.25rem .5rem}.nested-items li.clickable:hover{background:var(--primary-light)}.evidence-instruction{background:var(--primary-light);border-left:3px solid var(--primary);color:var(--text-light);font-style:italic}.assessment{flex-direction:column;gap:1.25rem;display:flex}.section{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1.25rem}.section h3{color:var(--primary-dark);border-bottom:1px solid var(--border);margin-bottom:.75rem;padding-bottom:.5rem;font-size:.95rem}.section p{color:var(--text);line-height:1.6}.foundation-list{flex-direction:column;gap:1rem;display:flex}.skill{background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:1.25rem}.skill h3{color:var(--primary-dark);margin-bottom:.5rem;font-size:1rem}.criteria-ref{color:var(--text-light);margin-bottom:.5rem;font-size:.85rem;font-style:italic}@media (width<=768px){.container{flex-direction:column}.sidebar{width:100%;min-width:unset;height:40vh}.content{height:60vh}}header{background:var(--primary);color:#fff;padding:1.5rem 2rem}.header-title{color:#fff;text-decoration:none}.header-title:hover{opacity:.9}header h1{font-size:1.5rem;font-weight:600}header p{opacity:.9;font-size:.9rem}.home{flex:1;justify-content:center;align-items:center;display:flex}.home-form{text-align:center;padding:2rem}.home-form h2{color:var(--primary-dark);margin-bottom:.5rem}.home-form p{color:var(--text-light);margin-bottom:1.5rem}.home-input{gap:.5rem;max-width:400px;margin:0 auto;display:flex}.home-input .search{flex:1}.go-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:4px;padding:.75rem 1.5rem;font-size:1rem}.go-btn:hover{background:var(--primary-dark)}.qual-container{flex:1;padding:2rem;overflow-y:auto}.qual-detail{max-width:1200px;margin:0 auto}.qual-header{border-bottom:2px solid var(--border);align-items:center;gap:1rem;margin-bottom:2rem;padding-bottom:1rem;display:flex}.qual-header h2{color:var(--primary-dark);flex:1}.qual-section{margin-bottom:2rem}.qual-section h3{color:var(--primary-dark);margin-bottom:1rem;font-size:1.1rem}.unit-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:.75rem;display:grid}.qual-unit-card{background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:8px;padding:1rem;transition:all .15s}.qual-unit-card:hover{border-color:var(--primary);box-shadow:0 2px 4px #0000001a}.qual-unit-card .unit-code{color:var(--primary);margin-bottom:.25rem;font-size:.9rem;font-weight:600;display:block}.qual-unit-card .unit-title{color:var(--text-light);font-size:.85rem;display:block}.qual-search{border-bottom:1px solid var(--border);padding:0 1rem 1rem}.qual-hint{color:var(--text-light);margin-top:.5rem;font-size:.9rem}.elective-groups{flex-direction:column;gap:.75rem;display:flex}.group{background:var(--surface);border:1px solid var(--border);border-radius:8px;overflow:hidden}.group-header{cursor:pointer;background:var(--bg);align-items:center;gap:.75rem;padding:1rem;transition:background .15s;display:flex}.group-header:hover{background:var(--border)}.group-toggle{color:var(--text-light);width:1rem;font-size:.75rem}.group-name{flex:1;font-weight:600}.group-count{color:var(--text-light);font-size:.85rem}.group-units{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:.5rem;padding:.75rem;display:grid}