:root{--bg:#f3efe7;--bg-strong:#e6dac9;--surface:rgba(255,252,247,0.96);--surface-muted:rgba(255,248,238,0.88);--border:rgba(113,89,64,0.18);--text:#20160f;--muted:#6f5b4d;--primary:#b25d2a;--primary-strong:#8d4520;--secondary:#2b5d67;--danger:#b34141;--success:#1f7a4d;--shadow:0 24px 70px rgba(73,49,29,0.12);--font-body:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;--font-display:Georgia,"Times New Roman",Times,serif}*{box-sizing:border-box}html{min-height:100%}body{margin:0;min-height:100vh;color:var(--text);font-family:var(--font-body);background:radial-gradient(circle at top left,rgba(178,93,42,.16),transparent 32%),radial-gradient(circle at right,rgba(43,93,103,.12),transparent 26%),linear-gradient(180deg,#fbf7f1 0,var(--bg) 100%)}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer;border:none}.main-layout{min-height:100vh;display:grid;grid-template-columns:280px minmax(0,1fr)}.sidebar{display:flex;flex-direction:column;gap:2rem;padding:2rem 1.5rem;background:linear-gradient(180deg,rgba(31,33,36,.95),rgba(43,33,28,.96)),linear-gradient(135deg,rgba(178,93,42,.2),transparent 65%);color:#fff8f0;border-right:1px solid rgba(255,255,255,.08)}.brand{display:flex;gap:1rem;align-items:center}.brand__badge{display:inline-flex;align-items:center;justify-content:center;width:3rem;height:3rem;border-radius:18px;background:linear-gradient(135deg,#ffc07d,#b25d2a);color:#24170f;font-weight:800;letter-spacing:.08em}.brand__title{margin:0;font-family:var(--font-display);font-size:1.5rem}.brand__subtitle{margin:.35rem 0 0;color:rgba(255,248,240,.72);line-height:1.5}.sidebar__nav{display:grid;grid-gap:.75rem;gap:.75rem}.nav-link{padding:.95rem 1rem;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-weight:600;transition:transform .2s ease,background .2s ease,border-color .2s ease}.nav-link:hover{transform:translateX(4px);background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.16)}.sidebar__footer{margin-top:auto;padding:1.25rem;border-radius:22px;background:rgba(255,248,240,.08);border:1px solid rgba(255,248,240,.08)}.sidebar__footer-text{margin:.85rem 0 0;color:rgba(255,248,240,.76);line-height:1.6}.layout__content{display:flex;flex-direction:column;min-width:0}.topbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.4rem 2rem 0}.page{display:flex;flex-direction:column;gap:1.5rem;padding:1.2rem 2rem 2rem}.page__header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-end}.page__title{margin:0;font-size:clamp(1.8rem,2vw,2.4rem);font-family:var(--font-display)}.page__description{margin:.45rem 0 0;color:var(--muted);max-width:60ch;line-height:1.65}.chip{display:inline-flex;align-items:center;gap:.5rem;padding:.45rem .8rem;border-radius:999px;background:rgba(255,255,255,.12);color:inherit;font-size:.85rem;font-weight:700;letter-spacing:.03em}.user-summary{display:flex;align-items:center;gap:.85rem}.user-summary__name{margin:0;font-weight:700}.user-summary__meta{margin:.18rem 0 0;color:var(--muted)}.avatar{display:inline-flex;align-items:center;justify-content:center;width:2.8rem;height:2.8rem;border-radius:50%;background:linear-gradient(135deg,#2b5d67,#7cb1a4);color:white;font-weight:800}.content-grid,.stats-grid{display:grid;grid-gap:1rem;gap:1rem}.stats-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.content-grid--two{grid-template-columns:repeat(2,minmax(0,1fr))}.card,.login-card,.stat-card{background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}.stat-card{padding:1.35rem;border-radius:24px}.stat-card__label{margin:0;color:var(--muted);font-size:.94rem}.stat-card__value{display:block;margin-top:.65rem;font-size:2rem;font-family:var(--font-display)}.stat-card__helper{margin:.75rem 0 0;color:var(--muted);line-height:1.55}.card{border-radius:28px;overflow:hidden}.card__header{padding:1.4rem 1.4rem 0}.card__title{margin:0;font-size:1.25rem;font-family:var(--font-display)}.card__description{margin:.45rem 0 0;color:var(--muted);line-height:1.6}.card__content{padding:1.4rem}.banner{padding:.9rem 1rem;border-radius:18px;border:1px solid transparent;line-height:1.6}.banner--success{background:rgba(31,122,77,.09);border-color:rgba(31,122,77,.2);color:#145836}.banner--error{background:rgba(179,65,65,.1);border-color:rgba(179,65,65,.22);color:#7a2323}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:1rem;gap:1rem}.field{display:grid;grid-gap:.45rem;gap:.45rem;color:var(--muted);font-weight:600}.field--wide{grid-column:1/-1}.input,.select,.textarea{width:100%;padding:.9rem 1rem;border-radius:16px;border:1px solid rgba(113,89,64,.18);background:var(--surface-muted);color:var(--text);transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.input:focus,.select:focus,.textarea:focus{outline:none;border-color:rgba(178,93,42,.5);box-shadow:0 0 0 4px rgba(178,93,42,.12);background:#fffdf9}.textarea{resize:vertical;min-height:140px}.button{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:46px;padding:.85rem 1.15rem;border-radius:16px;background:linear-gradient(135deg,var(--primary),var(--primary-strong));color:white;transition:transform .2s ease,opacity .2s ease}.button:hover{transform:translateY(-1px)}.button--secondary{background:linear-gradient(135deg,var(--secondary),#1d434b)}.button--secondary:hover{background:#ddd6fe}.button--danger{background:linear-gradient(135deg,var(--danger),#8d2d2d)}.checkbox-row{display:inline-flex;align-items:center;gap:.75rem;color:var(--text);font-weight:600}.checkbox-row--wide{grid-column:1/-1}.checkbox-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:.75rem;gap:.75rem;margin-top:.5rem}.checkbox-card{display:flex;align-items:start;gap:.75rem;padding:.85rem .95rem;border-radius:18px;border:1px solid var(--border);background:rgba(255,248,238,.76);color:var(--text)}.checkbox-card span{display:grid;grid-gap:.15rem;gap:.15rem}.checkbox-card small{color:var(--muted)}.stack{display:grid;grid-gap:1rem;gap:1rem}.item-card{padding:1.1rem;border-radius:20px;border:1px solid var(--border);background:rgba(255,249,241,.76)}.item-card--dense{padding:1rem}.item-card__header,.meta-row,.status-row{display:flex;justify-content:space-between;gap:1rem}.highlight-card strong,.item-card__header h4{margin:0}.item-card__header p,.status-row p{margin:.35rem 0 0;color:var(--muted);line-height:1.55}.meta-row{flex-wrap:wrap;margin-top:.95rem;color:var(--muted);font-size:.94rem}.status-list{display:grid;grid-gap:.8rem;gap:.8rem;margin-top:1rem}.status-row{align-items:center;padding-top:.8rem;border-top:1px dashed rgba(113,89,64,.18)}.status-row__right{display:grid;justify-items:end;grid-gap:.35rem;gap:.35rem;color:var(--muted);text-align:right}.status-badge{display:inline-flex;align-items:center;justify-content:center;padding:.45rem .8rem;border-radius:999px;font-size:.85rem;font-weight:700}.status-badge--pending{background:rgba(178,93,42,.12);color:#8d4520}.status-badge--completed{background:rgba(31,122,77,.12);color:#1a673f}.status-badge--info{background:rgba(43,93,103,.12);color:#1f4f58}.status-badge--neutral{background:rgba(111,91,77,.12);color:#594539}.details-card{margin-top:1rem;padding-top:1rem;border-top:1px dashed rgba(113,89,64,.18)}.details-card__summary{font-weight:700;color:var(--primary-strong);cursor:pointer;margin-bottom:1rem}.form-actions,.inline-form{margin-top:1rem}.profile-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:1rem;gap:1rem}.profile-item{display:grid;grid-gap:.35rem;gap:.35rem;padding:1rem;border-radius:18px;background:rgba(255,248,238,.82);border:1px solid var(--border)}.profile-item span{color:var(--muted)}.empty-state{padding:1.6rem;border-radius:20px;background:rgba(255,248,238,.72);border:1px dashed rgba(113,89,64,.24)}.demo-box h3,.empty-state h3{margin:0}.empty-state p,.muted-text{color:var(--muted);line-height:1.65}.login-shell{min-height:100vh;display:grid;grid-template-columns:1.15fr .85fr;padding:1.5rem;grid-gap:1.5rem;gap:1.5rem}.login-panel{min-width:0;border-radius:32px;overflow:hidden}.login-panel--brand{display:flex;flex-direction:column;justify-content:space-between;padding:2.5rem;background:radial-gradient(circle at top right,rgba(255,201,137,.28),transparent 32%),linear-gradient(135deg,#8855e4,#6e2bd6 45%,#6d28d9);color:#fff7ee;box-shadow:var(--shadow)}.login-panel--brand h1{margin:1rem 0;font-family:var(--font-display);font-size:clamp(2.4rem,4vw,4.4rem);line-height:1.05}.login-panel--brand p{max-width:56ch;line-height:1.75;color:rgba(255,247,238,.82)}.login-highlights{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:1rem;gap:1rem}.highlight-card{display:grid;grid-gap:.5rem;gap:.5rem;padding:1.25rem;border-radius:22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.12)}.highlight-card span{color:rgba(255,247,238,.72);line-height:1.6}.login-panel--form{display:flex;align-items:center;justify-content:center}.login-card{width:min(100%,520px);padding:2rem;border-radius:32px}.login-card h2{margin:0;font-family:var(--font-display);font-size:2rem}.login-card p{color:var(--muted);line-height:1.65}.demo-box{margin-top:1.5rem;padding:1.1rem;border-radius:20px;background:rgba(255,248,238,.82);border:1px solid var(--border)}.demo-box ul{margin:.9rem 0 0;padding-left:1.1rem;color:var(--muted);line-height:1.75}@media (max-width:1120px){.content-grid--two,.login-shell,.main-layout,.stats-grid{grid-template-columns:1fr}.sidebar{padding-bottom:1rem}}@media (max-width:900px){.main-layout{display:flex;flex-direction:column}.sidebar{gap:1rem;border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}.sidebar__nav{grid-template-columns:repeat(2,minmax(0,1fr))}.page,.topbar{padding-left:1rem;padding-right:1rem}.item-card__header,.page__header,.status-row{flex-direction:column;align-items:flex-start}.status-row__right{justify-items:start;text-align:left}.checkbox-grid,.form-grid,.login-highlights,.profile-grid{grid-template-columns:1fr}.checkbox-row--wide,.field--wide{grid-column:auto}}@media (max-width:640px){.topbar{flex-direction:column;align-items:start}.sidebar__nav{grid-template-columns:1fr}.login-card,.login-panel--brand{padding:1.4rem}}.topbar-actions{display:flex;align-items:center;gap:14px}.notification-bell,.notification-dropdown{position:relative}.notification-summary{list-style:none;cursor:pointer;position:relative;width:42px;height:42px;border-radius:999px;background:#f3f0ff;border:1px solid #ddd6fe;display:flex;align-items:center;justify-content:center}.notification-summary::-webkit-details-marker{display:none}.notification-summary__icon{font-size:18px}.notification-count{position:absolute;top:-6px;right:-6px;min-width:20px;height:20px;border-radius:999px;background:#dc2626;color:white;font-size:12px;font-weight:700;display:inline-flex;align-items:center;justify-content:center;padding:0 6px}.notification-menu{position:absolute;right:0;top:50px;width:360px;max-height:430px;overflow:auto;background:white;border:1px solid #e5e7eb;border-radius:18px;box-shadow:0 20px 40px rgba(0,0,0,.16);padding:14px;z-index:100}.notification-menu__header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:14px}.notification-menu__subtext{margin:4px 0 0;font-size:13px;color:#6b7280}.notification-menu__actions{display:flex;align-items:center;gap:10px}.notification-link{font-size:13px;font-weight:600;color:#6d28d9;text-decoration:none}.notification-link:hover{text-decoration:underline}.notification-empty{padding:18px 12px;text-align:center;color:#6b7280}.notification-list,.notification-page-list{display:grid;grid-gap:12px;gap:12px}.notification-item{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;border:1px solid #ececec;border-radius:14px;padding:14px;background:#fff}.notification-item--unread{border-color:#c4b5fd;background:#f5f3ff}.notification-item__body{display:grid;grid-gap:6px;gap:6px}.notification-item__body strong{font-size:14px;color:#111827}.notification-item__body p{margin:0;font-size:14px;line-height:1.5;color:#374151}.notification-item__time{font-size:12px;color:#6b7280}.notification-read-badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;padding:8px 10px;border-radius:999px;background:#ecfdf5;color:#047857;font-size:12px;font-weight:700}.form-field{display:grid;grid-gap:8px;gap:8px}.form-field label{font-size:13px;font-weight:700;color:#334155}.form-field input,.form-field select,.form-field textarea{width:100%;min-height:44px;padding:12px 14px;border-radius:12px;border:1px solid rgba(148,163,184,.28);background:#ffffff;color:#0f172a;font-size:14px;outline:none;transition:.18s ease;box-sizing:border-box}.form-field textarea{min-height:96px;resize:vertical}.form-field input:focus,.form-field select:focus,.form-field textarea:focus{border-color:rgba(37,99,235,.55);box-shadow:0 0 0 4px rgba(37,99,235,.1)}.form-field input::placeholder,.form-field textarea::placeholder{color:#94a3b8}.button{border:none;border-radius:12px;padding:11px 16px;font-size:13px;font-weight:700;cursor:pointer;transition:.2s ease}.button--primary{background:linear-gradient(135deg,#2563eb,#1d4ed8);color:white;box-shadow:0 8px 20px rgba(37,99,235,.22)}.button--primary:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(37,99,235,.28)}.button--secondary{background:#f8fafc;color:#334155;border:1px solid rgba(148,163,184,.3)}.button--secondary:hover{background:#eef2f7}