/* Only page layout and project-specific preview sizing. UI components come from Tabler. */
:root{--tblr-sidebar-width:14rem;--tblr-sidebar-folded-width:4rem}
[hidden]{display:none!important}
body{font-family:system-ui,-apple-system,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}
#main{max-width:1640px}#main>.card,#main>.alert,#main>.stats-grid,#main>.detail-grid{margin-bottom:24px}
#main-nav .nav-link{width:100%;background:none;border:0;text-align:left}#main-nav .nav-link.active{background:rgba(255,255,255,.08)}
/* Use Tabler's native folded sidebar; these rules only size our brand/header. */
#brand-home{justify-content:flex-start;gap:12px;font-size:1rem;min-width:0;white-space:nowrap}
#brand-home .sidebar-label{overflow:hidden;text-overflow:ellipsis}
#shell>.page-wrapper{min-width:0}
#shell>.page-wrapper>.navbar>.container-fluid{gap:12px}
.hub-breadcrumb,.hub-account{min-width:0}
#account-name{display:block;max-width:10rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(min-width:992px){
 #sidebar-menu{overflow-x:hidden;overflow-y:auto}
 #sidebar .navbar-nav{flex-grow:0}
 #sidebar .nav-link-icon{flex-shrink:0}
 #brand-home{width:100%;margin:0;padding:16px}
 html[data-bs-sidebar=folded] #sidebar .sidebar-label{display:none}
 html[data-bs-sidebar=folded] #sidebar .nav-link-icon{margin-inline-end:0}
 html[data-bs-sidebar=folded] #sidebar-toggle .icon{transform:scaleX(-1)}
}
@media(max-width:991.98px){#sidebar-menu{max-height:calc(100dvh - 64px);overflow-y:auto}.hub-breadcrumb{flex-wrap:wrap}}
@media(max-width:575.98px){.hub-account{gap:8px!important}#account-name{max-width:7rem}.hub-breadcrumb .breadcrumb-item:first-child{display:none}.hub-breadcrumb .breadcrumb-item+.breadcrumb-item:before{display:none}}

.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.detail-grid>div>.card{margin-bottom:24px}
.filters{display:flex;gap:12px;max-width:100%;margin-left:auto}.filters .input-icon{width:280px;max-width:100%}.filters .form-select{width:140px}
.card-header{gap:16px;flex-wrap:wrap}.card-header .card-title{margin:0}.card-header .input-icon{width:280px;max-width:100%}
.template-grid,.template-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.template-library-grid{padding:24px}
.template-grid .card{position:relative;overflow:hidden}.template-grid .card>.badge{position:absolute;top:12px;right:12px;z-index:1}
.template-grid .card-header,.template-library-grid .card-header{position:relative;min-height:150px;font-size:24px;gap:12px}.template-library-grid .card-header{flex-direction:column}
.template-caption strong,.template-caption span{display:block}.template-caption span{margin-top:8px;font-size:12px;color:var(--tblr-secondary)}
.library-card-body .card-title{margin-bottom:12px}.library-card-body>.d-flex{margin-top:12px}
#template-projects{margin-top:24px}#template-project-filter{max-width:280px}.library-id{font-size:12px}.library-kind{font-size:11px}
.account-info>div{display:flex;flex-direction:column;gap:6px}.account-info label{font-size:12px;color:var(--tblr-secondary)}
.hub-route a{display:block;margin-top:6px;overflow-wrap:anywhere}.form-label .form-control,.form-label .form-select{margin-top:8px}
.form-check{display:block}.form-fieldset legend{float:none;font-size:14px;width:auto}
.table-responsive{overflow:auto}.table td{vertical-align:middle}.table td small{display:inline-block}.table .btn-link{padding-left:0;padding-right:12px}
.hub-ranking{display:grid;grid-template-columns:180px 1fr 80px;align-items:center;gap:20px;padding:14px 0}.hub-ranking strong{text-align:right}
.bars{max-height:320px;overflow:auto}.bars .progress{min-width:120px}

#preview-dialog .modal-dialog{max-width:490px}#preview-dialog.is-desktop .modal-dialog{max-width:min(1200px,96vw)}#preview-frame{display:block;width:100%;height:65vh;min-height:300px;border:1px solid var(--tblr-border-color);border-radius:var(--tblr-border-radius);background:#0f1115}
#preview-dialog [aria-pressed=true]{background:var(--tblr-primary);color:white}
#credentials-content code{overflow-wrap:anywhere;white-space:pre-wrap;text-align:right;user-select:all}#credentials-content label{min-width:56px;color:var(--tblr-secondary)}
.toast-container{z-index:1100}.toast{background:var(--tblr-bg-surface)}
.error-page{display:grid;place-items:center;min-height:100vh;background:#f6f8fb;margin:0}.empty-card{padding:40px;max-width:520px;text-align:center}.logo-mark{font-size:32px;color:#206bc4}
@media(max-width:1100px){.detail-grid{grid-template-columns:1fr}.stats-grid{gap:12px}.hub-ranking{grid-template-columns:130px 1fr 50px}}
@media(max-width:767px){#main{padding:0 16px}.stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.template-grid,.template-library-grid{grid-template-columns:1fr}.filters{width:100%;margin-left:0;flex-wrap:wrap}.filters .input-icon{flex:1;min-width:150px}.filters .form-select{width:120px}.card-header{padding:16px}.card-body{padding:16px}.template-library-grid{padding:16px}.hub-ranking{grid-template-columns:100px 1fr 40px;gap:10px}.modal-dialog{margin:12px}.page-header .btn-list{width:100%}}

/* Quest's preview tile reflects the landing theme; controls remain native Tabler. */
.card-header.quest{background:linear-gradient(135deg,#171717,#34302a)!important;color:#ffb435}
.card-header.quest strong{color:#ffb435}
.card-header.aivideo{background:linear-gradient(135deg,#11110f,#342b0d)!important;color:#ffd419}
.card-header.aivideo strong{color:#ffd419}

.template-permissions-toolbar{top:12px;z-index:2}