/*! Copyright (c) 2026 Arney Nova. MIT License; see /licenses/MIT.txt. */
main.graph-page{max-width:1500px;padding:32px 32px 45px}.graph-page h1{font-size:2rem}.graph-intro{font-size:13px;color:var(--muted);margin:10px 0 22px}.graph-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:18px 0 12px}.graph-toolbar label{display:flex;align-items:center;gap:6px;color:#c0b6cb;font-size:12px}.graph-toolbar input[type=checkbox]{accent-color:var(--accent)}.graph-toolbar .graph-search-label{flex:1;min-width:190px}.graph-toolbar input[type=search]{font-size:12px;padding:9px 12px;min-width:0}.graph-toolbar button,.graph-actions button,.graph-open{font:inherit;font-size:12px;color:var(--text);border:1px solid #51435e;background:#2b2532;border-radius:6px;padding:7px 12px;cursor:pointer}.graph-toolbar button:hover,.graph-actions button:hover{background:#41334e}.graph-shell{display:grid;grid-template-columns:minmax(0,1fr) 235px;min-height:540px;border:1px solid #39323f;border-radius:10px;overflow:hidden;background:#17171b}.graph-viewport{position:relative;min-width:0;min-height:540px;height:min(70vh,760px);overflow:hidden}.graph-viewport canvas{display:block;width:100%;height:100%;touch-action:none;cursor:grab;outline-offset:-3px}.graph-viewport canvas:active{cursor:grabbing}.graph-help{position:absolute;bottom:9px;left:15px;font-size:10px;color:#8c809b;pointer-events:none}.graph-legend{position:absolute;top:12px;left:15px;font-size:10px;color:#a99cba;display:flex;gap:12px;pointer-events:none}.graph-legend i{display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:5px}.graph-legend .home-dot{background:#98bfa2}.graph-legend .tag-dot{background:#ba9df0}.graph-legend .note-dot{background:#8a849c}.graph-detail{padding:20px 17px;border-left:1px solid #39323f;background:#1d1b22;min-width:0;overflow-y:auto;max-height:max(540px,min(70vh,760px))}.graph-detail h2{font-size:16px;overflow-wrap:anywhere;margin:6px 0 12px}.graph-detail p{font-size:12px;color:#aaa0b7}.graph-detail .graph-open{display:inline-block;background:#403149;color:#e0caef;border-color:#6e4c86;margin:5px 0 15px}.graph-neighbors{list-style:none;padding:0;font-size:12px}.graph-neighbors li{border-bottom:1px solid #332d3b;padding:7px 0}.graph-neighbors a{overflow-wrap:anywhere}.graph-actions{display:flex;gap:6px;flex-wrap:wrap}.graph-actions button{padding:5px 9px}.graph-results{list-style:none;padding:0;max-height:220px;overflow:auto;font-size:12px;margin:0 0 14px}.graph-results button{font:inherit;background:none;border:none;color:var(--accent);cursor:pointer;padding:5px 0;text-align:left}.graph-status{font-size:11px;color:#9d91ad;margin:10px 0}.graph-local{display:inline-block;margin:8px 0 18px;font-size:11px;color:#a694bb}.graph-open:focus-visible,.graph-results button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media(max-width:900px){.graph-shell{grid-template-columns:1fr}.graph-detail{border-left:0;border-top:1px solid #39323f;max-height:320px;min-height:120px}.graph-viewport{height:55vh;min-height:370px}.graph-shell{min-height:0}.graph-page .graph-toolbar{gap:10px}main.graph-page{padding:28px 20px}}@media(max-width:640px){.graph-viewport{min-height:330px;height:50vh}.graph-toolbar .graph-search-label{flex-basis:100%}.graph-help{font-size:9px}.graph-legend{gap:9px}}

.graph-touch-preview{display:none}
@media(pointer:coarse){
  .graph-touch-preview:not([hidden]){position:absolute;left:10px;right:10px;bottom:10px;display:flex;align-items:center;gap:12px;padding:8px 12px;background:#27212ff5;border:1px solid #655074;border-radius:10px;box-shadow:0 3px 16px #0005}
  .graph-touch-preview>span{flex:1;min-width:0;font-size:12px;font-weight:600;line-height:1.4;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .graph-touch-preview>a{display:flex;align-items:center;min-height:44px;flex-shrink:0;font-size:12px;color:#e0caef}
  .graph-viewport.has-selection .graph-help{display:none}
  .graph-actions button,.graph-open,.graph-results button{min-height:44px;min-width:44px}
  .graph-results button{width:100%;padding:10px 5px}
  .graph-toolbar label{min-height:44px}
  .graph-toolbar input[type=checkbox]{width:20px;height:20px}
  .graph-toolbar input[type=search]{font-size:16px}
  .graph-neighbors a{display:flex;align-items:center;min-height:44px}
}
