.topbar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--color-border)}.topbar-inner{min-height:68px;display:flex;align-items:center;justify-content:space-between;gap:1rem}.brand{display:flex;align-items:center;gap:.75rem;font-weight:750}.brand-mark{width:36px;height:36px;border-radius:10px;background:linear-gradient(135deg,var(--color-primary),#818cf8);color:#fff;display:grid;place-items:center}.nav{display:flex;gap:.25rem;overflow:auto}.nav a{padding:.5rem .75rem;border-radius:var(--radius-sm);color:var(--color-text-secondary);text-decoration:none;font-size:.875rem;white-space:nowrap}.nav a:hover{background:var(--color-primary-soft);color:var(--color-primary)}.hero{padding:5rem 0 3rem;background:radial-gradient(circle at 80% 10%,#e0e7ff 0,transparent 32%)}.eyebrow{color:var(--color-primary);text-transform:uppercase;letter-spacing:.12em;font-weight:750;font-size:.75rem}.hero p{max-width:680px}.swatch{border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden;background:var(--color-card);box-shadow:var(--shadow-sm)}.swatch-color{height:88px}.swatch-meta{padding:.85rem}.swatch-meta strong,.swatch-meta span{display:block}.swatch-meta span{color:var(--color-text-secondary);font-size:.75rem}.surface{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-3);box-shadow:var(--shadow-sm)}
.btn{appearance:none;border:1px solid transparent;border-radius:var(--radius-sm);display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font-weight:650;cursor:pointer;min-height:40px;padding:.55rem 1rem;transition:background var(--transition),border var(--transition),transform var(--transition),box-shadow var(--transition);text-decoration:none}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:focus-visible{outline:3px solid rgba(79,70,229,.25)}.btn-primary{background:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-hover)}.btn-secondary{background:var(--color-secondary);color:#fff}.btn-outline{background:#fff;border-color:var(--color-border);color:var(--color-text-primary)}.btn-outline:hover{border-color:var(--color-primary);color:var(--color-primary)}.btn-danger{background:var(--color-danger);color:#fff}.btn-text{background:transparent;color:var(--color-primary)}.btn-icon{width:40px;padding:0;background:#fff;border-color:var(--color-border);font-size:1.2rem}.btn-sm{min-height:32px;padding:.35rem .75rem;font-size:.8rem}.btn-lg{min-height:48px;padding:.75rem 1.4rem}.btn:disabled{opacity:.48;cursor:not-allowed}.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}
.field{display:flex;flex-direction:column}.input,.select,.textarea,.search-input{width:100%;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:#fff;color:var(--color-text-primary);min-height:42px;padding:.62rem .8rem;transition:border var(--transition),box-shadow var(--transition)}.textarea{min-height:108px;resize:vertical}.input:hover,.select:hover,.textarea:hover{border-color:#aeb6c5}.input:focus,.select:focus,.textarea:focus,.search-input:focus{border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(79,70,229,.12);outline:none}.input:disabled,.select:disabled,.textarea:disabled{background:#f1f3f6;color:#98a2b3;cursor:not-allowed}.field-error .input{border-color:var(--color-danger)}.field-success .input{border-color:var(--color-success)}.field-error .helper{color:var(--color-danger)}.field-success .helper{color:var(--color-success)}.check-row{display:flex;align-items:center;gap:.55rem}.check-row input{width:18px;height:18px;accent-color:var(--color-primary)}.switch{position:relative;width:44px;height:24px;display:inline-block}.switch input{opacity:0;width:0;height:0}.switch span{position:absolute;inset:0;border-radius:999px;background:#c5cad4;cursor:pointer;transition:.2s}.switch span::after{content:"";position:absolute;width:18px;height:18px;left:3px;top:3px;border-radius:50%;background:#fff;transition:.2s;box-shadow:var(--shadow-sm)}.switch input:checked+span{background:var(--color-primary)}.switch input:checked+span::after{transform:translateX(20px)}.switch input:focus-visible+span{outline:3px solid rgba(79,70,229,.25)}.file-upload{border:1px dashed #aeb6c5;border-radius:var(--radius-md);padding:1.5rem;text-align:center;background:#fafbfc}.search-wrap{position:relative}.search-wrap::before{content:"⌕";position:absolute;left:.8rem;top:50%;transform:translateY(-50%);color:var(--color-text-secondary)}.search-input{padding-left:2.2rem}
.badge{display:inline-flex;align-items:center;gap:.35rem;border-radius:var(--radius-full);padding:.25rem .6rem;font-size:.75rem;font-weight:700}.badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}.available,.active,.api-on{color:#087753;background:#e6f7f1}.reserved{color:#a15c00;background:#fff4dc}.sold,.inactive,.api-off{color:#b42318;background:#feeceb}.badge-info{color:#1d4ed8;background:#eaf1ff}
.card{background:var(--color-card);border:1px solid var(--color-border);border-radius:var(--radius-lg);padding:var(--space-3);box-shadow:var(--shadow-sm)}.card:hover{box-shadow:var(--shadow-md)}.card-kicker{font-size:.75rem;color:var(--color-text-secondary);text-transform:uppercase;letter-spacing:.08em}.project-visual{height:130px;border-radius:var(--radius-md);background:linear-gradient(140deg,#dfe5ff,#f4f6ff);display:grid;place-items:center;color:var(--color-primary);font-size:2rem;margin-bottom:1rem}.stat{font-size:2rem;font-weight:750;letter-spacing:-.04em}.unit-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;padding-top:1rem;border-top:1px solid var(--color-border);font-size:.8rem;color:var(--color-text-secondary)}
.table-wrap{overflow:auto;border:1px solid var(--color-border);border-radius:var(--radius-lg);background:#fff}.table{width:100%;border-collapse:collapse;min-width:700px}.table th,.table td{text-align:left;padding:.9rem 1rem;border-bottom:1px solid var(--color-border)}.table th{position:sticky;top:0;background:#f8f9fb;z-index:1;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary)}.table tbody tr:hover{background:#fafaff}.table-empty{text-align:center;padding:3rem!important;color:var(--color-text-secondary)}
.modal-backdrop{position:fixed;inset:0;z-index:50;background:rgba(15,23,42,.55);display:none;align-items:center;justify-content:center;padding:1rem}.modal-backdrop.open{display:flex}.modal{width:min(100%,520px);background:#fff;border-radius:var(--radius-lg);box-shadow:0 24px 80px rgba(0,0,0,.25);padding:1.5rem}.modal-header{display:flex;justify-content:space-between;gap:1rem}.modal-actions{display:flex;justify-content:flex-end;gap:.5rem;margin-top:1.5rem}.toast-region{position:fixed;right:1rem;bottom:1rem;z-index:70;display:grid;gap:.5rem}.toast{background:#172033;color:#fff;border-radius:var(--radius-md);padding:.85rem 1rem;box-shadow:var(--shadow-md);display:flex;gap:1rem;align-items:center;animation:toast-in .2s ease}.toast button{color:#fff;background:none;border:0;cursor:pointer}@keyframes toast-in{from{transform:translateY(10px);opacity:0}}.tooltip{position:relative}.tooltip:hover::after,.tooltip:focus-visible::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 8px);left:50%;transform:translateX(-50%);background:#172033;color:#fff;padding:.4rem .6rem;border-radius:.35rem;font-size:.75rem;white-space:nowrap;z-index:2}.dropdown{position:relative}.dropdown-menu{display:none;position:absolute;right:0;top:calc(100% + 6px);min-width:190px;background:#fff;border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-md);padding:.35rem;z-index:10}.dropdown-menu.open{display:block}.dropdown-menu a{display:block;padding:.55rem .7rem;text-decoration:none;color:var(--color-text-primary);border-radius:.35rem}.dropdown-menu a:hover,.dropdown-menu a:focus{background:var(--color-primary-soft)}.tabs{display:flex;gap:.25rem;border-bottom:1px solid var(--color-border);overflow:auto}.tab{border:0;background:transparent;padding:.7rem 1rem;color:var(--color-text-secondary);font-weight:650;cursor:pointer;border-bottom:2px solid transparent}.tab.active{color:var(--color-primary);border-color:var(--color-primary)}.tab-panel{padding:1rem 0}.pagination{display:flex;gap:.35rem}.page{width:36px;height:36px;border:1px solid var(--color-border);border-radius:.45rem;background:#fff;cursor:pointer}.page.active{background:var(--color-primary);color:#fff;border-color:var(--color-primary)}.breadcrumb{display:flex;gap:.5rem;align-items:center;list-style:none;padding:0;margin:0;color:var(--color-text-secondary);font-size:.875rem}.breadcrumb li+li::before{content:"/";margin-right:.5rem;color:#aeb6c5}.avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--color-primary-soft);color:var(--color-primary);font-weight:750}.avatar-sm{width:30px;height:30px;font-size:.75rem}.avatar-lg{width:52px;height:52px}.filter-bar{display:flex;gap:.75rem;flex-wrap:wrap;align-items:end}.filter-bar>*{flex:1 1 170px}.filter-bar .btn{flex:0 0 auto}.skeleton{height:16px;border-radius:6px;background:linear-gradient(90deg,#edf0f4 25%,#f7f8fa 50%,#edf0f4 75%);background-size:200% 100%;animation:shimmer 1.4s infinite}.skeleton.wide{width:85%}.skeleton.short{width:52%}.skeleton.block{height:100px}.skeleton-stack{display:grid;gap:.75rem}@keyframes shimmer{to{background-position:-200% 0}}.empty-state{text-align:center;padding:2.5rem 1rem}.empty-icon{width:56px;height:56px;border-radius:50%;background:var(--color-primary-soft);color:var(--color-primary);display:grid;place-items:center;margin:0 auto 1rem;font-size:1.4rem}.footer{padding:2rem 0;border-top:1px solid var(--color-border);color:var(--color-text-secondary)}
@media(max-width:760px){.nav{display:none}.filter-bar{align-items:stretch}.filter-bar .btn{flex:1 1 100%}.modal-actions{flex-direction:column-reverse}.modal-actions .btn{width:100%}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}
