:root{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#18181a;background:#f3f4f6;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--spinner-animation-speed: 2s}*{box-sizing:border-box}html,body,#root{min-width:100%;min-height:100%;margin:0}button,textarea,input{font:inherit}button{border:0}a{color:inherit}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{animation:spin var(--spinner-animation-speed) linear infinite}.notes-board{position:relative;width:100%;height:100vh;overflow:auto;background-color:#212228;background-image:linear-gradient(#292a30 .1em,transparent .1em),linear-gradient(90deg,#292a30 .1em,transparent .1em);background-size:4em 4em}.board-navigation{position:fixed;top:16px;right:20px;z-index:10000;display:flex;gap:8px;padding:6px;background:rgba(53,54,62,.94);border:1px solid rgba(255,255,255,.08);border-radius:12px;box-shadow:0 8px 24px #0000002e}.board-navigation a{padding:8px 12px;color:#f7f7f8;text-decoration:none;border-radius:8px}.board-navigation a:hover{background:rgba(255,255,255,.1)}.empty-board-message{position:absolute;top:50%;left:50%;display:flex;flex-direction:column;gap:5px;padding:18px 22px;color:#b8bac3;text-align:center;transform:translate(-50%,-50%)}.empty-board-message strong{color:#fff;font-size:18px}.card{position:absolute;width:400px;max-width:calc(100vw - 32px);overflow:hidden;cursor:default;border-radius:6px;box-shadow:0 1px 1px #00000013,0 2px 2px #00000013,0 4px 4px #00000013,0 8px 8px #00000013,0 16px 16px #00000013}.card-header{display:flex;align-items:center;justify-content:space-between;min-height:34px;padding:5px 7px;cursor:grab;-webkit-user-select:none;user-select:none}.card-header:active{cursor:grabbing}.card-saving{display:flex;align-items:center;gap:5px;font-size:13px}.card-body{padding:1em}.card-body textarea{display:block;width:100%;min-height:44px;padding:0;overflow:hidden;resize:none;background-color:inherit;border:none;outline:none;font-size:16px;line-height:1.5}.icon-button{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:2px;cursor:pointer;background:transparent;border-radius:6px}.icon-button:hover{background:rgba(0,0,0,.08)}.icon-button:disabled{cursor:wait;opacity:.5}#controls{position:fixed;top:50%;left:1em;z-index:10000;display:flex;flex-direction:column;align-items:center;gap:1em;padding:1em;transform:translateY(-50%);background-color:#35363e;border-radius:40px;box-shadow:0 1px 1px #00000013,0 2px 2px #00000013,0 4px 4px #00000013,0 8px 8px #00000013,0 16px 16px #00000013}#add-btn,.color{flex:0 0 auto;width:40px;height:40px;padding:0;cursor:pointer;border-radius:50%;transition:transform .16s ease,opacity .16s ease}#add-btn{display:flex;align-items:center;justify-content:center;background-color:#6b6b6b}#add-btn:hover,.color:hover{transform:scale(1.12)}#add-btn:disabled,.color:disabled{cursor:wait;opacity:.55;transform:none}.standard-page,.page-state{display:grid;min-height:100vh;place-items:center;padding:24px;background:linear-gradient(135deg,#f8fafc,#eef1f5)}.page-state{align-content:center;gap:12px;text-align:center}.page-card{width:min(100%,560px);padding:42px;background:#ffffff;border:1px solid #e1e4e8;border-radius:18px;box-shadow:0 24px 60px #1f29371a}.page-eyebrow{margin:0 0 8px;color:#646a73;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}.page-card h1,.page-state h1{margin:0 0 14px;font-size:clamp(32px,6vw,50px);line-height:1}.page-card p,.page-state p{color:#5c626c;line-height:1.65}.page-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}.primary-link,.secondary-link,.primary-button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;cursor:pointer;border-radius:9px;font-weight:650;text-decoration:none}.primary-link,.primary-button{color:#fff;background:#202228}.secondary-link{color:#202228;background:#eceef1}.primary-link:hover,.primary-button:hover{background:#343740}.secondary-link:hover{background:#dfe2e7}@media (max-width: 600px){.card{width:320px}.page-card{padding:28px}.board-navigation{top:10px;right:10px}}.auth-card{width:min(100%,480px)}.auth-form{display:grid;gap:18px;margin-top:28px}.form-field{display:grid;gap:7px}.form-field span{color:#30343b;font-size:14px;font-weight:700}.form-field input{width:100%;min-height:46px;padding:0 13px;color:#18181a;background:#ffffff;border:1px solid #cfd4dc;border-radius:9px;outline:none}.form-field input:focus{border-color:#595f69;box-shadow:0 0 0 3px #2022281a}.form-field small{color:#707680;font-size:12px}.auth-submit{width:100%;margin-top:4px}.primary-button:disabled,.auth-switch button:disabled{cursor:wait;opacity:.58}.auth-error{padding:12px 14px;color:#8b1e2d;background:#fff0f2;border:1px solid #f2c4cb;border-radius:9px;font-size:14px;line-height:1.5}.auth-switch{margin:22px 0 0;text-align:center}.auth-switch button{padding:3px 5px;cursor:pointer;color:#202228;background:transparent;font-weight:750;text-decoration:underline;text-underline-offset:3px}.account-details{display:grid;gap:0;margin:28px 0 0;border:1px solid #e1e4e8;border-radius:12px}.account-details div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:18px;padding:15px 17px}.account-details div+div{border-top:1px solid #e1e4e8}.account-details dt{color:#646a73;font-size:13px;font-weight:750}.account-details dd{min-width:0;margin:0;overflow-wrap:anywhere}.account-id{font-family:SFMono-Regular,Consolas,Liberation Mono,monospace;font-size:13px}@media (max-width: 600px){.account-details div{grid-template-columns:1fr;gap:5px}}.card{overflow:visible;border:2px solid transparent;transition:border-color .18s ease,box-shadow .18s ease,opacity .18s ease,filter .18s ease}.card-header{border-radius:4px 4px 0 0}.card-body{border-radius:0 0 4px 4px}.card--due-soon{border-color:#d97706b8}.card--overdue{border-color:#be185dcc;box-shadow:0 0 0 3px #be185d1f,0 16px 32px #0003}.card--completed{opacity:.72;filter:saturate(.72)}.card--completed .card-body textarea{text-decoration:line-through;opacity:.7}.card-header-actions,.note-actions{display:flex;align-items:center;gap:6px}.card-header-actions{min-width:0}.note-actions{position:relative}.deadline-status{display:inline-flex;align-items:center;max-width:126px;min-height:24px;padding:3px 8px;overflow:hidden;cursor:pointer;color:#334155;background:rgba(24,24,26,.08);border-radius:999px;font-size:11px;font-weight:750;line-height:1.2;text-overflow:ellipsis;white-space:nowrap}.deadline-status--upcoming{color:#334155;background:rgba(51,65,85,.11)}.deadline-status--due-soon{color:#92400e;background:rgba(245,158,11,.22)}.deadline-status--overdue{color:#9f1239;background:rgba(225,29,72,.18)}.deadline-status--completed{color:#166534;background:rgba(34,197,94,.2)}.note-action-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:27px;height:27px;padding:0;cursor:pointer;color:#18181aad;background:transparent;border:1px solid transparent;border-radius:7px}.note-action-icon:hover{color:#18181a;background:rgba(24,24,26,.09)}.note-action-icon--active{color:#78350f;background:rgba(245,158,11,.16)}.note-action-icon--completed{color:#166534;background:rgba(34,197,94,.18)}.note-action-icon:disabled,.deadline-status:disabled{cursor:wait;opacity:.52}.deadline-popover{position:absolute;top:calc(100% + 10px);right:0;z-index:20;display:grid;gap:14px;width:min(330px,calc(100vw - 40px));padding:15px;color:#18181a;background:#ffffff;border:1px solid #d8dce2;border-radius:12px;box-shadow:0 18px 50px #00000038,0 3px 10px #0000001a;cursor:default;-webkit-user-select:text;user-select:text}.deadline-popover-header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.deadline-popover-header>div{display:grid;gap:3px;min-width:0}.deadline-popover-header strong{font-size:15px}.deadline-popover-header span{overflow:hidden;color:#69707a;font-size:11px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.deadline-close{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;padding:0;cursor:pointer;color:#5d6470;background:#f0f2f5;border-radius:7px;font-size:20px;line-height:1}.deadline-close:hover{color:#18181a;background:#e4e7eb}.deadline-section{display:grid;gap:8px}.deadline-section+.deadline-section{padding-top:13px;border-top:1px solid #e5e7eb}.deadline-section-label,.deadline-picker span{color:#555d68;font-size:11px;font-weight:750;letter-spacing:.04em;text-transform:uppercase}.deadline-quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.deadline-quick-grid button,.deadline-custom-timer button,.deadline-save,.deadline-popover-footer button{min-height:32px;padding:0 10px;cursor:pointer;color:#25282e;background:#eef0f3;border-radius:7px;font-size:12px;font-weight:750}.deadline-quick-grid button:hover,.deadline-custom-timer button:hover,.deadline-popover-footer button:hover{background:#e0e3e8}.deadline-custom-timer{display:grid;grid-template-columns:70px 1fr auto;gap:6px}.deadline-custom-timer input,.deadline-custom-timer select,.deadline-picker input{width:100%;min-width:0;height:34px;padding:0 8px;color:#18181a;background:#ffffff;border:1px solid #ccd1d8;border-radius:7px;outline:none;font-size:12px}.deadline-custom-timer input:focus,.deadline-custom-timer select:focus,.deadline-picker input:focus{border-color:#6a717c;box-shadow:0 0 0 2px #18181a1a}.deadline-picker{display:grid;gap:5px}.deadline-save{justify-self:start;color:#fff;background:#202228}.deadline-save:hover{background:#343740}.deadline-popover-footer{display:flex;flex-wrap:wrap;gap:6px;padding-top:13px;border-top:1px solid #e5e7eb}.deadline-popover-footer .deadline-clear{margin-left:auto;color:#9f1239;background:#fff0f2}.deadline-popover-footer .deadline-clear:hover{background:#ffe1e6}.deadline-popover button:disabled,.deadline-popover input:disabled,.deadline-popover select:disabled{cursor:wait;opacity:.52}.note-meta-error{margin:0;color:#9f1239;font-size:12px;font-weight:650}@media (max-width: 600px){.deadline-status{max-width:94px}.deadline-popover{right:-4px}.deadline-custom-timer{grid-template-columns:64px 1fr}.deadline-custom-timer button{grid-column:1 / -1}}
