*,*:before,*:after{margin:0;padding:0;box-sizing:border-box;scroll-behavior:smooth}::selection{background-color:#adff2f}::-webkit-selection{background-color:#adff2f}html,body{height:100%}a{-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none;text-decoration:none;color:inherit;transition:color .4s ease,transform .3s ease;display:inline-block}a:hover{transform:translateY(-2px);color:#adff2f}.no-scroll{overflow:hidden;position:fixed;inset:0;width:100%;height:100%;touch-action:none}:root{--gutter: 20px;--header-h: 72px}@media (min-width: 768px){:root{--gutter: 24px}}@supports (padding: max(0px)){:root{--safe-l: env(safe-area-inset-left);--safe-r: env(safe-area-inset-right);--safe-b: env(safe-area-inset-bottom)}}.no-select,.no-select *{user-select:none!important;-webkit-user-select:none!important;-webkit-touch-callout:none!important}a,button{-webkit-tap-highlight-color:transparent}body{padding-inline:max(var(--gutter),var(--safe-l)) max(var(--gutter),var(--safe-r));padding-block:20px;background-color:#fff;min-height:100dvh}h1 a{margin-bottom:20px;margin-left:10px;font-family:IBM Plex Sans,sans-serif;text-decoration:none;color:#adff2f}.glass-theme{--ink:#0f1619;--accent: greenyellow;--glass-bg: hsla(195,35%,92%,.5);--glass-stroke: hsla(0,0%,100%,.35);color:var(--ink)}.glass-theme h1 a{color:var(--accent);text-decoration:none;transition:color .6s cubic-bezier(.22,.61,.36,1)}.glass-theme h1 a:hover{color:var(--ink)}.glass-theme a{color:var(--ink);text-decoration:none;transition:color .6s cubic-bezier(.22,.61,.36,1)}.glass-theme a:hover{color:var(--accent)}.menu{white-space:nowrap;text-align:left;align-items:center;gap:24px;justify-content:flex-start;font-family:IBM Plex Sans,Helvetica Neue,Arial,sans-serif;color:#000;display:inline-flex;letter-spacing:.04em;flex-grow:1;font-size:18px;text-decoration:none;font-weight:300;margin:30px 30px 0 10px}.dropbtn a{font-family:Roboto Mono,Nanum Gothic,sans-serif;color:#000;display:inline-flex;flex-grow:1;font-size:18px;text-decoration:none;font-weight:300;margin:20px 30px 0 10px}.dropdown{position:relative;display:inline-block}.dropbtn{background:transparent;border:none;cursor:pointer;padding:0;font:inherit}.dropdown-content{display:none;position:absolute;top:100%;left:0;min-width:200px;z-index:1;background:#ffffff26;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.3);box-shadow:0 4px 30px #0000004d}.dropdown-content a{display:block;padding:8px 12px;margin:0;text-decoration:none;font-size:15px;font-weight:300;background:#ffffff0d;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:backdrop-filter .3s ease,background .3s ease}.dropdown-content a:hover{border:1px greenyellow inset}.dropdown:hover .dropdown-content{display:block}.tag-grid{cursor:crosshair;position:relative;margin:20px auto;overflow:hidden;border-radius:14px;width:min(1300px,calc(100svw - (2 * var(--gutter))))}@supports not (width: 1svw){.tag-grid{width:min(1300px,calc(100vw - (2 * var(--gutter))))}}.tag-grid{height:clamp(400px,68svh,550px);background-color:#f5f5f5;--grid: 20px;--line: 1px;--line-color: rgba(0,0,0,.12);--sub-grid: 20px;--sub-line: 1px;--sub-color: rgba(0,0,0,.05);padding:clamp(20px,2svw,40px);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.18);box-shadow:0 30px 60px #00000059;background-origin:padding-box;background-clip:padding-box;background-position:0 0;background-image:repeating-linear-gradient(to right,var(--line-color) 0 var(--line),transparent var(--line) var(--grid)),repeating-linear-gradient(to bottom,var(--line-color) 0 var(--line),transparent var(--line) var(--grid));will-change:transform}.tag-grid{touch-action:pan-x pan-y}.tag-grid .node:focus-visible{outline:3px solid #adff2f}@media (min-resolution: 2dppx){.tag-grid{--line: .5px}}.preview,.preview *{-webkit-user-select:none;user-select:none;-webkit-user-drag:none;caret-color:transparent}.preview{position:fixed;z-index:9999;width:clamp(180px,38svw,360px);max-width:90%;background:transparent!important;box-shadow:none!important;border:none!important;opacity:0;pointer-events:none;left:0;top:0;transition:opacity .18s ease}.preview.visible{opacity:1}.preview img{display:block;width:100%;height:auto;border-radius:6px;box-shadow:0 12px 28px #00000038}.preview .caption{margin-top:6px;font:300 15px/1.4 IBM Plex Sans,sans-serif;color:#111;text-align:left;background:transparent!important}.snap-highlight{position:absolute;width:10px;height:10px;border-radius:50%;background:#adff2f;pointer-events:none;transform:translate(-50%,-50%);opacity:0;transition:opacity .15s ease;z-index:1000}.snap-highlight.visible{opacity:1}.grid-marker{position:absolute;left:0;top:0;width:10px;height:10px;border-radius:50%;transform:translate(-50%,-50%);background:#000;border:0;padding:0;cursor:crosshair;opacity:.9}@media (pointer: coarse){.preview{width:280px}}@media (max-width: 768px){.menu{font-size:15px}}@media (pointer: coarse){.preview{width:180px}}@media (min-width: 1024px){.tag-grid{height:clamp(600px,calc(var(--vhpx) - var(--header-h, 72px) - 160px),1080px);margin-bottom:40px}}@media (min-width: 768px) and (max-width: 1023px){.tag-grid{height:clamp(560px,calc(var(--vhpx) - var(--header-h, 72px) - 120px),960px);margin-block:12px 16px}}@media (max-width: 767px){:root{--bottom-gap: max(16px, env(safe-area-inset-bottom, 0px));--mobile-breath: 56px}.snap-highlight,.grid-marker{width:6px!important;height:6px!important}.tag-grid{height:clamp(440px,calc(var(--vhpx) - var(--header-h, 64px) - var(--bottom-gap) - var(--mobile-breath)),780px);width:min(1300px,calc(100svw - (2 * var(--gutter, 16px))));margin:12px auto var(--bottom-gap)}}@media (max-width: 900px){.writer-shell{grid-template-columns:1fr;gap:12px}}@media (min-width: 768px){.grid-marker{position:absolute;left:0;top:0;width:10px;height:10px;border-radius:50%;background:#000;padding:0;cursor:crosshair;transform:translate(-50%,-50%);z-index:1200}}.grid-marker:hover{background:#adff2f;cursor:pointer}.note-editor{position:absolute;min-width:220px;max-width:300px;padding:12px;border-radius:12px;background:#ffffff26;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.35);box-shadow:0 8px 24px #00000040;z-index:2000;display:flex;flex-direction:column;gap:8px}.note-editor textarea{width:100%;min-height:70px;border:none;outline:none;resize:vertical;padding:8px 10px;border-radius:8px;font:16px/1.6 IBM Plex Sans,Nanum Gothic,sans-serif;color:#111;background:#ffffff8c;box-shadow:inset 0 2px 6px #00000026}.note-editor button{align-self:flex-end;padding:6px 12px;font:12px Roboto Mono,monospace;border:1px solid rgba(172,255,47,.7);background:#acff2f26;border-radius:6px;cursor:pointer;color:#111;transition:all .2s ease}.note-editor button:hover{background:#acff2f66;border-color:#acff2f;color:#000}.note-bubble:after{content:"";position:absolute;left:10px;bottom:-6px;border-width:6px 6px 0 6px;border-style:solid;border-color:rgba(255,255,200,.95) transparent transparent transparent}.note-bubble[data-dir=up]:after{top:-6px;bottom:auto;border-width:0 6px 6px 6px;border-color:transparent transparent rgba(255,255,200,.95) transparent}.tag-grid .note-view{position:absolute;pointer-events:none}.tag-grid .note-bubble{font-family:IBM Plex Sans,Nanum Gothic,system-ui,-apple-system,sans-serif;font-size:12px;line-height:1.4;font-weight:500;letter-spacing:.01em;color:#111;text-shadow:0 1px 0 rgba(255,255,255,.6);max-width:32ch;white-space:normal;word-break:keep-all;transform:translateZ(0)}
