:root { --bg:#f7f5f0; --surface:#fffdfa; --surface-2:#f1eee7; --ink:#24231f; --muted:#77736b; --line:#e5e0d6; --accent:#e16c42; --accent-soft:#fce5dc; --sage:#5f8876; --shadow:0 12px 30px rgba(57,44,28,.08); }
:root[data-theme="dark"] { --bg:#161714; --surface:#20211d; --surface-2:#292a25; --ink:#eeece5; --muted:#aaa69d; --line:#363730; --accent:#f08a5b; --accent-soft:#42291f; --sage:#98c2aa; --shadow:0 14px 34px rgba(0,0,0,.28); }
*{box-sizing:border-box} body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh} button,input,textarea,select{font:inherit} button{cursor:pointer;color:inherit}.app-shell{min-height:100vh;display:flex}.sidebar{width:264px;padding:25px 16px 16px;background:var(--surface);border-right:1px solid var(--line);display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:5}.brand{font-family:Georgia,serif;font-size:22px;font-weight:700;display:flex;align-items:center;gap:10px;padding:0 10px 27px}.brand-mark{display:grid;place-items:center;width:30px;height:30px;background:var(--ink);color:var(--surface);border-radius:9px;font-family:Georgia,serif;font-style:italic}.accent{color:var(--accent)}.new-note,.primary-action{border:0;background:var(--ink);color:var(--surface);border-radius:11px;font-weight:650;letter-spacing:-.01em}.new-note{padding:12px 14px;text-align:left;font-size:14px;margin:0 3px 23px}.new-note span{font-size:20px;line-height:11px;vertical-align:-2px;margin-right:7px}.nav{display:grid;gap:3px}.nav-item{border:0;background:transparent;display:flex;align-items:center;gap:11px;width:100%;padding:10px;border-radius:9px;text-align:left;color:var(--muted);font-size:14px}.nav-item b{font-size:11px;background:var(--surface-2);padding:2px 7px;border-radius:7px;margin-left:auto}.nav-item.active,.nav-item:hover{background:var(--surface-2);color:var(--ink)}.section-label{font-size:10px;font-weight:750;letter-spacing:.13em;color:var(--muted);padding:29px 10px 8px;display:flex;justify-content:space-between}.section-label button{border:0;background:none;font-size:19px;line-height:10px;color:var(--muted)}.notebooks{display:grid;gap:3px}.notebook-item{border:0;background:transparent;border-radius:8px;color:var(--muted);text-align:left;padding:9px 10px;font-size:13px;display:flex;gap:9px;align-items:center}.notebook-item:hover,.notebook-item.selected{background:var(--surface-2);color:var(--ink)}.notebook-dot{height:8px;width:8px;border-radius:50%;background:var(--dot,#e16c42)}.sidebar-bottom{margin-top:auto}.sync-status{padding:13px 10px;color:var(--muted);font-size:11px;border-top:1px solid var(--line)}.status-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--sage);margin-right:6px}.profile{padding:10px;width:100%;display:flex;align-items:center;gap:9px;border:0;border-radius:9px;background:transparent;text-align:left}.profile:hover{background:var(--surface-2)}.avatar{display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#d5b075;color:#3e2c16;font-size:12px;font-weight:700}.profile strong,.profile small{display:block}.profile strong{font-size:12px}.profile small{font-size:10px;color:var(--muted);margin-top:2px}.profile i{font-style:normal;margin-left:auto;color:var(--muted)}.main{margin-left:264px;width:calc(100% - 264px);min-height:100vh}.topbar{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,4vw,58px);position:sticky;top:0;background:color-mix(in srgb,var(--bg) 92%,transparent);backdrop-filter:blur(12px);z-index:3}.search{height:38px;width:min(410px,62vw);background:var(--surface);border:1px solid var(--line);border-radius:9px;display:flex;gap:9px;align-items:center;padding:0 11px;color:var(--muted)}.search span{font-size:22px;line-height:1}.search input{border:0;background:transparent;outline:0;color:var(--ink);width:100%;font-size:13px}.search kbd{font-size:10px;border:1px solid var(--line);background:var(--surface-2);padding:3px 5px;border-radius:4px}.top-actions{display:flex;gap:7px}.icon-button,.sort-button{border:1px solid var(--line);background:var(--surface);border-radius:9px}.icon-button{width:36px;height:36px;font-size:17px}.moon{display:none}:root[data-theme="dark"] .sun{display:none}:root[data-theme="dark"] .moon{display:inline}.mobile-menu{display:none}.content{max-width:1190px;margin:auto;padding:clamp(35px,5vw,67px) clamp(22px,4vw,58px) 80px}.welcome-row{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.eyebrow{margin:0 0 8px;color:var(--accent);font-size:11px;letter-spacing:.11em;font-weight:750;text-transform:uppercase}.welcome-row h1{font-family:Georgia,serif;font-size:clamp(29px,4vw,43px);letter-spacing:-.045em;margin:0}.muted{color:var(--muted);margin:9px 0 0;font-size:15px}.primary-action{padding:12px 17px;font-size:13px;white-space:nowrap}.quick-capture{margin:40px 0 51px;padding:7px;border:1px solid var(--line);border-radius:16px;background:var(--surface);display:grid;grid-template-columns:repeat(4,1fr);box-shadow:var(--shadow)}.quick-capture button{border:0;background:transparent;display:flex;align-items:center;gap:11px;text-align:left;padding:14px 12px;border-radius:11px}.quick-capture button:hover{background:var(--surface-2)}.capture-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:18px}.note-icon{background:#fbe2d7;color:#b64d2c}.audio-icon{background:#e2eee6;color:#42725c}.image-icon{background:#e1e7f5;color:#5571aa}.draw-icon{background:#eee4f5;color:#79569a}.quick-capture strong,.quick-capture small{display:block}.quick-capture strong{font-size:13px}.quick-capture small{font-size:11px;color:var(--muted);margin-top:3px}.list-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:19px}.list-heading h2{margin:0;font-family:Georgia,serif;font-size:24px;letter-spacing:-.025em}.list-heading p{margin:5px 0 0;font-size:12px;color:var(--muted)}.sort-button{font-size:12px;padding:8px 10px;color:var(--muted)}.note-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.note-card{border:1px solid var(--line);background:var(--surface);border-radius:15px;padding:17px;min-height:198px;display:flex;flex-direction:column;transition:.18s transform,.18s box-shadow;cursor:pointer}.note-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}.card-top{display:flex;justify-content:space-between;align-items:center}.notebook-pill{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.03em;display:flex;gap:6px;align-items:center}.notebook-pill::before{content:"";height:7px;width:7px;border-radius:99px;background:var(--pill,#e16c42)}.star-card,.star-editor{border:0;background:transparent;color:var(--muted);font-size:20px;line-height:1;padding:2px}.star-card.starred,.star-editor.starred{color:#d99827}.note-card h3{font-family:Georgia,serif;font-size:18px;line-height:1.2;margin:21px 0 8px;letter-spacing:-.02em}.preview{font-size:12px;color:var(--muted);line-height:1.55;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.card-bottom{border-top:1px solid var(--line);padding-top:12px;margin-top:auto;display:flex;align-items:center;gap:9px}.card-date{font-size:10px;color:var(--muted);white-space:nowrap}.tag-list{display:flex;gap:4px;overflow:hidden}.tag-list span{font-size:9px;padding:3px 6px;border-radius:5px;background:var(--surface-2);color:var(--muted);white-space:nowrap}.overlay{display:none}.editor{border:0;background:transparent;padding:0;width:min(800px,calc(100vw - 30px));max-height:90vh}.editor::backdrop{background:rgba(24,22,18,.45);backdrop-filter:blur(3px)}.editor-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.22)}.editor-top{height:61px;border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 17px;gap:13px}.close-editor{border:0;background:transparent;font-size:28px;color:var(--muted);line-height:1}.save-indicator{font-size:11px;color:var(--muted);margin-left:auto}.save-button{border:0;background:var(--ink);color:var(--surface);font-weight:700;font-size:12px;border-radius:8px;padding:9px 14px}.editor-body{padding:29px 40px 25px}.editor-body select{border:0;color:var(--accent);background:var(--accent-soft);border-radius:6px;padding:5px 8px;font-size:11px;font-weight:700}.title-input{display:block;border:0;outline:0;background:transparent;color:var(--ink);font-family:Georgia,serif;font-size:31px;letter-spacing:-.04em;width:100%;padding:19px 0 16px}.editor-tools{display:flex;align-items:center;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:7px 0;gap:2px}.editor-tools button{border:0;background:transparent;width:28px;height:28px;border-radius:5px}.editor-tools button:hover{background:var(--surface-2)}.editor-tools span{flex:1}.editor-body textarea{border:0;outline:0;resize:none;width:100%;height:265px;background:transparent;color:var(--ink);padding:18px 0;font-size:15px;line-height:1.75}.tag-row{border-top:1px solid var(--line);padding-top:14px;display:flex;align-items:center;gap:10px;color:var(--muted);font-size:11px}.tag-row input{border:0;outline:0;background:transparent;color:var(--ink);flex:1;font-size:12px}.empty{grid-column:1/-1;border:1px dashed var(--line);border-radius:15px;text-align:center;padding:50px;color:var(--muted)}
@media(max-width:800px){.sidebar{transform:translateX(-100%);transition:.22s transform;box-shadow:var(--shadow)}.sidebar.open{transform:translateX(0)}.overlay.open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.3);z-index:4}.main{margin:0;width:100%}.mobile-menu{display:block;border:0;background:transparent;font-size:22px;margin-right:10px}.topbar{padding:0 18px}.search{width:auto;flex:1}.search kbd{display:none}.content{padding:35px 18px 60px}.welcome-row{align-items:start}.primary-action{padding:11px}.primary-action span{display:none}.quick-capture{grid-template-columns:repeat(2,1fr);margin:30px 0 37px}.note-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.note-card{padding:14px;min-height:184px}.editor-body{padding:23px 22px}.title-input{font-size:27px}.editor-body textarea{height:210px}}
@media(max-width:410px){.top-actions .icon-button:last-child{display:none}.note-grid{grid-template-columns:1fr}.quick-capture small{display:none}.quick-capture button{padding:12px 8px}.list-heading p{max-width:220px}.sort-button{font-size:0}.sort-button::before{content:"⇅";font-size:15px}}
body{font-family:Arial,"Helvetica Neue",sans-serif}.search-mark{width:14px;height:14px;border:2px solid var(--muted);border-radius:50%;position:relative;display:inline-block;flex:0 0 auto;opacity:.8}.search-mark::after{content:"";position:absolute;width:6px;height:2px;background:var(--muted);right:-5px;bottom:-2px;transform:rotate(45deg);border-radius:2px}.mobile-menu{width:28px;height:32px;padding:7px 3px;display:grid;gap:4px;align-content:center}.mobile-menu span{display:block;height:2px;width:20px;border-radius:2px;background:var(--ink)}
@media(max-width:800px){.top-actions .icon-button{width:48px;font-size:0}.top-actions .icon-button .sun,.top-actions .icon-button .moon{display:none}.top-actions .icon-button::after{content:"Tema";font-size:11px;font-weight:700}.sort-button{font-size:10px}.sort-button::before{display:none}}
@media(max-width:410px){.sort-button{font-size:10px}.sort-button::before{display:none}}
.tool-dialog{border:0;background:transparent;padding:0;width:min(680px,calc(100vw - 28px));max-height:92vh}.tool-dialog::backdrop{background:rgba(24,22,18,.55);backdrop-filter:blur(3px)}.tool-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:23px;box-shadow:0 30px 80px rgba(0,0,0,.25)}.tool-card header{display:flex;justify-content:space-between;align-items:start}.tool-card .eyebrow{margin:0 0 5px}.tool-card h2{font-family:Georgia,serif;font-size:25px;letter-spacing:-.03em;margin:0}.close-tool{border:0;background:var(--surface-2);border-radius:8px;width:32px;height:32px;font-size:24px;color:var(--muted)}.tool-copy{font-size:13px;line-height:1.5;color:var(--muted);margin:16px 0}.scan-stage{height:min(47vh,410px);border:1px dashed var(--line);border-radius:12px;background:var(--surface-2);display:grid;place-items:center;overflow:hidden}.scan-stage canvas{max-width:100%;max-height:100%;display:none}.scan-stage canvas.ready{display:block}.scan-stage p{font-size:12px;color:var(--muted);padding:25px;text-align:center}.scan-controls{display:flex;gap:7px;margin:12px 0}.scan-controls button,.secondary-action{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:8px 11px;font-size:11px;color:var(--muted)}.scan-controls button.active{background:var(--ink);border-color:var(--ink);color:var(--surface)}.scan-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:15px}.scan-actions .primary-action{padding:9px 12px}.ocr-status{font-size:11px;line-height:1.4;color:var(--muted);margin:13px 0 0}.ocr-status.error{color:#c04f44}.ocr-status.working{color:var(--accent)}#draw-canvas{display:block;width:100%;height:min(44vh,340px);background:var(--surface-2);border:1px dashed var(--line);border-radius:12px;touch-action:none;cursor:crosshair}
@media(min-width:801px){.quick-capture{grid-template-columns:repeat(3,1fr)}}
@media(max-width:500px){.tool-card{padding:18px}.tool-card h2{font-size:23px}.scan-actions{flex-wrap:wrap}.scan-actions .primary-action{margin-left:auto}.scan-stage{height:39vh}}
.inline-draw{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0;margin:0 0 15px}.inline-draw[hidden]{display:none}.inline-draw strong,.inline-draw small{display:block}.inline-draw strong{font-family:Georgia,serif;font-size:17px}.inline-draw small{font-size:11px;line-height:1.4;color:var(--muted);margin:4px 0 12px}.inline-draw .scan-actions{margin-top:9px}
.editor{width:100vw;max-width:none;height:100dvh;max-height:none;margin:0;border:0}.editor-card{min-height:100dvh;height:100dvh;border:0;border-radius:0;display:flex;flex-direction:column;box-shadow:none}.editor-top{flex:0 0 61px;padding:0 max(17px,calc((100vw - 900px)/2))}.editor-body{width:min(900px,100%);margin:0 auto;flex:1;padding:42px max(22px,calc((100vw - 820px)/2)) 35px;overflow:auto}.editor-body textarea{height:calc(100dvh - 340px);min-height:280px}.editor::backdrop{background:var(--bg)}
@media(max-width:800px){.editor-top{padding:0 17px}.editor-body{padding:27px 20px 30px}.editor-body textarea{height:calc(100dvh - 315px);min-height:260px}.editor-top .save-indicator{display:none}}
@media(max-width:410px){.top-actions .icon-button:last-child{display:block}}
.icon-button .sun,.icon-button .moon{font-size:0;width:15px;height:15px;position:relative;vertical-align:middle}.top-actions .icon-button .sun{display:inline-block!important;background:#d99a28;border-radius:50%;box-shadow:0 -7px 0 -5px #d99a28,0 7px 0 -5px #d99a28,7px 0 0 -5px #d99a28,-7px 0 0 -5px #d99a28,5px 5px 0 -5px #d99a28,-5px -5px 0 -5px #d99a28,5px -5px 0 -5px #d99a28,-5px 5px 0 -5px #d99a28}.top-actions .icon-button .moon{display:none!important;background:#aebbd1;border-radius:50%;overflow:hidden}.top-actions .icon-button .moon::after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;background:var(--surface);left:5px;top:-3px}:root[data-theme="dark"] .top-actions .icon-button .sun{display:none!important}:root[data-theme="dark"] .top-actions .icon-button .moon{display:inline-block!important}.top-actions .icon-button::after{content:""!important;display:none!important}.top-actions .icon-button{width:40px!important;font-size:0!important}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden}.ui-icon{width:16px;height:16px;display:inline-block;vertical-align:-3px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.new-note .ui-icon{width:17px;height:17px;margin-right:7px;vertical-align:-3px}.primary-action .ui-icon{width:15px;height:15px;margin-right:3px}.nav-item .ui-icon{width:16px;height:16px;stroke-width:1.7}.section-label .ui-icon{width:14px;height:14px;vertical-align:0}.capture-icon .ui-icon{width:18px;height:18px;vertical-align:0;stroke-width:1.8}.editor-tools .ui-icon{width:16px;height:16px;vertical-align:-3px}.close-editor .ui-icon,.close-tool .ui-icon{width:18px;height:18px;vertical-align:-3px}.star-card .ui-icon,.star-editor .ui-icon{width:16px;height:16px;vertical-align:0}.star-card.starred .ui-icon,.star-editor.starred .ui-icon{fill:currentColor}.new-note span{font-size:inherit;line-height:inherit;vertical-align:baseline;margin:0}
.media-menu{display:flex;gap:6px;padding:8px 0;border-bottom:1px solid var(--line)}.media-menu[hidden]{display:none}.media-menu button{border:1px solid var(--line);background:var(--surface-2);color:var(--muted);border-radius:7px;padding:6px 8px;font-size:11px}.media-menu .ui-icon{width:14px;height:14px;margin-right:3px}.inline-audio{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:17px 0;margin:0 0 15px}.inline-audio[hidden]{display:none}.inline-audio strong,.inline-audio small{display:block}.inline-audio strong{font-family:Georgia,serif;font-size:17px}.inline-audio small{font-size:11px;line-height:1.4;color:var(--muted);margin:4px 0 12px}.audio-actions{display:flex;gap:8px}.record-button{border:0;background:#b94e42;color:#fff;border-radius:8px;padding:9px 12px;font-size:12px;font-weight:700}.record-button span{display:inline-block;width:7px;height:7px;border-radius:50%;background:#fff;margin-right:5px}.record-button.recording{background:#8e3932}.attachment-strip{flex-wrap:wrap}.attachment-thumb.image-wide{width:100%;height:165px}.attachment-thumb.image-square{width:145px;height:145px}.attachment-thumb.image-compact{width:90px;height:70px}.attachment-thumb .frame-button{left:2px;right:auto;width:auto;border-radius:5px;padding:1px 4px;font-size:9px}.attachment-audio{width:100%;border:1px solid var(--line);border-radius:8px;padding:8px;display:flex;align-items:center;gap:7px;background:var(--surface-2)}.attachment-audio .ui-icon{flex:0 0 auto;color:var(--accent)}.attachment-audio audio{width:100%;height:28px}.attachment-audio button{border:0;background:transparent;color:var(--muted);font-size:16px}
.blocks-editor{display:grid;gap:10px;padding:18px 0 8px}.text-block{width:100%;min-height:120px;border:1px solid transparent;outline:0;resize:vertical;background:transparent;color:var(--ink);font-size:15px;line-height:1.75;padding:10px;border-radius:8px}.text-block:focus{background:var(--surface-2);border-color:var(--line)}.add-text-block{border:1px dashed var(--line);background:transparent;color:var(--muted);border-radius:8px;padding:8px 10px;font-size:11px;text-align:left}.add-text-block:hover{background:var(--surface-2);color:var(--ink)}.add-text-block .ui-icon{width:14px;height:14px;margin-right:5px}
.attachment-strip{display:flex;gap:8px;overflow:auto;padding-top:13px}.attachment-thumb{position:relative;width:62px;height:52px;flex:0 0 auto;border:1px solid var(--line);background:var(--surface-2);border-radius:7px;overflow:hidden}.attachment-thumb img{width:100%;height:100%;object-fit:cover}.attachment-thumb button{position:absolute;right:2px;top:2px;border:0;border-radius:50%;width:17px;height:17px;background:var(--ink);color:var(--surface);font-size:12px;line-height:14px}.attachment-label{font-size:10px;color:var(--muted);border:1px dashed var(--line);border-radius:7px;padding:16px 8px;white-space:nowrap}
.editor-body .text-block{height:auto}
.media-block{position:relative;max-width:100%;min-height:74px;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface-2)}.media-block img{display:block;width:100%;max-height:440px;object-fit:cover}.media-block.frame-square{max-width:320px}.media-block.frame-square img{aspect-ratio:1}.media-block.frame-compact{max-width:210px}.media-block.frame-compact img{aspect-ratio:3/4}.media-block-label{display:flex;align-items:center;gap:7px;padding:8px 10px;color:var(--muted);font-size:11px}.media-block audio{display:block;width:calc(100% - 20px);margin:0 10px 12px}.remove-block{position:absolute;right:7px;top:7px;border:0;border-radius:50%;width:23px;height:23px;background:rgba(20,18,15,.82);color:#fff;font-size:17px;line-height:20px}
.attachment-strip{display:none}
.settings-link{width:100%;display:flex;align-items:center;gap:9px;padding:10px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:12px;text-align:left}.settings-link:hover{background:var(--surface-2);color:var(--ink)}.settings-link .ui-icon{width:15px;height:15px}.settings-dialog{border:0;background:transparent;padding:0;width:min(520px,calc(100vw - 28px))}.settings-dialog::backdrop{background:rgba(24,22,18,.48);backdrop-filter:blur(3px)}.settings-card{background:var(--surface);border:1px solid var(--line);border-radius:18px;padding:23px;box-shadow:0 30px 80px rgba(0,0,0,.25)}.settings-card header{display:flex;justify-content:space-between;align-items:start}.settings-card h2{font-family:Georgia,serif;font-size:26px;letter-spacing:-.03em;margin:0}.close-settings{border:0;background:var(--surface-2);border-radius:8px;width:33px;height:33px;color:var(--muted)}.setting-section{padding:22px 0;border-top:1px solid var(--line);margin-top:20px}.setting-section h3{font-size:13px;margin:0 0 5px}.setting-section p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}.theme-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.theme-options button{border:1px solid var(--line);border-radius:11px;background:var(--surface);padding:10px;text-align:left;display:grid;gap:5px}.theme-options button.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.theme-options strong{font-size:12px}.theme-options small{font-size:10px;color:var(--muted)}.theme-preview{height:52px;border:1px solid var(--line);border-radius:7px;display:block;position:relative;overflow:hidden}.light-preview{background:#f7f5f0}.dark-preview{background:#161714}.theme-preview::before{content:"";position:absolute;inset:10px 12px 21px;border-radius:3px;background:var(--preview-card,#fffdfa)}.dark-preview::before{--preview-card:#2a2b26}.theme-preview::after{content:"";position:absolute;left:12px;right:34px;bottom:10px;height:4px;border-radius:4px;background:#e16c42}.muted-setting{padding-bottom:0}@media(max-width:500px){.settings-card{padding:19px}.theme-options{gap:8px}}
.text-block-wrap{position:relative}.text-block-wrap .text-block{padding-right:92px}.block-controls{position:absolute;right:7px;top:7px;display:flex;gap:3px;opacity:0;transition:opacity .16s}.text-block-wrap:focus-within .block-controls,.media-block:hover .block-controls{opacity:1}.block-controls button{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:5px;width:24px;height:24px;line-height:19px;padding:0;font-size:14px}.block-controls button:disabled{opacity:.35}.block-controls .block-remove{color:#bd5145}.media-block .block-controls{right:7px;top:7px;opacity:1;background:rgba(20,18,15,.75);padding:3px;border-radius:7px}.media-block .block-controls button{background:transparent;border-color:transparent;color:#fff}@media(max-width:800px){.block-controls{opacity:1}.text-block-wrap .text-block{padding-right:84px}}
.text-block-wrap[data-kind]:not([data-kind="Texto livre"])::before{content:attr(data-kind);display:block;padding:8px 10px 0;color:var(--muted);font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.text-block-wrap[data-kind="Observação"]{border-left:3px solid #76a68b;background:color-mix(in srgb,#76a68b 7%,transparent);border-radius:8px}.text-block-wrap[data-kind="Fala / citação"]{border-left:3px solid #8b91c4;background:color-mix(in srgb,#8b91c4 7%,transparent);border-radius:8px}.text-block-wrap[data-kind="Interpretação"]{border-left:3px solid #d18a61;background:color-mix(in srgb,#d18a61 7%,transparent);border-radius:8px}.text-block-wrap[data-kind="Pergunta"]{border-left:3px solid #b7789f;background:color-mix(in srgb,#b7789f 7%,transparent);border-radius:8px}.field-meta{border-top:1px solid var(--line);padding-top:13px;margin-top:10px}.field-meta>button{border:0;background:transparent;padding:0;color:var(--muted);font-size:11px}.field-meta>div{display:flex;gap:7px;margin-top:10px}.field-meta input{flex:1;min-width:0;border:1px solid var(--line);background:var(--surface-2);border-radius:7px;padding:8px;color:var(--ink);font-size:12px;outline:0}.field-meta div button{border:1px solid var(--line);background:var(--surface);border-radius:7px;padding:7px 8px;color:var(--muted);font-size:10px;white-space:nowrap}@media(max-width:500px){.field-meta>div{flex-wrap:wrap}.field-meta input{width:100%;flex-basis:100%}}
.build-version{float:right;font-size:9px;color:var(--muted);border:1px solid var(--line);border-radius:99px;padding:2px 5px;margin-top:-2px}.version-pill{display:inline-block;margin-top:8px;border:1px solid var(--line);border-radius:99px;padding:3px 7px;color:var(--muted);font-size:10px;letter-spacing:.02em}
.page-actions{display:flex;gap:8px;align-items:center}.page-actions .add-text-block{flex:1}.new-page-button{border:1px solid var(--line);background:var(--surface);color:var(--muted);border-radius:8px;padding:8px 10px;font-size:11px}.diary-pages{display:grid;gap:0}.diary-page{position:relative;min-width:0}.page-empty{color:var(--muted);font-size:12px;font-style:italic;padding:28px 10px;margin:0}.view-options{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:15px}.view-options button{border:1px solid var(--line);border-radius:11px;background:var(--surface);padding:13px 11px;text-align:left;display:grid;gap:4px}.view-options button.selected{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.view-options strong{font-size:12px}.view-options small{font-size:10px;color:var(--muted)}:root[data-diary-view="pages"] .diary-pages{gap:22px;padding:18px 0}:root[data-diary-view="pages"] .diary-page{min-height:calc(100dvh - 270px);padding:24px 22px 48px;background:var(--surface);border:1px solid var(--line);border-radius:4px;box-shadow:0 8px 24px rgba(57,44,28,.08)}:root[data-diary-view="pages"] .diary-page::after{content:"Página " attr(data-page);position:absolute;bottom:13px;right:17px;color:var(--muted);font-size:10px}:root[data-diary-view="pages"] .new-page-button{color:var(--accent);border-color:var(--accent)}@media(max-width:500px){.page-actions{flex-wrap:wrap}.page-actions .add-text-block{flex-basis:100%}:root[data-diary-view="pages"] .diary-page{padding:18px 14px 45px;margin:0 -4px;min-height:calc(100dvh - 245px)}}

/* v0.5: uma página é uma superfície de escrita; as marcas pertencem ao trecho selecionado. */
.selection-hint{margin:10px 0 0;color:var(--muted);font-size:11px;line-height:1.4}.page-actions{justify-content:flex-end;margin-top:10px}.page-content{min-height:300px;outline:0;padding:18px 0;color:var(--ink);font-size:15px;line-height:1.8;white-space:pre-wrap}.page-content:empty::before{content:attr(data-placeholder);color:var(--muted);pointer-events:none}.page-content mark{color:inherit;border-radius:3px;padding:1px 2px;background:var(--accent-soft);box-decoration-break:clone;-webkit-box-decoration-break:clone}.page-content mark[data-kind="observation"]{background:#dceee4;border-bottom:2px solid #76a68b}.page-content mark[data-kind="quote"]{background:#e4e5f5;border-bottom:2px solid #8b91c4}.page-content mark[data-kind="reflection"]{background:#f7e6d9;border-bottom:2px solid #d18a61}.page-content mark[data-kind="question"]{background:#f4e1ec;border-bottom:2px solid #b7789f}.inline-media{position:relative;margin:14px 0;max-width:100%;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--surface-2)}.inline-media img{display:block;width:100%;max-height:440px;object-fit:cover}.inline-media.frame-square{max-width:320px}.inline-media.frame-square img{aspect-ratio:1}.inline-media.frame-compact{max-width:210px}.inline-media.frame-compact img{aspect-ratio:3/4}.inline-media figcaption{padding:8px 10px;color:var(--muted);font-size:11px}.inline-media audio{display:block;width:calc(100% - 20px);margin:0 10px 12px}.remove-media{position:absolute;right:7px;top:7px;border:0;border-radius:50%;width:23px;height:23px;background:rgba(20,18,15,.82);color:#fff;font-size:17px;line-height:20px}.diary-page{padding:0}.diary-page+.diary-page{border-top:1px solid var(--line)}:root[data-diary-view="pages"] .page-content{min-height:calc(100dvh - 385px)}@media(max-width:500px){.page-content{min-height:260px}:root[data-diary-view="pages"] .page-content{min-height:calc(100dvh - 355px)}}

:root[data-diary-view="pages"] .inline-media{position:absolute;left:var(--media-x);top:var(--media-y);width:var(--media-w);max-width:none;margin:0;z-index:2;cursor:grab;touch-action:none;box-shadow:0 8px 22px rgba(57,44,28,.16)}:root[data-diary-view="pages"] .inline-media.dragging{cursor:grabbing;z-index:4;box-shadow:0 15px 30px rgba(57,44,28,.26)}:root[data-diary-view="pages"] .inline-media::before{content:"Arraste para posicionar";position:absolute;left:8px;top:7px;z-index:1;padding:3px 6px;border-radius:4px;background:rgba(20,18,15,.72);color:#fff;font-size:9px;opacity:0;transition:opacity .16s;pointer-events:none}:root[data-diary-view="pages"] .inline-media:hover::before,:root[data-diary-view="pages"] .inline-media.dragging::before{opacity:1}@media(max-width:500px){:root[data-diary-view="pages"] .inline-media{width:max(38%,var(--media-w))}}

.resize-media{display:none}:root[data-diary-view="pages"] .resize-media{display:block;position:absolute;right:5px;bottom:5px;width:21px;height:21px;padding:0;border:0;border-radius:5px;background:rgba(20,18,15,.78);color:#fff;cursor:ew-resize;touch-action:none}:root[data-diary-view="pages"] .resize-media::before{content:"↔";font-size:12px;line-height:18px}

:root[data-diary-view="pages"] .inline-media{z-index:var(--media-z,2)}

/* Página de campo: referência visual leve sem competir com a escrita. */
:root[data-diary-view="pages"] .diary-page{background-image:linear-gradient(to bottom,transparent 31px,color-mix(in srgb,var(--line) 45%,transparent) 32px);background-size:100% 32px}:root[data-diary-view="pages"] .page-content{position:relative;z-index:1;padding-left:4px;padding-right:4px}:root[data-diary-view="pages"] .inline-media{transition:box-shadow .16s ease,transform .16s ease}:root[data-diary-view="pages"] .inline-media:hover,:root[data-diary-view="pages"] .inline-media:focus-within{z-index:5;transform:translateY(-1px);box-shadow:0 14px 28px rgba(57,44,28,.24)}:root[data-diary-view="pages"] .inline-media figcaption{padding-right:34px;font-weight:650;background:color-mix(in srgb,var(--surface-2) 90%,transparent)}@media(max-width:800px){:root[data-diary-view="pages"] .inline-media::before{opacity:.9}:root[data-diary-view="pages"] .inline-media{box-shadow:0 8px 20px rgba(57,44,28,.2)}}

/* Alvos e pistas de gesto para uso com uma mão no celular. */
@media(max-width:800px){:root[data-diary-view="pages"] .inline-media{width:min(70%,max(46%,var(--media-w)));border-width:2px}:root[data-diary-view="pages"] .inline-media::before{content:"⠿  arraste";left:7px;top:7px;padding:5px 8px;font-size:10px;letter-spacing:.02em;opacity:1}:root[data-diary-view="pages"] .remove-media,:root[data-diary-view="pages"] .resize-media{width:32px;height:32px;border-radius:8px;z-index:3}:root[data-diary-view="pages"] .remove-media{right:6px;top:6px;font-size:21px;line-height:27px}:root[data-diary-view="pages"] .resize-media{right:6px;bottom:6px}:root[data-diary-view="pages"] .resize-media::before{font-size:18px;line-height:27px}:root[data-diary-view="pages"] .inline-media figcaption{min-height:38px;padding:11px 45px 10px 11px;font-size:12px}.page-content{padding-bottom:8px}}

:root[data-diary-view="pages"] .inline-media.selected{outline:2px solid var(--accent);outline-offset:3px}:root[data-diary-view="pages"] .inline-media.locked{outline-color:#8390a2}:root[data-diary-view="pages"] .inline-media.locked::before{content:"🔒  posição travada"}.lock-media{display:none}:root[data-diary-view="pages"] .inline-media.selected .lock-media{display:block;position:absolute;right:7px;top:7px;z-index:4;width:26px;height:26px;padding:0;border:0;border-radius:7px;background:rgba(20,18,15,.82);color:#fff;font-size:13px;line-height:24px}@media(max-width:800px){:root[data-diary-view="pages"] .inline-media.selected .lock-media{display:block;width:32px;height:32px;right:44px;top:6px;font-size:15px;line-height:29px}}

.skip-link{position:fixed;left:12px;top:-60px;z-index:20;padding:9px 12px;border-radius:7px;background:var(--ink);color:var(--surface);font-size:13px;transition:top .16s ease}.skip-link:focus{top:12px}button,input,select,[contenteditable="true"]{touch-action:manipulation}button:focus-visible,input:focus-visible,select:focus-visible,[contenteditable="true"]:focus-visible,a:focus-visible{outline:3px solid color-mix(in srgb,var(--accent) 78%,#fff);outline-offset:3px}.editor-body{overscroll-behavior:contain}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}

/* ============================================================
   0.6.0 — cópia de segurança. Fecha o buraco mais grave: ate 0.5.18
   nao havia saida do conjunto todo, so de um registro por vez.
   ============================================================ */
.backup-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.85rem}
/* Alvo de toque: a 0.6.0 os botoes desta secao mediam 30px de altura no
   celular — pequeno demais para o dedo, e este app e mobile-first. Elevamos
   so aqui (a secao de copia), sem mexer no .secondary-action global, que
   participa de outras telas com densidade propria. 44px e o alvo
   recomendado. */
#backup-section .secondary-action{
	min-height:44px;
	padding:10px 16px;
	font-size:13px;
	border-radius:10px;
	-webkit-tap-highlight-color:transparent;
	touch-action:manipulation;
}
#backup-section .secondary-action:active{transform:scale(.98)}
@media (prefers-reduced-motion:no-preference){
	#backup-section .secondary-action{transition:transform .12s ease,background-color .18s ease,border-color .18s ease}
}
.backup-status{margin:.75rem 0 0;font-size:.82rem;line-height:1.45;color:var(--color-petroleo,currentColor);min-height:1.1em}
.backup-note{margin:.4rem 0 0;font-size:.74rem;line-height:1.5;opacity:.72}
.setting-section#backup-section{border-top:1px solid rgba(0,0,0,.08);padding-top:1rem}
:root[data-theme=dark] .setting-section#backup-section{border-top-color:rgba(255,255,255,.1)}
button.secondary-action:disabled{opacity:.55;cursor:progress}

/* 0.6.1 — estado do armazenamento. Mesmo alvo de toque da cópia: a seção
   "Espaço no aparelho" é usada no celular, com o dedo. */
#storage-section{border-top:1px solid rgba(0,0,0,.08);padding-top:1rem}
:root[data-theme=dark] #storage-section{border-top-color:rgba(255,255,255,.1)}
#storage-status{margin:.35rem 0 0;font-size:.82rem;line-height:1.5;color:var(--color-petroleo,currentColor)}
#storage-section .secondary-action{
	min-height:44px;padding:10px 16px;font-size:13px;border-radius:10px;
	-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
#storage-section .secondary-action:active{transform:scale(.98)}
@media (prefers-reduced-motion:no-preference){
	#storage-section .secondary-action{transition:transform .12s ease,background-color .18s ease,border-color .18s ease}
}

/* 0.6.3 — botão Excluir. Fica na barra do editor, que é usada no celular
   com o dedo: mesmo alvo de toque dos demais (44px). A cor differentiate
   porque a ação é destrutiva e irreversível. */
.danger-action{
	min-height:44px;padding:10px 16px;font-size:13px;border-radius:10px;
	-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.danger-action{
	color:#8c2f22;border-color:rgba(140,47,34,.35);background:transparent;
}
.danger-action:hover{border-color:rgba(140,47,34,.6);background:rgba(140,47,34,.06)}
.danger-action:active{transform:scale(.98)}
.danger-action[hidden]{display:none}
:root[data-theme=dark] .danger-action{color:#e08a7c;border-color:rgba(224,138,124,.4)}
:root[data-theme=dark] .danger-action:hover{border-color:rgba(224,138,124,.7);background:rgba(224,138,124,.1)}
@media (prefers-reduced-motion:no-preference){
	.danger-action{transition:transform .12s ease,background-color .18s ease,border-color .18s ease,color .18s ease}
}

/* 0.6.3 — aviso de cópia vencida. Discreto de propósito: o aviso existe
   para lembrar, não para interromper o registro em campo. some assim que
   a cópia é feita. */
.copy-reminder{
	display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;
	margin:0 0 .85rem;padding:.7rem .85rem;border-radius:10px;
	border:1px solid rgba(198,155,97,.45);background:rgba(198,155,97,.1);
	font-size:.83rem;line-height:1.45;
}
.copy-reminder[hidden]{display:none}
.copy-reminder-text{flex:1 1 14rem;min-width:0}
.copy-reminder .secondary-action{
	min-height:44px;padding:10px 14px;font-size:13px;border-radius:10px;
	-webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
:root[data-theme=dark] .copy-reminder{
	border-color:rgba(198,155,97,.4);background:rgba(198,155,97,.12);
}
@media (prefers-reduced-motion:no-preference){
	.copy-reminder .secondary-action{transition:transform .12s ease,background-color .18s ease}
}
.copy-reminder .secondary-action:active{transform:scale(.98)}

/* 0.6.4 — tela de recuperação. Medido no Pixel 5: os botões herdavam o
   `.secondary-action` e mediam 30px — pequenos demais para o dedo. E é
   justamente a tela que aparece quando algo deu errado, a que menos pode
   ter um alvo de toque ruim: quem está tentando recuperar material não
   deveria errar o botão. */
#storage-recovery{
	margin:0 0 1rem;padding:1rem;border-radius:12px;
	border:1px solid rgba(140,47,34,.35);background:rgba(140,47,34,.06);
}
#storage-recovery h2{margin:0 0 .5rem;font-size:1.02rem}
#storage-recovery p{margin:0 0 .85rem;font-size:.86rem;line-height:1.55}
#storage-recovery .secondary-action{
	min-height:44px;padding:10px 16px;font-size:13px;border-radius:10px;
	-webkit-tap-highlight-color:transparent;touch-action:manipulation;
	margin:0 .5rem .5rem 0;
}
#storage-recovery .secondary-action:active{transform:scale(.98)}
#storage-recovery .secondary-action:disabled{opacity:.5}
:root[data-theme=dark] #storage-recovery{
	border-color:rgba(224,138,124,.4);background:rgba(224,138,124,.08);
}
@media (prefers-reduced-motion:no-preference){
	#storage-recovery .secondary-action{transition:transform .12s ease,background-color .18s ease}
}
