.ff-scale-modal { position:fixed; z-index:1000; inset:0; display:grid; place-items:center; padding:16px; color:#f4f0e8; font-family:Manrope,sans-serif; }.ff-scale-modal__backdrop { position:absolute; inset:0; background:rgba(6,7,5,.82); backdrop-filter:blur(12px); }.ff-scale-shell { position:relative; width:min(1180px,100%); max-height:min(880px,calc(100vh - 32px)); overflow:auto; border:1px solid rgba(245,235,214,.18); border-radius:22px; background:#161713; box-shadow:0 28px 100px rgba(0,0,0,.56); }.ff-scale-header { display:flex; align-items:center; justify-content:space-between; padding:20px 24px; border-bottom:1px solid rgba(245,235,214,.13); background:linear-gradient(90deg,#20221c,#161713); }.ff-scale-kicker { margin:0 0 4px; color:#d3b575; font-family:"DM Mono",monospace; font-size:.62rem; letter-spacing:.13em; text-transform:uppercase; }.ff-scale-header h2 { margin:0; font-family:"Barlow Condensed",sans-serif; font-size:2.25rem; font-weight:700; letter-spacing:-.04em; line-height:.9; text-transform:uppercase; }.ff-scale-icon-button { width:38px; height:38px; border:1px solid rgba(245,235,214,.2); border-radius:8px; background:transparent; color:#f4f0e8; cursor:pointer; font-size:1.65rem; line-height:1; }.ff-scale-layout { display:grid; grid-template-columns:minmax(255px,318px) minmax(0,1fr); }.ff-scale-panel { display:flex; flex-direction:column; gap:14px; padding:22px; border-right:1px solid rgba(245,235,214,.13); background:#1c1d18; }.ff-scale-step { display:flex; gap:11px; align-items:flex-start; }.ff-scale-step>span { display:grid; width:27px; height:27px; flex:0 0 auto; place-items:center; border:1px solid rgba(141,207,187,.6); border-radius:50%; color:#abe4d2; font-family:"DM Mono",monospace; font-size:.62rem; }.ff-scale-step strong { display:block; font-family:"Barlow Condensed",sans-serif; font-size:1.15rem; letter-spacing:.01em; text-transform:uppercase; }.ff-scale-step p { margin:3px 0 0; color:#aaa69b; font-size:.68rem; line-height:1.45; }.ff-scale-step.is-disabled { opacity:.38; }.ff-scale-upload { display:flex; align-items:center; gap:10px; padding:13px; border:1px dashed rgba(211,181,117,.48); border-radius:11px; background:rgba(211,181,117,.06); color:#f4f0e8; cursor:pointer; }.ff-scale-upload input { position:absolute; width:1px; height:1px; opacity:0; }.ff-scale-upload__symbol { display:grid; width:32px; height:32px; flex:0 0 auto; place-items:center; border-radius:8px; background:#d3b575; color:#171815; font-size:1.45rem; }.ff-scale-upload strong,.ff-scale-upload small { display:block; }.ff-scale-upload strong { font-size:.76rem; }.ff-scale-upload small { margin-top:2px; color:#aaa69b; font-size:.61rem; }.ff-scale-fields { display:grid; grid-template-columns:1fr .86fr; gap:8px; }.ff-scale-fields label { color:#aaa69b; font-family:"DM Mono",monospace; font-size:.59rem; letter-spacing:.06em; text-transform:uppercase; }.ff-scale-fields input,.ff-scale-fields select { box-sizing:border-box; width:100%; margin-top:5px; padding:9px; border:1px solid rgba(245,235,214,.18); border-radius:7px; background:#12130f; color:#f4f0e8; font-family:Manrope,sans-serif; font-size:.75rem; }.ff-scale-fields input:disabled,.ff-scale-fields select:disabled { opacity:.4; }.ff-scale-button { min-height:37px; border:1px solid rgba(245,235,214,.2); border-radius:7px; background:rgba(255,255,255,.035); color:#f4f0e8; cursor:pointer; font-family:"DM Mono",monospace; font-size:.62rem; letter-spacing:.045em; text-transform:uppercase; }.ff-scale-button:disabled { opacity:.35; cursor:not-allowed; }.ff-scale-button--primary { border-color:rgba(141,207,187,.45); background:#28554b; color:#ecfff9; }.ff-scale-result { padding:13px; border:1px solid rgba(141,207,187,.25); border-radius:10px; background:linear-gradient(135deg,rgba(141,207,187,.10),transparent); }.ff-scale-result span,.ff-scale-result small { display:block; color:#aaa69b; font-family:"DM Mono",monospace; font-size:.58rem; letter-spacing:.07em; text-transform:uppercase; }.ff-scale-result strong { display:block; margin:5px 0; color:#abe4d2; font-family:"Barlow Condensed",sans-serif; font-size:2rem; line-height:.95; }.ff-scale-result small { color:#c7c1b3; letter-spacing:0; text-transform:none; }.ff-scale-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }.ff-scale-stage-wrap { display:flex; min-width:0; flex-direction:column; padding:20px; background:radial-gradient(circle at 60% 0,rgba(211,181,117,.1),transparent 25rem),#12130f; }.ff-scale-stage { position:relative; display:grid; min-height:420px; flex:1; place-items:center; overflow:auto; border:1px solid rgba(245,235,214,.15); border-radius:13px; background-color:#0d0e0b; background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:25px 25px; cursor:crosshair; }.ff-scale-stage:focus-visible { outline:2px solid #8dcfbb; outline-offset:3px; }.ff-scale-stage canvas { display:block; max-width:100%; height:auto; }.ff-scale-empty { display:grid; max-width:300px; place-items:center; padding:35px; color:#aaa69b; text-align:center; }.ff-scale-empty span { display:grid; width:60px; height:60px; margin-bottom:15px; place-items:center; border:1px solid rgba(211,181,117,.35); border-radius:14px; color:#d3b575; }.ff-scale-empty svg { width:32px; height:32px; fill:none; stroke:currentColor; stroke-linecap:round; stroke-linejoin:round; stroke-width:1.3; }.ff-scale-empty strong { color:#f4f0e8; font-family:"Barlow Condensed",sans-serif; font-size:1.5rem; text-transform:uppercase; }.ff-scale-empty p { margin:7px 0 0; font-size:.73rem; line-height:1.5; }.ff-scale-hint { position:sticky; bottom:12px; left:12px; justify-self:start; margin:-49px 12px 12px; padding:7px 10px; border:1px solid rgba(141,207,187,.32); border-radius:6px; background:rgba(16,17,15,.84); color:#d9eee7; font-family:"DM Mono",monospace; font-size:.58rem; letter-spacing:.03em; pointer-events:none; }.ff-scale-instruction { margin:12px 2px 0; color:#aaa69b; font-size:.7rem; line-height:1.45; }
.ff-scale-calibration-note { margin:0; color:#c7c1b3; font-size:.63rem; line-height:1.45; }
.ff-scale-actions #ff-scale-export { grid-column:1 / -1; }
.ff-scale-stage-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; color:#aaa69b; font-family:"DM Mono",monospace; font-size:.59rem; letter-spacing:.07em; text-transform:uppercase; }
.ff-scale-stage-toolbar strong { margin-left:6px; color:#abe4d2; }
.ff-scale-zoom-actions { display:flex; gap:6px; }
.ff-scale-zoom-button { min-height:29px; padding:0 9px; border:1px solid rgba(245,235,214,.2); border-radius:6px; background:rgba(255,255,255,.035); color:#f4f0e8; cursor:pointer; font-family:"DM Mono",monospace; font-size:.61rem; letter-spacing:.04em; text-transform:uppercase; }
.ff-scale-zoom-button:first-child,.ff-scale-zoom-button:last-child { width:30px; padding:0; font-size:1rem; }
.ff-scale-zoom-button:disabled { opacity:.35; cursor:not-allowed; }
.ff-scale-stage { display:block; }
.ff-scale-stage canvas { max-width:none; margin:auto; cursor:crosshair; }
.ff-scale-hint { display:table; justify-self:auto; }
.ff-scale-loupe { position:fixed; z-index:4; width:176px; height:176px; overflow:hidden; border:2px solid #abe4d2; border-radius:50%; box-shadow:0 12px 30px rgba(0,0,0,.44); pointer-events:none; }
.ff-scale-loupe canvas { display:block; width:100%; height:100%; image-rendering:pixelated; }
.ff-scale-loupe::before,.ff-scale-loupe::after { position:absolute; top:50%; left:50%; background:rgba(244,240,232,.95); box-shadow:0 0 0 1px rgba(16,17,15,.75); content:""; }
.ff-scale-loupe::before { width:100%; height:1px; transform:translate(-50%,-50%); }
.ff-scale-loupe::after { width:1px; height:100%; transform:translate(-50%,-50%); }
.ff-scale-loupe span { position:absolute; top:50%; left:50%; width:13px; height:13px; border:1px solid #f4f0e8; border-radius:50%; background:rgba(16,17,15,.42); transform:translate(-50%,-50%); }
@media (max-width:720px) { .ff-scale-modal { padding:0; align-items:end; }.ff-scale-shell { max-height:94vh; border-right:0; border-bottom:0; border-left:0; border-radius:20px 20px 0 0; }.ff-scale-header { padding:17px 18px; }.ff-scale-layout { grid-template-columns:1fr; }.ff-scale-panel { border-right:0; border-bottom:1px solid rgba(245,235,214,.13); }.ff-scale-stage-wrap { min-height:390px; padding:14px; }.ff-scale-stage { min-height:300px; }.ff-scale-header h2 { font-size:2rem; }.ff-scale-loupe { display:none; } }