html body #warp-panel{box-sizing:border-box;width:min(560px,calc(100vw - 24px));max-width:calc(100vw - 24px);max-height:calc(100dvh - 32px);padding:18px;border:1px solid var(--ui-panel-start-line);border-radius:14px;background:var(--ui-panel-start-bg);color:var(--ui-panel-start-fg);box-shadow:0 12px 40px var(--ui-panel-start-shadow);overflow:auto}
#warp-panel::backdrop{background:var(--ui-panel-backdrop)}
html body #warp-panel header{position:static;inset:auto;pointer-events:auto;display:flex;align-items:center;justify-content:space-between;gap:12px}
#warp-panel h2{margin:0;font-size:20px;color:var(--ui-panel-start-accent)}#warp-panel h3{margin:18px 0 6px;font-size:14px;color:var(--ui-panel-start-accent)}
#warp-panel .warp-help{font-size:12px;line-height:1.6;color:var(--ui-panel-start-muted);margin:10px 0}
html body #warp-panel button{box-sizing:border-box;min-height:44px;border:1px solid var(--ui-panel-start-line);border-radius:8px;background:var(--ui-panel-start-soft);color:var(--ui-panel-start-accent);font:inherit;padding:8px 12px;cursor:pointer}
html body #warp-panel .warp-destination{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;margin:6px 0;text-align:start;font-size:14px;line-height:1.5;overflow-wrap:anywhere}
#warp-panel .warp-destination>span:first-child{min-width:0}#warp-panel .warp-state{flex-shrink:0;font-size:12px;padding:2px 6px;border-radius:9px;background:var(--ui-panel-start-accent-soft)}
html body #warp-panel button:disabled{opacity:1;cursor:default;background:var(--ui-panel-disabled-bg);color:var(--ui-panel-disabled-fg);border-color:var(--ui-panel-disabled-line)}#warp-panel button:disabled .warp-state{background:var(--ui-panel-disabled-bg);color:var(--ui-panel-disabled-fg)}
html body #warp-panel button:focus-visible{outline:3px solid var(--ui-panel-start-accent);outline-offset:2px}
@media(max-width:400px){html body #warp-panel{padding:14px}html body #warp-panel .warp-destination{padding:8px;font-size:13px;gap:5px}}

#warp-hint{position:fixed;z-index:2;transform:translate(-50%,-100%);pointer-events:none;padding:5px 10px;border:1px solid var(--ui-panel-start-line);border-radius:9px;background:var(--ui-panel-start-bg);color:var(--ui-panel-start-accent);box-shadow:0 2px 8px var(--ui-panel-start-shadow);font:600 13px/1.4 sans-serif;white-space:nowrap}
#warp-hint[hidden]{display:none}
html body #interact.warp-ready{outline:3px solid var(--ui-panel-start-accent);outline-offset:3px;box-shadow:0 0 0 6px var(--ui-panel-start-accent-soft)}