:root{--color-ivory: #F7F5F0;--color-white: #FFFFFF;--color-ink: #20211F;--color-ink-subtle: #3A3B37;--color-secondary-text: #777871;--color-muted-text: #96978E;--color-border-subtle: rgba(32, 33, 31, .07);--color-border-strong: rgba(32, 33, 31, .14);--color-lavender: #DCD5F5;--color-lavender-subtle: rgba(220, 213, 245, .28);--color-periwinkle: #B9C4F5;--color-periwinkle-subtle: rgba(185, 196, 245, .25);--color-coral: #D97868;--color-coral-subtle: rgba(217, 120, 104, .15);--color-sage: #DCE7DC;--color-sage-dark: #3F5E43;--color-sage-subtle: rgba(220, 231, 220, .45);--bg-app: #F7F5F0;--bg-surface: #FFFFFF;--bg-surface-translucent: rgba(255, 255, 255, .78);--bg-surface-elevated: #FFFFFF;--bg-panel: rgba(255, 255, 255, .88);--bg-panel-muted: rgba(247, 245, 240, .6);--font-serif: "Newsreader", Georgia, "Times New Roman", serif;--font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono: "Space Grotesk", ui-monospace, SFMono-Regular, monospace;--shadow-subtle: 0 1px 3px rgba(32, 33, 31, .03), 0 4px 12px rgba(32, 33, 31, .02);--shadow-card: 0 2px 8px rgba(32, 33, 31, .04), 0 12px 32px rgba(32, 33, 31, .05);--shadow-floating: 0 8px 24px rgba(32, 33, 31, .06), 0 24px 64px rgba(32, 33, 31, .08);--shadow-glow-periwinkle: 0 8px 32px rgba(185, 196, 245, .4);--shadow-glow-coral: 0 8px 28px rgba(217, 120, 104, .25);--radius-xs: 4px;--radius-sm: 8px;--radius-md: 14px;--radius-lg: 22px;--radius-xl: 32px;--radius-pill: 9999px;--transition-instant: .12s cubic-bezier(.2, 0, 0, 1);--transition-gentle: .24s cubic-bezier(.16, 1, .3, 1);--transition-smooth: .4s cubic-bezier(.16, 1, .3, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}body{font-family:var(--font-sans);background-color:var(--bg-app);color:var(--color-ink);line-height:1.6;min-height:100vh;overflow-x:hidden;background-image:radial-gradient(ellipse 60% 40% at 15% 0%,rgba(220,213,245,.35) 0%,transparent 70%),radial-gradient(ellipse 50% 35% at 85% 12%,rgba(185,196,245,.3) 0%,transparent 65%),radial-gradient(ellipse 40% 40% at 50% 100%,rgba(220,231,220,.3) 0%,transparent 70%);background-attachment:fixed}h1,h2,h3,h4,h5,h6{color:var(--color-ink);font-weight:500;line-height:1.18;letter-spacing:-.02em}.editorial-title{font-family:var(--font-serif);font-weight:400;letter-spacing:-.03em;line-height:1.08}.editorial-italic{font-style:italic;font-weight:300}p{color:var(--color-ink-subtle);font-size:.96rem;line-height:1.62}a{color:inherit;text-decoration:none}.app-container{display:flex;min-height:100vh;position:relative}.app-sidebar{width:256px;background:#f7f5f0d9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-right:1px solid var(--color-border-subtle);display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:50;padding:24px 16px 20px;transition:width var(--transition-gentle)}.sidebar-brand{display:flex;align-items:center;gap:10px;padding:4px 10px 24px;border-bottom:1px solid var(--color-border-subtle);margin-bottom:20px}.brand-symbol{width:32px;height:32px;border-radius:10px;background:linear-gradient(135deg,var(--color-periwinkle) 0%,var(--color-lavender) 50%,var(--color-coral) 100%);display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px #b9c4f566;position:relative;flex-shrink:0}.brand-symbol-dot{width:10px;height:10px;border-radius:50%;background:var(--color-white);box-shadow:0 0 8px #ffffffe6}.brand-text{display:flex;flex-direction:column}.brand-name{font-family:var(--font-serif);font-size:1.35rem;font-weight:500;letter-spacing:-.02em;color:var(--color-ink);line-height:1.1}.brand-tag{font-family:var(--font-mono);font-size:.65rem;text-transform:uppercase;letter-spacing:.08em;color:var(--color-secondary-text)}.sidebar-nav{display:flex;flex-direction:column;gap:4px;flex:1}.nav-item{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:var(--radius-sm);color:var(--color-secondary-text);font-size:.88rem;font-weight:500;background:transparent;border:1px solid transparent;transition:all var(--transition-instant);text-align:left;cursor:pointer;width:100%}.nav-item:hover{color:var(--color-ink);background:#fff9;border-color:#20211f0a}.nav-item.active{color:var(--color-ink);background:var(--color-white);border-color:var(--color-border-subtle);box-shadow:0 2px 6px #20211f0a;font-weight:600}.nav-item-icon{display:flex;align-items:center;justify-content:center;color:inherit;opacity:.85}.nav-item.active .nav-item-icon{color:var(--color-ink);opacity:1}.sidebar-footer{padding-top:16px;border-top:1px solid var(--color-border-subtle);display:flex;flex-direction:column;gap:12px}.demo-indicator{display:flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--radius-sm);background:#dce7dc80;border:1px solid rgba(63,94,67,.15);font-family:var(--font-mono);font-size:.72rem;color:var(--color-sage-dark)}.demo-dot{width:6px;height:6px;border-radius:50%;background:#2e7d32;box-shadow:0 0 6px #2e7d3280;animation:pulse-dot 2.4s ease-in-out infinite}.system-status{padding:4px 6px;font-size:.72rem;color:var(--color-muted-text);line-height:1.4;font-family:var(--font-mono)}.app-main{flex:1;min-width:0;display:flex;flex-direction:column;position:relative}.content-wrapper{flex:1;padding:36px 48px 80px;max-width:1440px;margin:0 auto;width:100%}@media (max-width: 960px){.app-sidebar{display:none}.content-wrapper{padding:20px 16px 60px}}.mobile-header{display:none;align-items:center;justify-content:space-between;padding:14px 20px;background:#f7f5f0f2;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--color-border-subtle);position:sticky;top:0;z-index:40}@media (max-width: 960px){.mobile-header{display:flex}}.mobile-nav-tray{display:flex;overflow-x:auto;gap:8px;padding:10px 16px;background:var(--color-white);border-bottom:1px solid var(--color-border-subtle);scrollbar-width:none}.mobile-nav-tray::-webkit-scrollbar{display:none}.glass-panel{background:var(--bg-panel);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.9);outline:1px solid var(--color-border-subtle);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);transition:all var(--transition-gentle)}.glass-panel:hover{box-shadow:var(--shadow-floating);outline-color:#20211f1a}.glass-panel-subtle{background:#ffffffa6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.85);outline:1px solid var(--color-border-subtle);border-radius:var(--radius-md);box-shadow:var(--shadow-subtle)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 18px;border-radius:var(--radius-pill);font-family:var(--font-sans);font-size:.86rem;font-weight:500;cursor:pointer;transition:all var(--transition-instant);border:1px solid transparent;white-space:nowrap}.btn-primary{background:var(--color-ink);color:var(--color-white);border-color:var(--color-ink);box-shadow:0 2px 8px #20211f26}.btn-primary:hover{background:var(--color-ink-subtle);box-shadow:0 4px 14px #20211f38;transform:translateY(-1px)}.btn-secondary{background:var(--color-white);color:var(--color-ink);border-color:var(--color-border-strong);box-shadow:var(--shadow-subtle)}.btn-secondary:hover{background:var(--color-ivory);border-color:var(--color-ink);transform:translateY(-1px)}.btn-coral{background:var(--color-coral);color:var(--color-white);box-shadow:var(--shadow-glow-coral)}.btn-coral:hover{background:#c86656;transform:translateY(-1px)}.btn-ghost{background:transparent;color:var(--color-secondary-text);border-color:transparent}.btn-ghost:hover{background:#20211f0a;color:var(--color-ink)}.btn-sm{padding:6px 13px;font-size:.78rem}.btn-xs{padding:4px 9px;font-size:.72rem}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:var(--radius-pill);font-family:var(--font-mono);font-size:.72rem;font-weight:500;letter-spacing:.02em}.badge-sage{background:var(--color-sage);color:var(--color-sage-dark);border:1px solid rgba(63,94,67,.15)}.badge-coral{background:var(--color-coral-subtle);color:#b24e3f;border:1px solid rgba(217,120,104,.25)}.badge-lavender{background:var(--color-lavender-subtle);color:#55448c;border:1px solid rgba(220,213,245,.5)}.badge-periwinkle{background:var(--color-periwinkle-subtle);color:#37468c;border:1px solid rgba(185,196,245,.5)}.badge-neutral{background:#20211f0d;color:var(--color-secondary-text);border:1px solid var(--color-border-subtle)}.input-editorial{width:100%;padding:10px 16px;border-radius:var(--radius-sm);background:var(--color-white);border:1px solid var(--color-border-strong);color:var(--color-ink);font-family:var(--font-sans);font-size:.9rem;transition:all var(--transition-instant);outline:none}.input-editorial:focus{border-color:var(--color-ink);box-shadow:0 0 0 3px #20211f14}.input-editorial::placeholder{color:var(--color-muted-text)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#20211f66;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.modal-content-wrapper{max-width:640px;width:100%;max-height:90vh;overflow-y:auto;border-radius:var(--radius-xl);background:var(--color-white);box-shadow:var(--shadow-floating);border:1px solid rgba(255,255,255,.8);outline:1px solid var(--color-border-subtle)}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.45;transform:scale(.85)}}@keyframes gentle-float{0%,to{transform:translateY(0)}50%{transform:translateY(-5px)}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}.toast-container{position:fixed;bottom:24px;right:24px;z-index:120;display:flex;flex-direction:column;gap:10px;max-width:420px;width:calc(100% - 48px)}.toast{padding:12px 18px;border-radius:var(--radius-md);background:var(--color-white);box-shadow:var(--shadow-floating);border:1px solid var(--color-border-subtle);display:flex;align-items:center;gap:12px;font-size:.86rem;color:var(--color-ink);animation:toast-slide-in .3s cubic-bezier(.16,1,.3,1);transition:all var(--transition-gentle)}.toast-success{border-left:4px solid var(--color-sage-dark)}.toast-error{border-left:4px solid var(--color-coral)}.toast-info{border-left:4px solid var(--color-periwinkle)}@keyframes toast-slide-in{0%{opacity:0;transform:translateY(16px) scale(.96)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#20211f73;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);display:flex;align-items:center;justify-content:center;z-index:100;padding:24px}.modal-content-wrapper{background:var(--color-white);border-radius:var(--radius-xl);box-shadow:var(--shadow-floating);border:1px solid rgba(255,255,255,.9);outline:1px solid var(--color-border-subtle);width:100%;max-height:90vh;overflow-y:auto;position:relative}.form-label{display:block;font-family:var(--font-mono);font-size:.74rem;color:var(--color-secondary-text);margin-bottom:6px;text-transform:uppercase;letter-spacing:.04em}.form-input{width:100%;padding:10px 16px;border-radius:var(--radius-sm);background:var(--color-white);border:1px solid var(--color-border-strong);color:var(--color-ink);font-family:var(--font-sans);font-size:.9rem;transition:all var(--transition-instant);outline:none}.form-input:focus{border-color:var(--color-ink);box-shadow:0 0 0 3px #20211f14}.empty-state{padding:64px 32px;text-align:center;border-radius:var(--radius-lg);background:var(--bg-panel);border:1px solid var(--color-border-subtle);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.empty-title{font-family:var(--font-serif);font-size:1.5rem;color:var(--color-ink)}.empty-desc{color:var(--color-secondary-text);max-width:440px;font-size:.9rem}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#20211f1f;border-radius:9999px}::-webkit-scrollbar-thumb:hover{background:#20211f38}.page-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:32px;flex-wrap:wrap;gap:16px}.page-title{font-family:var(--font-serif);font-size:2.4rem;font-weight:500;letter-spacing:-.02em;color:var(--color-ink);line-height:1.1}.page-desc{font-size:.96rem;color:var(--color-secondary-text);margin-top:6px;max-width:640px}.directory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(310px,1fr));gap:20px}@media (max-width: 640px){.directory-grid{grid-template-columns:1fr}}