:root{--surface:#fff;--surface-soft:#f7faf9;--shadow-sm:0 2px 8px rgba(15,55,52,.05);--shadow-md:0 12px 32px rgba(15,55,52,.09);--shadow-lg:0 24px 60px rgba(15,55,52,.14)}
body{background:linear-gradient(180deg,#f7fbfa 0,#f1f7f6 360px,#f4f8f7 100%)}
.topbar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.92);border-bottom:1px solid rgba(203,216,213,.75);box-shadow:0 4px 20px rgba(15,55,52,.04);backdrop-filter:blur(14px)}
.brand-mark{box-shadow:0 7px 18px rgba(15,148,136,.22)}
.dashboard{padding-top:42px}.page-head{align-items:end;margin-bottom:34px}.page-head h1{letter-spacing:-.035em}.eyebrow{letter-spacing:.14em}.muted{line-height:1.55}
.primary,.secondary,.edit-btn,.danger-button{transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease}.primary:hover,.secondary:hover,.edit-btn:hover,.danger-button:hover{transform:translateY(-1px)}.primary{box-shadow:0 9px 20px rgba(15,148,136,.18)}.secondary{background:rgba(255,255,255,.88);box-shadow:var(--shadow-sm)}
.summary-card,.panel,.settings-card,.auth-card{border-color:rgba(203,216,213,.82);box-shadow:var(--shadow-md)}.summary-card{transition:transform .2s ease,box-shadow .2s ease}.summary-card:hover{transform:translateY(-3px);box-shadow:0 17px 38px rgba(15,55,52,.11)}.panel{overflow:hidden}.transaction{transition:background .16s ease}.transaction:hover{background:#f8fbfa}
input,select,textarea{transition:border-color .18s ease,box-shadow .18s ease,background .18s ease;background:#fff!important}input:focus,select:focus,textarea:focus{border-color:#0f9488!important;box-shadow:0 0 0 4px rgba(15,148,136,.11)!important;outline:0}.modal-form{box-shadow:none}dialog{border:0!important;box-shadow:var(--shadow-lg)!important}dialog::backdrop{background:rgba(9,31,30,.52);backdrop-filter:blur(4px)}
.space-switch{display:grid;gap:7px;width:290px;margin-top:20px;position:relative;z-index:20}.space-label{font-size:13px;font-weight:800;color:#405c59}.space-menu{position:relative}.space-menu summary{height:46px;display:grid;grid-template-columns:24px minmax(0,1fr) 20px;align-items:center;gap:8px;padding:0 14px;background:#fff;border:1px solid #cbd8d5;border-radius:12px;box-shadow:var(--shadow-sm);font-size:14px;font-weight:800;cursor:pointer;list-style:none;transition:border-color .18s ease,box-shadow .18s ease}.space-menu summary::-webkit-details-marker{display:none}.space-menu summary:hover,.space-menu[open] summary{border-color:#7bc8c0;box-shadow:0 0 0 4px rgba(15,148,136,.08)}.space-menu summary>svg{width:19px;height:19px;fill:none;stroke:#5e7774;stroke-width:1.8;transition:transform .18s ease}.space-menu[open] summary>svg{transform:rotate(180deg)}.space-summary-icon{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;background:#e5f6f3;color:#0f766e;font-size:11px}.space-options{position:absolute;top:calc(100% + 8px);left:0;right:0;padding:7px;background:#fff;border:1px solid #d5e1df;border-radius:14px;box-shadow:var(--shadow-lg);animation:menuIn .16s ease}.space-options form{margin:0}.space-option{width:100%;display:grid;grid-template-columns:30px minmax(0,1fr) 20px;align-items:center;gap:8px;padding:10px;border:0;border-radius:10px;background:transparent;color:#173331;text-align:left;cursor:pointer}.space-option:hover{background:#f0f8f6}.space-option.active{background:#e9f7f4}.space-option>span:first-child{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#dff3ef;color:#0f766e;font-size:11px}.space-option>span:nth-child(2){display:grid;gap:2px}.space-option strong{font-size:13px}.space-option small{font-size:11px;color:#718784;font-weight:500}.space-option b{color:#0f9488;font-size:15px}@keyframes menuIn{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:none}}
.auth-card{box-shadow:var(--shadow-lg)}.social{transition:background .18s ease,border-color .18s ease,transform .18s ease}.social:hover{background:#f7faf9;transform:translateY(-1px)}.profile-preview{border:1px solid #e0ebe9}.settings-card{transition:box-shadow .2s ease}.settings-card:hover{box-shadow:0 16px 42px rgba(15,55,52,.1)}
@media(max-width:800px){.dashboard{padding-top:24px}.page-head{align-items:stretch}.space-switch{width:100%;max-width:420px}.head-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.head-actions .primary{grid-column:1/-1}.summary-card:hover{transform:none}.topbar{backdrop-filter:blur(10px)}}
