/* Reading surface matched to the publishing Mac's Blue Topaz dark palette.
   Standalone styles only: no theme scripts, remote fonts or Vault settings. */
:root{color-scheme:dark;--background:#202020;--surface:#262626;--text:#c6c6c6;--muted:#8a8a8a;--line:#343434;--accent:#4f8fc6;--cv-c1:#fb464c;--cv-c2:#e9973f;--cv-c3:#e0de71;--cv-c4:#44cf6e;--cv-c5:#53dfdd;--cv-c6:#a882ff}
*{box-sizing:border-box}
body{margin:0;background:var(--background);color:var(--text);font:19px/1.65 Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",sans-serif;-webkit-text-size-adjust:100%}
main{max-width:900px;margin:64px auto 96px;padding:0 32px}
#title{font-size:1.6em;font-weight:600;line-height:1.3;margin:0 0 2em;color:hsl(78,62%,47%)}
#status{color:var(--muted);font-size:16px}
#status:empty,#title:empty{display:none}
article{overflow-wrap:anywhere}
article>:first-child{margin-top:0}
p{margin:1em 0}
h1,h2,h3,h4,h5,h6{line-height:1.3;font-weight:600;margin:1.6em 0 .7em}
h1{font-size:1.8em;color:hsl(78,62%,47%)}
h2{font-size:1.4em;color:hsl(118,42%,49%)}
h3{font-size:1.25em;color:hsl(180,53%,48%)}
h4{font-size:1.15em;color:hsl(216,69%,68%)}
h5{font-size:1.05em;color:hsl(258,79%,77%)}
h6{font-size:1em;color:hsl(290,85%,81%)}
strong{color:#e7e7e7}
a{color:var(--accent);overflow-wrap:anywhere;text-underline-offset:2px}
article img,article video{max-width:100%;height:auto}
article audio{max-width:100%}
pre{padding:16px;background:#191919;overflow:auto;border-radius:4px;font-size:.85em;line-height:1.5}
code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
:not(pre)>code{padding:2px 4px;background:#191919;border-radius:3px;font-size:.9em}
blockquote{margin:1em 0;padding:4px 16px;border-left:2px solid var(--accent);background:#9191911c}
blockquote>:first-child{margin-top:0}blockquote>:last-child{margin-bottom:0}
table{border-collapse:collapse;display:block;overflow:auto;font-size:.9375em}
td,th{padding:6px 10px;border:1px solid var(--line);text-align:left}
th{background:#252a32;font-weight:600}
tr:nth-child(even){background:#1b1b1b}
hr{border:0;border-top:1px solid var(--line);margin:2em 0}
li{margin:.25em 0}
.is-canvas{overflow:hidden}
.is-canvas main{max-width:none;margin:0;padding:0}
.is-canvas #title{display:none}
.is-canvas #note-content{height:100vh;height:100svh}
.cmds-canvas{position:relative;overflow:hidden;touch-action:none;min-height:320px;background:var(--background);cursor:grab}
.is-canvas .cmds-canvas{height:100vh!important;height:100svh!important}
.cmds-canvas.dragging{cursor:grabbing}
.cmds-canvas-world{position:absolute;left:0;top:0;transform-origin:0 0}
.cv-group,.cv-node{position:absolute;border-radius:8px}
.cv-group{border:2px solid var(--node-color,#555);background:color-mix(in srgb,var(--node-color,#555) 8%,var(--background))}
.cv-group-label{position:absolute;top:-28px;left:10px;font-weight:600;color:var(--node-color,var(--muted));white-space:nowrap}
.cv-node{background:var(--surface);border:2px solid var(--node-color,#555);overflow:hidden}
.cv-body{height:100%;padding:16px;overflow:auto;font-size:19px;line-height:1.65;touch-action:pan-y}
.cv-body>:first-child{margin-top:0}
.cv-file-label{font-size:13px;padding:5px 12px;border-bottom:1px solid var(--line);height:32px;color:var(--muted)}
.cv-file .cv-body{height:calc(100% - 32px)}
.cv-image img{width:100%;height:100%;object-fit:contain}
.cv-link-card{display:flex;flex-direction:column;padding:18px;text-decoration:none;font-size:16px}
.cv-link-host{font-weight:600}
.cv-link-url{color:var(--muted);font-size:13px}
.cv-edges{position:absolute;left:0;top:0;overflow:visible;pointer-events:none}
.cv-edge path{fill:none;stroke:var(--edge-color,#777);stroke-width:2}
.cv-edge polygon{fill:var(--edge-color,#777)}
.cv-edge-label{position:absolute;transform:translate(-50%,-50%);font-size:13px;padding:1px 6px;background:var(--background);color:var(--edge-color,var(--muted))}
.cmds-canvas-ui{position:absolute;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));display:flex;gap:2px;background:var(--surface);border:1px solid var(--line);padding:3px;border-radius:6px}
.cmds-canvas-ui button{width:44px;height:44px;border:0;background:transparent;color:var(--text);border-radius:3px;cursor:pointer}
.cmds-canvas-ui svg{width:20px;height:20px}
.cmds-canvas-ui button:hover{background:#373737}
button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cmds-canvas:fullscreen{height:100vh!important}
.cv-missing{color:var(--muted)}
@media(max-width:600px){main{margin:32px auto 56px;padding:0 20px}body{font-size:19px}#title{font-size:1.45em}.cv-body{font-size:19px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
.media-preview{display:flex;min-height:100px;align-items:center;justify-content:center;background:var(--surface)}.media-preview video{width:100%;max-height:80vh}.media-preview audio{width:100%}.media-preview [hidden]{display:none}.media-preview button{font:inherit;font-size:15px;color:var(--text);background:transparent;border:1px solid var(--line);border-radius:4px;padding:10px 16px;cursor:pointer}
/* Canvas uses saved node geometry; compact cards must not inherit note-page
   heading margins, large padding, or a fabricated filename header. */
.cmds-canvas{background-image:radial-gradient(#393939 1px,transparent 1px);background-size:20px 20px}
.cv-node{border-width:1px;border-radius:6px;background:var(--background)}
.cv-body{padding:12px 16px;scrollbar-width:thin;line-height:1.5}
.cv-body>:first-child{margin-top:0}.cv-body>:last-child{margin-bottom:0}
.cv-body h1{font-size:1.8em}.cv-body p{margin:.5em 0}
.cv-file-label{position:absolute;left:0;top:-24px;height:22px;padding:0;border:0;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cv-file{overflow:visible}.cv-file .cv-body{height:100%;padding:0;overflow:hidden;border-radius:5px}
.cv-file .cv-body:has(.markdown-rendered){padding:12px 16px;overflow:auto}
.cv-file .cv-body img,.cv-file .cv-body video{display:block;width:100%;height:100%;object-fit:contain}
.cv-file .media-preview{height:100%;min-height:0}
.media-preview{position:relative;overflow:hidden;background:#191919;min-height:140px;border-radius:4px}
.media-preview .media-poster{display:block;max-height:80vh;width:100%;height:100%;object-fit:contain}
.media-preview:has(.media-poster)>button{position:absolute;inset:0;margin:auto;width:64px;height:64px;border-radius:50%;font-size:0;background:#101010b3;border:1px solid #ffffff70;box-shadow:0 2px 12px #0008}
.media-preview:has(.media-poster)>button:after{content:'▶';font-size:25px;color:white;padding-left:3px}
.media-preview video{object-fit:contain}.media-preview [hidden]{display:none!important}
.youtube-preview{position:relative;width:100%;min-height:200px;aspect-ratio:16/9;background:#151515;overflow:hidden;border-radius:5px}.youtube-preview>img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0}.youtube-preview>button{position:absolute;inset:0;margin:auto;width:64px;height:46px;border:0;border-radius:10px;background:#e62117;color:white;font-size:25px;cursor:pointer}.youtube-preview>.youtube-open{position:absolute;right:10px;bottom:8px;z-index:1;font-size:12px;padding:3px 7px;background:#151515bf;color:#ddd;text-decoration:none}.youtube-preview iframe{width:100%;height:100%;position:absolute;inset:0;border:0}.cv-link .youtube-preview{height:100%;aspect-ratio:auto}.cv-link:has(.youtube-preview){overflow:hidden}
.cv-body{font-size:16px;padding:8px 12px}.cv-body h1{font-size:2em;line-height:1.25}.cv-body h2{font-size:1.6em}.cv-body h3{font-size:1.37em}
.web-edit-bar,.web-edit-tools,.web-inspector{position:fixed;z-index:20;background:#262626f5;border:1px solid var(--line);border-radius:6px;padding:6px;box-shadow:0 3px 16px #0004;font:13px/1.5 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo",sans-serif}
.web-edit-bar{top:max(12px,env(safe-area-inset-top));right:12px;display:flex;gap:10px;align-items:center;max-width:calc(100vw - 24px)}.web-edit-bar button,.web-edit-tools button,.web-inspector button{font:inherit;background:transparent;color:var(--text);border:0;border-radius:4px;padding:6px 10px;cursor:pointer}.web-edit-bar button:hover,.web-edit-tools button:hover,.web-inspector button:hover{background:#3b3b3b}.web-save-status{font-size:12px;color:var(--muted)}.web-save-status:empty{display:none}.web-edit-tools{top:64px;left:12px;display:flex;gap:2px;flex-wrap:wrap;max-width:calc(100vw - 24px)}.web-edit-tools[hidden],.web-inspector[hidden],.web-note-source[hidden]{display:none}
.web-inspector{right:12px;top:112px;width:min(280px,calc(100vw - 24px));max-height:calc(100svh - 200px);overflow:auto}.web-inspector label{display:block;color:var(--muted);margin:6px}.web-inspector textarea{width:100%;min-height:140px;resize:vertical;background:#202020;color:var(--text);border:1px solid var(--line);border-radius:3px;padding:8px;font:14px/1.5 ui-monospace,monospace}.web-inspector input,.web-inspector select{background:#202020;color:var(--text);border:1px solid #444;border-radius:3px;padding:4px}.web-dimensions{display:flex}.web-dimensions input{width:85px;display:block}.web-note-source{position:fixed;z-index:10;inset:110px max(20px,calc((100vw - 900px)/2)) 30px;width:auto;background:#202020;color:var(--text);border:1px solid #444;border-radius:4px;padding:20px;resize:none;font:16px/1.7 ui-monospace,SFMono-Regular,monospace}
.is-editing .cv-node,.is-editing .cv-group{cursor:move;touch-action:none}.is-editing .cv-body{pointer-events:none;touch-action:none}.is-editing .web-selected{outline:2px solid #75a7db;outline-offset:1px}.web-resize{position:absolute;right:-5px;bottom:-5px;width:14px;height:14px;background:#75a7db;border:2px solid #202020;border-radius:2px;cursor:nwse-resize;z-index:5}.is-editing .cv-edges{pointer-events:auto}.is-editing .cv-edge path{pointer-events:stroke;cursor:pointer;stroke-width:4}.is-editing .cv-edge.web-selected{outline:none}.is-editing .cv-edge.web-selected path{stroke:#75a7db}
@media(max-width:600px){.web-inspector{top:auto;bottom:80px;max-height:35svh}.web-inspector textarea{min-height:80px}.web-edit-tools{top:60px}.web-note-source{inset:115px 12px 20px}.web-edit-bar{font-size:12px}}
.cv-file .cv-body.markdown-rendered{padding:8px 12px;overflow:auto}
/* Direct in-node editing: content stays where it is on the board. */
.web-inspector{top:auto;bottom:14px;right:14px;width:auto;max-width:calc(100vw - 28px);max-height:30svh;display:flex;gap:5px;align-items:center;flex-wrap:wrap;padding:5px 8px}.web-inspector label{display:inline-flex;gap:5px;align-items:center;margin:0 3px}.web-inspector input[type=number]{width:64px}.web-inspector input[type=color]{width:28px;height:28px;padding:2px}.web-inspector input[type=text]{width:140px}.web-inspector select{max-width:90px}.is-editing .cmds-canvas-ui{bottom:64px}.web-inline-editor{position:absolute;inset:0;z-index:4;border-radius:5px;overflow:hidden;cursor:text;touch-action:auto;background:var(--background);font-size:16px;line-height:1.5}.web-inline-editor *{box-sizing:border-box}.web-inline-editor .cm-editor{height:100%}.web-inline-title{display:flex;align-items:flex-start;padding:8px}.web-inline-title input{width:100%;font:inherit;color:var(--text);background:#202020;border:1px solid #75a7db;padding:8px;border-radius:3px}.cv-group>.web-inline-title{inset:-30px 0 auto 0;padding:0;overflow:visible;background:none}.web-note-editor{position:fixed;z-index:10;inset:110px max(20px,calc((100vw - 900px)/2)) 30px;background:#202020;border:1px solid #444;border-radius:4px;overflow:hidden}.web-note-editor .cm-content{padding:20px!important}
@media(max-width:600px){.web-inspector{bottom:max(10px,env(safe-area-inset-bottom));max-height:24svh;font-size:12px}.web-note-editor{inset:115px 12px 20px}.web-inline-editor{font-size:16px}}
