:root{--bg:#ffffff;--ink:#0f1320;--muted:#6c7686;--line:#d9e2ef;--panel:#f6f8fb;--panel-2:#ffffff;--brand:#0aa770;--brand-2:#33c3ff;--radius-lg:18px;--radius-sm:10px;--header-h:56px;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--shadow-btn:0 12px 32px rgba(15,19,32,.08);--border-pad:2px solid var(--line);--font-stack:-apple-system,BlinkMacSystemFont,"Inter","Roboto","Helvetica Neue",Arial,sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:#fff0;touch-action:manipulation;font-family:var(--font-stack)}body{margin:0;background:radial-gradient(circle at 20% 20%,rgb(51 195 255 / .08) 0%,#fff0 60%),radial-gradient(circle at 80% 30%,rgb(10 167 112 / .08) 0%,#fff0 60%),var(--bg);color:var(--ink);min-height:100dvh;display:flex;flex-direction:column;padding-top:calc(var(--header-h) + var(--safe-top));padding-bottom:var(--safe-bottom);overflow:hidden}.header-bar{position:fixed;top:0;left:0;right:0;height:calc(var(--header-h) + var(--safe-top));padding-top:var(--safe-top);display:flex;align-items:center;justify-content:center;background:rgb(255 255 255 / .7);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid rgb(15 19 32 / .06);z-index:100;text-decoration:none}.brand-link{display:flex;flex-direction:column;align-items:center;line-height:1.1;font-weight:600;font-size:16px;text-decoration:none}.brand-text{font-weight:600;font-size:16px;background:conic-gradient(from 0deg,#0aa770 0%,#33c3ff 50%,#0aa770 100%);-webkit-background-clip:text;color:#fff0}.brand-sub{font-size:11px;font-weight:500;color:var(--muted)}.app-shell{flex:1;min-height:0;display:flex;flex-direction:column;padding:12px clamp(12px,2vw,16px) calc(12px + var(--safe-bottom));max-width:1400px;width:100%;margin:0 auto;gap:12px;overflow:hidden}.toolbar{flex-shrink:0;background:rgb(255 255 255 / .9);border:1px solid rgb(15 19 32 / .07);border-radius:var(--radius-lg);box-shadow:0 24px 60px rgb(15 19 32 / .08);display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 12px;padding:10px 12px;font-size:13px;line-height:1.2;z-index:10}.action-btn{appearance:none;border:0;cursor:pointer;background:#fff;border-radius:var(--radius-sm);border:1px solid rgb(15 19 32 / .07);padding:10px 12px;font-size:13px;font-weight:500;color:var(--ink);line-height:1.2;box-shadow:var(--shadow-btn);display:flex;align-items:center;gap:6px}.action-btn[data-accent="brand"]{background:linear-gradient(90deg,var(--brand) 0%,var(--brand-2) 100%);color:#fff;border:0;box-shadow:0 16px 32px rgb(51 195 255 / .3),0 8px 24px rgb(10 167 112 / .3)}.action-btn:active{transform:scale(.97)}.ctrl-group{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);font-weight:500}.ctrl-group label{color:var(--ink);font-size:12px;min-width:max-content}#sizeRange{appearance:none;width:80px;height:4px;background:var(--line);border-radius:999px;outline:none}#sizeRange::-webkit-slider-thumb{appearance:none;width:16px;height:16px;border-radius:50%;background:linear-gradient(90deg,var(--brand) 0%,var(--brand-2) 100%);box-shadow:0 4px 12px rgb(51 195 255 / .4),0 4px 12px rgb(10 167 112 / .4);border:0}#sizeRange::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:linear-gradient(90deg,var(--brand) 0%,var(--brand-2) 100%);box-shadow:0 4px 12px rgb(51 195 255 / .4),0 4px 12px rgb(10 167 112 / .4);border:0}.color-picker{appearance:none;-webkit-appearance:none;padding:0;width:32px;height:32px;border-radius:var(--radius-sm);border:1px solid rgb(15 19 32 / .15);box-shadow:var(--shadow-btn);cursor:pointer;background:#0f1320}.color-picker::-webkit-color-swatch{border:none;border-radius:var(--radius-sm);padding:0}.color-picker::-moz-color-swatch{border:none;border-radius:var(--radius-sm);padding:0}.download-wrap{position:relative}.download-menu{position:absolute;right:0;top:calc(100% + 6px);min-width:180px;background:#fff;border-radius:var(--radius-sm);box-shadow:0 24px 60px rgb(15 19 32 / .16);border:1px solid rgb(15 19 32 / .07);padding:8px;display:none;z-index:200}.download-menu button{width:100%;background:#fff;border:0;text-align:left;font-size:13px;line-height:1.3;color:var(--ink);font-weight:500;border-radius:var(--radius-sm);padding:10px 12px;display:flex;align-items:center;gap:8px;cursor:pointer}.download-menu button+button{margin-top:4px}.download-menu button:hover{background:var(--panel)}.draw-area{flex:1;min-height:0;background:var(--panel);border-radius:var(--radius-lg);border:var(--border-pad);box-shadow:inset 0 0 20px rgb(15 19 32 / .03),0 16px 40px rgb(15 19 32 / .06);display:flex;flex-direction:column;overflow:hidden}.pad-top-hint{flex-shrink:0;height:36px;font-size:12px;color:var(--muted);border-bottom:1px dashed rgb(15 19 32 / .08);display:flex;align-items:center;justify-content:center;padding:0 12px;text-align:center;gap:6px;font-weight:500}.canvas-holder{flex:1;min-height:0;position:relative;background:repeating-linear-gradient(0deg,#fff0 0,#fff0 35px,rgb(51 195 255 / .08) 36px);overflow:hidden}#sign-canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.icon{font-size:14px;line-height:1;display:inline-block}@media(min-width:768px){.toolbar{justify-content:flex-start}}