:root{--md-primary: #6750a4;--md-on-primary: #ffffff;--md-primary-container: #eaddff;--md-on-primary-container: #21005d;--md-surface: #141218;--md-on-surface: #e6e0e9;--md-surface-container: #211f26;--md-surface-container-high: #2b2930;--md-surface-container-highest: #36343b;--md-surface-container-low: #1d1b20;--md-surface-container-lowest: #0f0d13;--md-on-surface-variant: #cac4d0;--md-outline: #938f99;--md-outline-variant: #49454f;--md-error: #f2b8b5;--md-on-error: #601410;--md-background: #141218;--md-inverse-surface: #e6e0e9;--md-inverse-on-surface: #322f35;--font-sans: "Roboto Flex", system-ui, sans-serif;--font-mono: "Roboto Mono", ui-monospace, "SF Mono", monospace;--display-l: 700 3.5rem/4rem var(--font-sans);--headline-l: 700 2rem/2.5rem var(--font-sans);--headline-m: 700 1.5rem/2rem var(--font-sans);--title-l: 600 1.375rem/1.75rem var(--font-sans);--title-m: 600 1rem/1.5rem var(--font-sans);--title-s: 600 .875rem/1.25rem var(--font-sans);--body-l: 400 1rem/1.5rem var(--font-sans);--body-m: 400 .875rem/1.25rem var(--font-sans);--label-l: 600 .875rem/1.25rem var(--font-sans);--label-m: 600 .75rem/1rem var(--font-sans);--shape-xs: 8px;--shape-s: 12px;--shape-m: 16px;--shape-l: 24px;--shape-xl: 28px;--shape-2xl: 36px;--shape-full: 999px;--gap-1: 4px;--gap-2: 8px;--gap-3: 12px;--gap-4: 16px;--gap-5: 24px;--gap-6: 32px;--ease-emphasized: cubic-bezier(.2, 0, 0, 1);--ease-standard: cubic-bezier(.2, 0, 0, 1);--dur-short: .2s;--dur-medium: .4s;--elev-1: 0 1px 2px rgba(0, 0, 0, .18);--elev-2: 0 2px 8px rgba(0, 0, 0, .22);--elev-3: 0 6px 20px rgba(0, 0, 0, .28);color-scheme:dark}:root[data-theme=light]{color-scheme:light;--elev-1: 0 1px 2px rgba(0, 0, 0, .08);--elev-2: 0 2px 8px rgba(0, 0, 0, .1);--elev-3: 0 6px 20px rgba(0, 0, 0, .14)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font:var(--body-l);color:var(--md-on-surface);background:var(--md-background);-webkit-font-smoothing:antialiased;background-image:radial-gradient(1200px 600px at 80% -10%,color-mix(in srgb,var(--md-primary) 14%,transparent),transparent 70%);background-attachment:fixed}.material-symbols-rounded{font-family:Material Symbols Rounded;font-weight:400;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;direction:ltr;-webkit-font-feature-settings:"liga";font-feature-settings:"liga";-webkit-user-select:none;user-select:none;vertical-align:middle}button{font:inherit;cursor:pointer;border:none;background:none;color:inherit}input,textarea,select{font:inherit;color:inherit}a{color:var(--md-primary)}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:var(--md-outline-variant);border-radius:var(--shape-full);border:2px solid transparent;background-clip:padding-box}.app{display:flex;flex-direction:column;min-height:100dvh}.app-main{flex:1;width:100%;max-width:1400px;margin:0 auto;padding:var(--gap-4) var(--gap-5) 120px}.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:var(--gap-3);padding:var(--gap-3) var(--gap-5);background:color-mix(in srgb,var(--md-surface) 86%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--md-outline-variant)}.brand{display:flex;align-items:center;gap:var(--gap-2);font:var(--headline-m);letter-spacing:-.02em}.brand .logo{width:34px;height:34px;border-radius:var(--shape-s);display:grid;place-items:center;background:var(--md-primary);color:var(--md-on-primary);font-size:22px}.topbar-spacer{flex:1}.tabs{display:flex;gap:var(--gap-1);position:relative;background:var(--md-surface-container);padding:4px;border-radius:var(--shape-full)}.tab{position:relative;padding:8px 16px;border-radius:var(--shape-full);font:var(--label-l);color:var(--md-on-surface-variant);display:flex;align-items:center;gap:6px;z-index:1;transition:color var(--dur-short)}.tab[data-active=true]{color:var(--md-on-secondary-container, var(--md-on-surface))}.tab .material-symbols-rounded{font-size:20px}.tab>.material-symbols-rounded,.tab>.tab-label{position:relative;z-index:1}.tab-indicator{position:absolute;inset:4px auto 4px 0;background:var(--md-secondary-container, var(--md-primary-container));border-radius:var(--shape-full);z-index:0}.btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:var(--gap-2);padding:10px 22px;border-radius:var(--shape-full);font:var(--label-l);transition:box-shadow var(--dur-short),background var(--dur-short)}.btn .material-symbols-rounded{font-size:20px}.btn--filled{background:var(--md-primary);color:var(--md-on-primary)}.btn--tonal{background:var(--md-secondary-container, var(--md-primary-container));color:var(--md-on-secondary-container, var(--md-on-primary-container))}.btn--outlined{border:1px solid var(--md-outline);color:var(--md-primary)}.btn--text{color:var(--md-primary);padding:10px 14px}.btn--danger{background:var(--md-error);color:var(--md-on-error)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:currentColor;opacity:0;transition:opacity var(--dur-short)}.btn:hover:after{opacity:.08}.btn:active:after{opacity:.12}.icon-btn{position:relative;overflow:hidden;width:44px;height:44px;border-radius:var(--shape-full);display:grid;place-items:center;color:var(--md-on-surface-variant);transition:background var(--dur-short)}.icon-btn:hover{background:color-mix(in srgb,var(--md-on-surface) 8%,transparent)}.icon-btn .material-symbols-rounded{font-size:24px}.board{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--gap-4);align-items:start}@media (max-width: 900px){.board{grid-template-columns:1fr}}.column{background:var(--md-surface-container-low);border-radius:var(--shape-l);padding:var(--gap-3);min-height:200px;border:1px solid transparent;transition:border-color var(--dur-short),background var(--dur-short)}.column[data-over=true]{border-color:var(--md-primary);background:color-mix(in srgb,var(--md-primary) 8%,var(--md-surface-container-low))}.column-head{display:flex;align-items:center;gap:var(--gap-2);padding:6px 10px 12px;font:var(--title-m)}.column-head .count{margin-left:auto;font:var(--label-m);background:var(--md-surface-container-high);color:var(--md-on-surface-variant);padding:2px 10px;border-radius:var(--shape-full)}.column-list{display:flex;flex-direction:column;gap:var(--gap-3)}.card{background:var(--md-surface-container);border-radius:var(--shape-l);padding:var(--gap-4);box-shadow:var(--elev-1);cursor:grab;border:1px solid var(--md-outline-variant);display:flex;flex-direction:column;gap:var(--gap-2)}.card:active{cursor:grabbing}.card.dragging{box-shadow:var(--elev-3);opacity:.95}.card-title{font:var(--title-s);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.card-body-preview{font:var(--body-m);color:var(--md-on-surface-variant);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-family:var(--font-mono);font-size:.78rem}.card-meta{display:flex;align-items:center;gap:var(--gap-2);flex-wrap:wrap;margin-top:var(--gap-1)}.card-actions{display:flex;gap:var(--gap-1);margin-left:auto}.card.selected{outline:2px solid var(--md-primary);outline-offset:1px}.badge{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;border-radius:var(--shape-full);font:var(--label-m)}.badge .dot{width:8px;height:8px;border-radius:50%}.mini-btn{position:relative;overflow:hidden;width:34px;height:34px;border-radius:var(--shape-full);display:grid;place-items:center;color:var(--md-on-surface-variant)}.mini-btn:hover{background:color-mix(in srgb,var(--md-on-surface) 8%,transparent)}.mini-btn .material-symbols-rounded{font-size:20px}.fab{position:fixed;right:28px;bottom:28px;z-index:30;display:inline-flex;align-items:center;gap:var(--gap-2);height:60px;padding:0 22px;border-radius:var(--shape-l);background:var(--md-primary-container);color:var(--md-on-primary-container);box-shadow:var(--elev-3);font:var(--label-l)}.fab .material-symbols-rounded{font-size:26px}.chips{display:flex;gap:var(--gap-2);flex-wrap:wrap;margin-bottom:var(--gap-4)}.chip{display:inline-flex;align-items:center;gap:6px;padding:7px 14px;border-radius:var(--shape-s);border:1px solid var(--md-outline-variant);font:var(--label-l);color:var(--md-on-surface-variant);transition:background var(--dur-short),border-color var(--dur-short)}.chip[data-active=true]{background:var(--md-secondary-container, var(--md-primary-container));color:var(--md-on-secondary-container, var(--md-on-primary-container));border-color:transparent}.chip .dot{width:10px;height:10px;border-radius:50%}.search{display:flex;align-items:center;gap:var(--gap-2);background:var(--md-surface-container-high);border-radius:var(--shape-full);padding:10px 18px;flex:1;max-width:420px}.search input{border:none;background:none;outline:none;flex:1}.scrim{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:40;display:grid;place-items:center;padding:var(--gap-4)}.dialog{background:var(--md-surface-container-high);border-radius:var(--shape-xl);padding:var(--gap-5);width:min(560px,100%);box-shadow:var(--elev-3);display:flex;flex-direction:column;gap:var(--gap-4)}.dialog h2{font:var(--headline-m);margin:0}.sheet{background:var(--md-surface-container-high);border-radius:var(--shape-2xl);padding:var(--gap-5);width:min(720px,100%);max-height:88vh;overflow:auto;box-shadow:var(--elev-3);display:flex;flex-direction:column;gap:var(--gap-4)}.field{display:flex;flex-direction:column;gap:6px}.field label{font:var(--label-l);color:var(--md-on-surface-variant)}.input,.textarea,.select{width:100%;background:var(--md-surface-container-lowest);border:1px solid var(--md-outline);border-radius:var(--shape-s);padding:12px 14px;outline:none;transition:border-color var(--dur-short)}.input:focus,.textarea:focus,.select:focus{border-color:var(--md-primary);border-width:2px;padding:11px 13px}.textarea{font-family:var(--font-mono);font-size:.85rem;resize:vertical;min-height:240px;line-height:1.5}.row{display:flex;gap:var(--gap-3);align-items:center}.row-end{display:flex;gap:var(--gap-2);justify-content:flex-end}.switch{position:relative;width:52px;height:32px;border-radius:var(--shape-full);background:var(--md-surface-container-highest);border:2px solid var(--md-outline);transition:background var(--dur-short),border-color var(--dur-short);flex-shrink:0}.switch[data-on=true]{background:var(--md-primary);border-color:var(--md-primary)}.switch .knob{position:absolute;top:50%;left:6px;width:16px;height:16px;border-radius:50%;background:var(--md-outline);transform:translateY(-50%)}.switch[data-on=true] .knob{background:var(--md-on-primary)}.md-preview{font:var(--body-m);line-height:1.6}.md-preview pre{background:var(--md-surface-container-lowest);padding:var(--gap-3);border-radius:var(--shape-s);overflow:auto;font-family:var(--font-mono);font-size:.8rem}.md-preview code{font-family:var(--font-mono);background:var(--md-surface-container-lowest);padding:1px 5px;border-radius:5px}.md-preview pre code{padding:0;background:none}.md-preview h1,.md-preview h2,.md-preview h3{margin:.6em 0 .3em}.empty{text-align:center;color:var(--md-on-surface-variant);padding:var(--gap-6) var(--gap-4);display:flex;flex-direction:column;align-items:center;gap:var(--gap-2)}.empty .material-symbols-rounded{font-size:48px;opacity:.6}.skeleton{background:linear-gradient(90deg,var(--md-surface-container) 25%,var(--md-surface-container-high) 50%,var(--md-surface-container) 75%);background-size:200% 100%;animation:shimmer 1.4s infinite;border-radius:var(--shape-l);height:96px}@keyframes shimmer{to{background-position:-200% 0}}.list{display:flex;flex-direction:column;gap:var(--gap-2)}.list-item{display:flex;align-items:center;gap:var(--gap-3);padding:var(--gap-3) var(--gap-4);background:var(--md-surface-container);border-radius:var(--shape-m);border:1px solid var(--md-outline-variant)}.list-item .grow{flex:1;min-width:0}.list-item .lt{font:var(--title-s);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.footer{text-align:center;padding:var(--gap-5);color:var(--md-on-surface-variant);font:var(--label-m);border-top:1px solid var(--md-outline-variant)}.toast-region{position:fixed;left:50%;bottom:24px;transform:translate(-50%);z-index:60;display:flex;flex-direction:column;gap:var(--gap-2);align-items:center;pointer-events:none}.toast{display:flex;align-items:center;gap:var(--gap-2);background:var(--md-inverse-surface);color:var(--md-inverse-on-surface);padding:12px 20px;border-radius:var(--shape-s);box-shadow:var(--elev-3);font:var(--body-m)}.toast .material-symbols-rounded{font-size:20px}.toast--success .material-symbols-rounded{color:#7fd28a}.toast--error .material-symbols-rounded{color:var(--md-error)}.login-wrap{flex:1;min-height:0;display:grid;place-items:center;padding:var(--gap-4)}.login-card{background:var(--md-surface-container);border-radius:var(--shape-2xl);padding:var(--gap-6);width:min(420px,100%);box-shadow:var(--elev-3);display:flex;flex-direction:column;gap:var(--gap-4);text-align:center}.login-card .logo-xl{width:72px;height:72px;border-radius:var(--shape-l);background:var(--md-primary);color:var(--md-on-primary);display:grid;place-items:center;font-size:40px;margin:0 auto}.shortcuts{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-2) var(--gap-5)}.shortcut-row{display:flex;align-items:center;gap:var(--gap-3)}kbd{font-family:var(--font-mono);background:var(--md-surface-container-lowest);border:1px solid var(--md-outline-variant);border-radius:6px;padding:2px 8px;font-size:.78rem;min-width:22px;text-align:center}.swatches{display:flex;gap:var(--gap-2);flex-wrap:wrap}.swatch{width:40px;height:40px;border-radius:var(--shape-s);border:2px solid transparent}.swatch[data-active=true]{border-color:var(--md-on-surface)}.section{background:var(--md-surface-container-low);border-radius:var(--shape-l);padding:var(--gap-5);display:flex;flex-direction:column;gap:var(--gap-4);margin-bottom:var(--gap-4)}.section h3{font:var(--title-m);margin:0}.muted{color:var(--md-on-surface-variant);font:var(--body-m)}.tag{font:var(--label-m);color:var(--md-on-surface-variant);background:var(--md-surface-container-high);padding:2px 8px;border-radius:var(--shape-full)}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
