@font-face{font-family:Inter;font-weight:400;font-display:swap;src:url(fonts/inter-400.woff2) format('woff2')}
@font-face{font-family:Inter;font-weight:500;font-display:swap;src:url(fonts/inter-500.woff2) format('woff2')}
@font-face{font-family:Inter;font-weight:600;font-display:swap;src:url(fonts/inter-600.woff2) format('woff2')}
[hidden]{display:none!important}
:root{--blue:#3b7bf8;--ink:#4c5244;--ink-on:#1d2a12}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;height:100%;overflow:hidden;background:#ebe5d8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased;user-select:none;-webkit-user-select:none;touch-action:none}
body{background:radial-gradient(75% 120% at 50% 50%,#eee6d9 0%,#eee6d9 40%,#e7dfd4 64%,#e3dbd0 77%,#dfd7cc 100%)}
#c{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:grab}
#c.grabbing{cursor:grabbing}
#sel .h{display:none!important}
#c.pointer{cursor:pointer}#c.grab{cursor:grab}#c.move{cursor:grabbing}
#draw{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
#stroke{fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;transition:opacity .45s ease}
#stroke.fade{opacity:0}
#sel{position:fixed;inset:0;pointer-events:none}
#sel .box{position:absolute;border:1px solid var(--blue)}
#sel .h{position:absolute;width:7px;height:7px;background:#fff;border:1px solid var(--blue);border-radius:1px;pointer-events:auto;touch-action:none}
#sel .h::after{content:"";position:absolute;inset:-12px}
#sel .tl{left:-4px;top:-4px;cursor:nwse-resize}#sel .tr{right:-4px;top:-4px;cursor:nesw-resize}
#sel .bl{left:-4px;bottom:-4px;cursor:nesw-resize}#sel .br{right:-4px;bottom:-4px;cursor:nwse-resize}
#sel .dim{position:absolute;transform:translateX(-50%);white-space:nowrap;background:var(--blue);color:#fff;font-size:10.5px;font-weight:400;line-height:17px;height:17px;padding:0 6px;border-radius:3.5px;letter-spacing:.005em;font-variant-numeric:tabular-nums}
#bar{position:fixed;transform:translateX(-50%);display:flex;align-items:center;gap:2px;height:40px;padding:0 5px;border-radius:11px;
  background:rgba(248,247,238,.86);box-shadow:0 1px 2px rgba(40,50,20,.10),0 6px 18px rgba(40,50,20,.10);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);white-space:nowrap}
#bar button{font:inherit;font-size:12.5px;font-weight:500;color:var(--ink);background:transparent;border:0;height:30px;padding:0 10px;border-radius:7px;cursor:pointer;display:flex;align-items:center;justify-content:center;touch-action:manipulation}
#bar button:hover{background:rgba(120,120,95,.13)}
#bar button.on{background:rgba(110,140,60,.20);color:var(--ink-on);font-weight:600}
#bar button.ic{width:31px;padding:0}
#bar svg{width:15px;height:15px;fill:none;stroke:#2c3027;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
#bar .sep{width:1px;height:20px;background:rgba(90,95,70,.16);margin:0 5px}
#hint{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-50%);font-size:12px;color:rgba(60,62,50,.62);transition:opacity .8s;pointer-events:none;white-space:nowrap}
#hint.off{opacity:0}
#credit{position:fixed;right:12px;bottom:calc(10px + env(safe-area-inset-bottom));font-size:10.5px;color:rgba(60,62,50,.38);text-decoration:none}
#ed{position:fixed;left:12px;bottom:calc(10px + env(safe-area-inset-bottom));font-size:10.5px;color:rgba(60,62,50,.32);text-decoration:none}#ed:hover{color:rgba(60,62,50,.7)}
#credit:hover{color:rgba(60,62,50,.7)}body.clean #hint,body.clean #credit,body.clean #ed{display:none}
@media (max-width:640px){#bar button{font-size:12px;padding:0 8px}#bar button.ic{width:28px}#bar .sep{margin:0 3px}#credit{left:auto;right:10px;text-align:right;bottom:calc(6px + env(safe-area-inset-bottom))}#ed{left:10px;bottom:calc(6px + env(safe-area-inset-bottom))}#hint{bottom:calc(24px + env(safe-area-inset-bottom))}}