:root{--bg: #16181d;--panel: #1d2027;--raised: #262a33;--line: #333844;--text: #e6e8ee;--muted: #9aa1b1;--accent: #7aa2f7;--danger: #f7768e;--ok: #9ece6a;--icon-trash: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='black'%20stroke-width='2'%20stroke-linecap='round'%3E%3Cpath%20d='M4%207h16M9%207V5h6v2M6%207l1%2013h10l1-13'/%3E%3Cpath%20d='M10%2011v6M14%2011v6'/%3E%3C/svg%3E");color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;height:100%}body{background:var(--bg);color:var(--text);font:15px/1.6 system-ui,-apple-system,Hiragino Sans,Noto Sans JP,sans-serif;height:100dvh;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}@media(max-width:820px){input,textarea,select{font-size:16px}}#app{height:100%}button,input,textarea,select{font:inherit;color:inherit}button{background:var(--raised);border:1px solid var(--line);border-radius:6px;padding:.5em .9em;cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button:disabled{opacity:.5;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:#10131a;font-weight:600}button.danger{border-color:var(--danger);color:var(--danger)}input,textarea{background:var(--bg);border:1px solid var(--line);border-radius:6px;padding:.5em .7em;width:100%}textarea{resize:none;min-height:12em;font-family:ui-monospace,SF Mono,Menlo,monospace;font-size:14px}.center{display:grid;place-items:center;height:100%;padding:1.5rem}.overlay{position:fixed;inset:0;height:auto;overflow-y:auto;background:#00000080;z-index:10}.card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:1.6rem 1.8rem;max-width:30rem;width:100%}.card h1{margin:0 0 .3rem;font-size:1.4rem}.card p{color:var(--muted);margin:.4rem 0 1.2rem}.row{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}.gap-top{margin-top:1rem}.gap-top-sm{margin-top:.6rem}.spacer{height:1rem}.spacer-sm{height:.6rem}.card label{display:block;margin:.9rem 0 .3rem;color:var(--muted);font-size:.9em}.remember{display:flex;align-items:center;gap:.5rem;margin-top:1rem;color:var(--muted);font-size:.9em;cursor:pointer}.recovery{font-family:ui-monospace,Menlo,monospace;font-size:1.05em;letter-spacing:.04em;background:var(--bg);border:1px dashed var(--accent);border-radius:6px;padding:.8rem;margin:.6rem 0;word-break:break-all;user-select:all}.layout{display:grid;grid-template-columns:minmax(15rem,20rem) 1fr;height:100%}@media(max-width:44rem){.layout{grid-template-columns:1fr;grid-template-rows:40% 60%}}.layout.resized{grid-template-columns:var(--sidebar-width) 1fr}.resizer{touch-action:none;background:transparent}.resizer:hover,.resizer.dragging{background:var(--accent);opacity:.5}.resizer-x{position:absolute;top:0;bottom:0;right:-3px;width:6px;cursor:col-resize}.resizer-y{height:6px;margin:-3px 0;cursor:row-resize}@media(max-width:44rem){.resizer-x{display:none}}.tabs{display:flex;gap:.25rem;margin-left:auto}.tabs .tab{border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);padding:.15rem .7rem;font-size:.85rem}.tabs .tab.active{background:var(--accent);border-color:var(--accent);color:#10131a}@media(max-width:44rem){.editor .body>textarea{min-height:0;height:100%}.editor .body.preview-tab>textarea,.editor .body.preview-tab>.spacer-sm,.editor .body.preview-tab>.resizer-y{display:none}}.editor .body.split{display:grid;grid-template-rows:var(--body-split) auto 1fr;overflow:hidden}.editor .body.split>.spacer-sm{display:none}.editor .body.split>.resizer-y{margin:0}.editor .body.split>textarea{min-height:0;height:100%}.editor .body.split .below{overflow-y:auto;min-height:0}.sidebar{background:var(--panel);border-right:1px solid var(--line);display:flex;flex-direction:column;min-height:0;position:relative}.sidebar .head{padding:.7rem;border-bottom:1px solid var(--line);display:flex;gap:.4rem;align-items:center}.listing{overflow-y:auto;flex:1;min-height:0}.item{padding:.55rem .7rem;border-bottom:1px solid var(--line);cursor:pointer;position:relative}.item:hover{background:var(--raised)}.item[aria-selected=true]{background:var(--raised);border-left:3px solid var(--accent);padding-left:calc(.7rem - 3px)}.item .row-main{display:grid;grid-template-columns:1fr auto;column-gap:.5rem;align-items:baseline;padding-right:2.2rem}.item .title{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item .date{color:var(--muted);font-size:.78em;white-space:nowrap}.item .meta{grid-column:1 / -1;color:var(--muted);font-size:.85em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.item .row-action{position:absolute;right:.5rem;top:.5rem;padding:.2em .5em;font-size:.8em;background:var(--raised);border:1px solid var(--line);border-radius:4px}.trash-row{border-top:1px solid var(--line);padding:.6rem .7rem;cursor:pointer;color:var(--muted);display:flex;align-items:center;gap:.4rem}.trash-row:hover{background:var(--raised)}.trash-row[aria-selected=true]{background:var(--raised);color:var(--text);border-left:3px solid var(--accent);padding-left:calc(.7rem - 3px)}button.icon{width:2rem;height:2rem;padding:0;display:grid;place-items:center;font-size:1.05em;line-height:1;background:transparent;border-color:transparent}button.icon:hover:not(:disabled){background:var(--raised);border-color:var(--line)}button.trash:before{content:"";width:1rem;height:1rem;background:currentColor;-webkit-mask:var(--icon-trash) center / contain no-repeat;mask:var(--icon-trash) center / contain no-repeat}.sidebar .head{position:relative}.menu{position:absolute;top:100%;left:.4rem;z-index:5;display:flex;flex-direction:column;gap:.2rem;padding:.35rem;background:var(--panel);border:1px solid var(--line);border-radius:8px;box-shadow:0 6px 18px #00000073;min-width:10rem}.menu button{text-align:left;background:transparent;border-color:transparent}.menu button:hover:not(:disabled){background:var(--raised)}.item mark{background:#4a3f13;color:#ffe08a;border-radius:2px}.editor{display:flex;flex-direction:column;min-height:0;min-width:0}.editor .bar{display:flex;align-items:center;gap:.5rem;padding:.6rem .8rem;border-bottom:1px solid var(--line);flex-wrap:wrap}.editor .body{flex:1;min-height:0;overflow-y:auto;padding:1rem 1.2rem 4rem}.editor .body textarea{width:100%;min-height:calc(100vh - 14rem)}figure.mermaid{margin:1rem 0;overflow-x:auto}figure.mermaid svg{max-width:100%;height:auto}figure.mermaid .mermaid-error{margin:.4rem 0 0;color:var(--danger);font-size:.85rem}.markdown-preview{margin:1rem 0;padding:.7rem .9rem;border:1px solid var(--line);border-radius:8px;background:var(--panel)}.preview-label{color:var(--muted);font-size:.8em;margin-bottom:.4rem}.markdown-content{overflow-wrap:anywhere}.markdown-content h1,.markdown-content h2,.markdown-content h3,.markdown-content h4,.markdown-content h5,.markdown-content h6{line-height:1.3;margin:.5em 0 .25em}.markdown-content h1{font-size:1.35em}.markdown-content h2{font-size:1.2em}.markdown-content p{margin:.4em 0}.markdown-content ul{padding-left:1.4em;margin:.4em 0}.markdown-content pre{background:var(--bg);border:1px solid var(--line);border-radius:6px;overflow-x:auto;padding:.6rem .8rem}.markdown-content code{font-family:ui-monospace,SF Mono,Menlo,monospace}.markdown-content :not(pre)>code{background:var(--raised);border-radius:3px;padding:.08em .25em}.markdown-content table{border-collapse:collapse;width:100%;margin:.5em 0}.markdown-content th,.markdown-content td{border:1px solid var(--line);padding:.35em .5em;text-align:left}.markdown-content th{background:var(--raised)}.markdown-content .align-left{text-align:left}.markdown-content .align-right{text-align:right}.markdown-content .align-center{text-align:center}.status{color:var(--muted);font-size:.85em;margin-left:auto}.status.error{color:var(--danger)}.status.ok{color:var(--ok)}.empty{color:var(--muted);padding:2rem;text-align:center}.assets{margin:1rem 0}.asset{border:1px solid var(--line);border-radius:8px;padding:.6rem .8rem;margin-bottom:.6rem;background:var(--panel)}.asset .url{color:var(--muted);font-size:.82em;word-break:break-all}.asset img,.asset video{max-width:100%;border-radius:6px;margin-top:.5rem;display:block}.asset audio{width:100%;margin-top:.5rem}.hits{border-top:1px solid var(--line)}.hit{padding:.5rem .8rem;border-bottom:1px solid var(--line);cursor:pointer;font-size:.9em}.hit:hover{background:var(--raised)}.hit .where{color:var(--accent);font-size:.82em}.hit .text{color:var(--muted)}.hint{color:var(--muted);font-size:.85em;padding:.6rem .8rem}.backupCodes{list-style:none;padding-left:.8rem}
