:root{color:#111827;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#f8fafc;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0}#root{overflow-x:hidden}button,input,textarea{letter-spacing:0}.notes-shell,.loading-screen{min-height:100vh}.notes-shell{color:#111827;background:radial-gradient(circle at 74% -10%,#84cc162b,#0000 32%),radial-gradient(circle at 18% 10%,#0f9f8f24,#0000 30%),#f8fafc;grid-template-columns:292px minmax(0,1fr);height:100vh;display:grid;overflow:hidden}.notes-shell.sidebar-collapsed{grid-template-columns:0 minmax(0,1fr)}.brand-block,.topbar,.search-box,.user-pill,.editor-toolbar,.toolbar-actions,.editor-footer,.sidebar-section-title,.status-toast{align-items:center;display:flex}.brand-block,.brand-identity{gap:12px}.brand-block{justify-content:space-between}.brand-identity{align-items:center;min-width:0;display:flex}.brand-mark{color:#fff;background:linear-gradient(135deg,#0f9f8f,#16a34a);border-radius:16px;place-items:center;width:46px;height:46px;font-size:14px;font-weight:900;display:grid;box-shadow:0 16px 36px #0f9f8f38}.brand-block strong{color:#111827;font-weight:850;display:block}.brand-block span,.sync-card .ui-card-description{color:#64748b;font-size:13px;font-weight:650}.notebook-sidebar{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#ffffffc7;border-right:1px solid #94a3b847;grid-template-rows:auto auto auto minmax(0,1fr) auto;gap:16px;height:100vh;min-height:0;padding:18px;transition:opacity .18s,transform .18s;display:grid;overflow:hidden}.sidebar-close{flex:none}.notebook-sidebar:not(.open){pointer-events:none;opacity:0;transform:translate(-18px)}.compose-button,.sync-card .ui-button{width:100%}.sidebar-section-title{color:#64748b;letter-spacing:.08em;text-transform:uppercase;justify-content:space-between;font-size:12px;font-weight:850}.notebook-list,.note-list{overscroll-behavior:contain;align-content:start;gap:8px;min-height:0;padding-right:2px;display:grid;overflow:auto}.notebook-row,.note-row{color:#111827;width:100%;font:inherit;cursor:pointer;text-align:left;background:0 0;border:1px solid #0000}.notebook-row{border-radius:15px;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:10px;min-height:44px;padding:0 10px;display:grid}.notebook-row i{background:var(--notebook-color);width:12px;height:12px;box-shadow:0 0 0 4px color-mix(in srgb, var(--notebook-color) 15%, transparent);border-radius:50%}.notebook-row span{text-overflow:ellipsis;white-space:nowrap;font-weight:760;overflow:hidden}.notebook-row small{color:#047857;background:#dcfce7;border-radius:999px;place-items:center;min-width:26px;min-height:24px;font-size:12px;font-weight:800;display:grid}.notebook-row:hover,.notebook-row.active,.note-row:hover,.note-row.active{background:#fff;border-color:#e2e8f0;box-shadow:0 14px 36px #0f172a0f}.workspace{grid-template-rows:auto minmax(0,1fr);min-width:0;height:100vh;min-height:0;display:grid;position:relative;overflow:hidden}.topbar{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#ffffffc7;border-bottom:1px solid #94a3b83d;gap:12px;min-width:0;padding:14px 18px}.search-box{color:#64748b;background:#fff;border:1px solid #e2e8f0;border-radius:999px;flex:1;gap:9px;min-width:180px;min-height:42px;padding:0 13px}.search-box input,.notebook-title-input,.title-editor,.body-editor,.editor-footer input{color:#111827;width:100%;font:inherit;background:0 0;border:0;outline:none}.search-box input::placeholder,.body-editor::placeholder,.editor-footer input::placeholder{color:#94a3b8}.user-pill{color:#475569;background:#fff;border:1px solid #e2e8f0;border-radius:999px;gap:8px;min-width:0;min-height:38px;padding:0 12px;font-size:13px;font-weight:750}.user-pill span{text-overflow:ellipsis;white-space:nowrap;max-width:170px;overflow:hidden}.workspace-grid{grid-template-columns:360px minmax(0,1fr);align-items:stretch;gap:18px;height:100%;min-height:0;padding:18px;display:grid;overflow:hidden}.note-list-panel,.editor-panel{background:#ffffffd1;border:1px solid #94a3b840;border-radius:28px;width:100%;min-width:0;max-width:100%;min-height:0;box-shadow:0 24px 70px #0f172a14}.note-list-panel{grid-template-rows:auto auto minmax(0,1fr);gap:12px;padding:18px;display:grid;overflow:hidden}.panel-heading{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.panel-heading p{color:#0f9f8f;letter-spacing:.08em;text-transform:uppercase;margin:0 0 5px;font-size:12px;font-weight:900}.panel-heading h1{letter-spacing:-.03em;margin:0;font-size:30px;line-height:1.05}.notebook-title-input{background:#f8fafc;border:1px solid #e2e8f0;border-radius:14px;min-height:42px;padding:0 12px;font-weight:760}.note-row{border-radius:20px;gap:12px;padding:14px;display:grid}.note-row strong{text-overflow:ellipsis;white-space:nowrap;margin-bottom:7px;font-size:15px;font-weight:850;display:block;overflow:hidden}.note-row div{min-width:0}.note-row span{color:#64748b;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:13px;line-height:1.45;display:-webkit-box;overflow:hidden}.note-row small{color:#16a34a;align-items:center;gap:6px;font-size:12px;font-weight:800;display:flex}.editor-panel{overscroll-behavior:contain;grid-template-rows:auto auto auto minmax(0,1fr) auto;padding:clamp(18px,3vw,30px);display:grid;overflow-y:auto}.editor-toolbar{justify-content:space-between;gap:10px;margin-bottom:18px}.toolbar-actions{flex-wrap:wrap;justify-content:flex-end;gap:8px}.panel-heading-actions{gap:4px;display:flex}.note-list-collapsed{grid-template-columns:minmax(0,1fr)}.note-list-collapsed .note-list-panel{display:none}.note-list-collapsed .editor-panel,.notes-shell.sidebar-collapsed .workspace-grid.note-list-collapsed .editor-panel{justify-self:stretch;width:100%;max-width:none;min-height:calc(100vh - 106px)}.ai-panel{background:radial-gradient(circle at 92% 0,#84cc1629,#0000 28%),#f7fef9;border:1px solid #bbf7d0;border-radius:24px;gap:12px;margin-bottom:18px;padding:16px;display:grid}.ai-panel-head{justify-content:space-between;gap:14px;display:flex}.ai-panel-head p{color:#0f9f8f;letter-spacing:.08em;text-transform:uppercase;margin:0 0 4px;font-size:12px;font-weight:900}.ai-panel-head h2{color:#0f172a;margin:0;font-size:20px;line-height:1.15}.ai-controls{grid-template-columns:minmax(0,1fr) auto;gap:10px;display:grid}.ai-controls input,.insert-menu input{color:#111827;min-height:42px;font:inherit;background:#fff;border:1px solid #dbe3ef;border-radius:999px;outline:none;padding:0 14px}.ai-action-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.ai-result{background:#fff;border:1px solid #e2e8f0;border-radius:18px;gap:10px;padding:12px;display:grid}.ai-result pre{color:#334155;max-height:240px;font:inherit;white-space:pre-wrap;margin:0;font-size:14px;line-height:1.55;overflow:auto}.ai-result div{flex-wrap:wrap;gap:8px;display:flex}.format-bar{background:#f8fafce6;border:1px solid #e2e8f0;border-radius:18px;flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:14px;padding:8px;display:flex;position:relative}.insert-menu-wrap{position:relative}.insert-menu{z-index:15;background:#fff;border:1px solid #e2e8f0;border-radius:20px;gap:4px;width:min(320px,100vw - 32px);padding:12px;display:grid;position:absolute;top:calc(100% + 8px);left:0;box-shadow:0 22px 70px #0f172a29}.insert-menu input{border-radius:14px;width:100%}.insert-menu p{color:#94a3b8;text-transform:uppercase;margin:12px 8px 4px;font-size:12px;font-weight:850}.insert-menu button{color:#334155;min-height:38px;font:inherit;cursor:pointer;text-align:left;background:0 0;border:0;border-radius:12px;align-items:center;gap:10px;padding:0 9px;font-size:14px;font-weight:720;display:flex}.insert-menu button:hover{color:#0f172a;background:#f1f5f9}.title-editor{color:#0f172a;letter-spacing:-.02em;resize:none;overflow-wrap:anywhere;white-space:pre-wrap;max-width:100%;font-size:clamp(22px,2.6vw,32px);font-weight:820;line-height:1.16;display:block;overflow:hidden}.note-editor-fields{grid-template-rows:auto minmax(360px,1fr);gap:12px;min-height:0;display:grid}.editor-field{gap:8px;display:grid}.editor-field span{color:#0f9f8f;letter-spacing:.08em;text-transform:uppercase;font-size:12px;font-weight:900}.editor-field textarea{background:#ffffffdb;border:1px solid #d5e6dc;border-radius:18px;outline:none;padding:16px;transition:border-color .16s,box-shadow .16s,background .16s}.editor-field textarea:focus{background:#fff;border-color:#0f9f8f;box-shadow:0 0 0 4px #0f9f8f1a}.editor-field-body{min-height:0}.body-editor{resize:none;overscroll-behavior:contain;color:#334155;height:100%;min-height:360px;font-size:17px;line-height:1.65;overflow-y:auto}.editor-footer{color:#64748b;border-top:1px solid #e2e8f0;gap:12px;min-height:52px;margin-top:18px;padding-top:16px}.editor-footer input{background:#f8fafc;border-radius:999px;min-height:36px;padding:0 12px;font-size:13px;font-weight:700}.editor-footer span{white-space:nowrap;font-size:12px;font-weight:800}.empty-state,.empty-editor,.loading-screen{text-align:center;place-items:center;display:grid}.empty-state{color:#64748b;gap:12px;min-height:240px}.empty-editor{color:#64748b;align-self:center;gap:12px}.empty-editor h2{color:#111827;letter-spacing:-.03em;margin:0;font-size:32px}.empty-editor p{max-width:420px;margin:0;line-height:1.55}.status-toast{z-index:30;color:#0f766e;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#fffffff0;border:1px solid #0f9f8f38;border-radius:18px;gap:10px;max-width:min(460px,100% - 36px);padding:12px 14px;font-size:13px;font-weight:760;position:fixed;bottom:18px;right:18px;box-shadow:0 22px 70px #0f172a24}.status-toast button{color:#0f766e;cursor:pointer;background:#ecfeff;border:0;border-radius:50%;place-items:center;width:24px;height:24px;display:grid}.about-body{gap:18px;padding:20px;display:grid}.about-body p{color:#475569;margin:0;line-height:1.65}.stack-grid{flex-wrap:wrap;gap:8px;display:flex}.loading-screen{color:#111827;background:#f8fafc;gap:16px;font-weight:800}.ui-button{min-height:40px;font:inherit;cursor:pointer;border:1px solid #0000;border-radius:999px;justify-content:center;align-items:center;gap:9px;font-size:14px;font-weight:800;transition:transform .16s,box-shadow .16s,background .16s,border-color .16s;display:inline-flex}.ui-button.default{color:#fff;background:linear-gradient(135deg,#0f9f8f,#16a34a);padding:0 16px}.ui-button.secondary{color:#111827;background:#fff;border-color:#e2e8f0;padding:0 15px}.ui-button.outline{color:#111827;background:0 0;border-color:#e2e8f0;padding:0 15px}.ui-button.ghost{color:#111827;background:0 0;padding:0 12px}.ui-button.icon{width:40px;padding:0}.ui-button:hover{transform:translateY(-1px);box-shadow:0 16px 28px #0f172a1f}.ui-button:disabled{cursor:not-allowed;opacity:.55;box-shadow:none;transform:none}.ui-card{background:#ffffffc7;border:1px solid #e2e8f0;border-radius:24px;box-shadow:0 18px 48px #0f172a0f}.ui-card-header{gap:6px;padding:17px 17px 0;display:grid}.ui-card-title{color:#111827;margin:0;font-size:18px;line-height:1.2}.ui-card-description{margin:0;line-height:1.45}.ui-card-content{padding:16px 17px 17px}.ui-badge{color:#047857;background:#ecfdf5;border:1px solid #0f9f8f24;border-radius:999px;align-items:center;min-height:28px;padding:0 10px;font-size:12px;font-weight:850;display:inline-flex}.ui-badge.secondary{color:#475569;background:#f8fafc;border-color:#e2e8f0}.ui-badge.outline{color:#c2410c;background:#fff7ed;border-color:#fed7aa}.dialog-backdrop{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#0f172a75;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.dialog-panel{background:#fff;border:1px solid #ffffff4d;border-radius:28px;width:min(620px,100%);box-shadow:0 30px 100px #0f172a3d}.dialog-header{border-bottom:1px solid #e2e8f0;justify-content:space-between;align-items:center;gap:18px;padding:18px 20px;display:flex}.dialog-header h2{letter-spacing:-.03em;margin:0;font-size:24px}.delete-dialog-body{gap:18px;padding:20px;display:grid}.delete-dialog-body p{color:#475569;margin:0;line-height:1.55}.delete-dialog-body strong{color:#0f172a}.delete-confirm-field{gap:8px;display:grid}.delete-confirm-field span{color:#dc2626;letter-spacing:.08em;text-transform:uppercase;font-size:12px;font-weight:900}.delete-confirm-field input{color:#111827;min-height:46px;font:inherit;background:#fff7f7;border:1px solid #fecaca;border-radius:16px;outline:none;padding:0 14px;font-weight:800}.delete-confirm-field input:focus{border-color:#dc2626;box-shadow:0 0 0 4px #dc26261a}.dialog-actions{flex-wrap:wrap;justify-content:flex-end;gap:10px;display:flex}@media (width<=1180px){.workspace-grid{grid-template-columns:minmax(300px,340px) minmax(0,1fr)}.workspace-grid.note-list-collapsed{grid-template-columns:minmax(0,1fr)}}@media (width<=1040px){.notes-shell,.notes-shell.sidebar-collapsed{grid-template-columns:1fr}.notebook-sidebar{display:none}.notebook-sidebar.open{z-index:25;width:min(312px,100% - 42px);display:grid;position:fixed;inset:0 auto 0 0;box-shadow:30px 0 90px #0f172a2e}.workspace{min-height:100vh;max-height:none}}@media (width<=760px){.notes-shell,.workspace{height:auto;min-height:100vh;overflow:visible}.workspace-grid{grid-template-columns:1fr;height:auto;overflow:visible}.note-list-collapsed .note-list-panel{display:none}.note-list-panel{height:min(520px,58vh);min-height:360px}.editor-panel{min-height:620px;max-height:none;overflow:visible}}@media (width<=640px){.workspace,.workspace-grid{width:100%;max-width:100%}.topbar{flex-wrap:wrap;gap:8px;padding:10px}.topbar .ui-button{min-height:38px;padding:0 12px}.topbar .ui-button.icon{width:38px;padding:0}.search-box{flex-basis:100%;order:5}.workspace-grid{grid-template-columns:minmax(0,calc(100vw - 24px));justify-content:start;gap:12px;padding:12px;overflow:hidden}.note-list-panel,.editor-panel{border-radius:22px;width:calc(100vw - 24px);max-width:calc(100vw - 24px)}.panel-heading,.panel-heading>div:first-child{min-width:0}.panel-heading-actions{flex-shrink:0;gap:2px}.panel-heading-actions .ui-button.icon{width:34px;min-height:34px;padding:0}.panel-heading-actions .ui-button:nth-child(2){display:none}.title-editor{word-break:break-word;font-size:32px}.note-row span{overflow-wrap:anywhere}.editor-toolbar,.editor-footer{flex-direction:column;align-items:flex-start}.toolbar-actions{justify-content:flex-start}.ai-panel-head,.ai-controls,.editor-toolbar{flex-direction:column;align-items:flex-start}.ai-action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ai-controls{width:100%;display:flex}.ai-controls input{width:100%}}
