html,body,#root{margin:0;height:100%}body{overflow:hidden}.app{height:100vh;height:100dvh;display:flex;flex-direction:column}.app__header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:8px 16px;background:var(--bg-card);border-bottom:1px solid var(--border);flex:0 0 auto}.tabs{display:flex;gap:4px;background:#0000000a;padding:3px;border-radius:999px}.tab{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:transparent;border:0;padding:5px 14px;font-size:12px;font-weight:600;color:var(--text-muted);border-radius:999px;cursor:pointer;transition:background .15s,color .15s;letter-spacing:.01em}.tab:hover:not(.tab--active){color:var(--text);background:#0000000d}.tab--active{background:var(--bg-card);color:var(--accent);box-shadow:0 1px 2px #00000014}.viewer-stage{position:relative;flex:1 1 auto;min-height:0;background:#0c0c0e;border-radius:var(--radius);border:1px solid #111;overflow:hidden}.viewer-stage .viewer-wrap,.viewer-stage canvas{width:100%;height:100%;display:block;touch-action:none}.composite-stage{position:relative;flex:1 1 auto;min-height:0;background:#000;border-radius:var(--radius);border:1px solid #111;overflow:hidden}.composite-stage canvas{width:100%;height:100%;display:block;touch-action:none}.composite-title,.composite-caption{position:absolute;color:#ffffffeb;pointer-events:none;font-weight:300;letter-spacing:.04em;text-shadow:0 1px 2px rgba(0,0,0,.6);font-family:-apple-system,Helvetica Neue,Arial,sans-serif}.composite-title{top:18px;left:0;right:0;text-align:center;font-size:clamp(15px,1.7vw,22px)}.composite-caption{bottom:16px;font-size:clamp(11px,1.1vw,14px);letter-spacing:.08em}.composite-caption--upper{left:0;width:50%;text-align:center}.composite-caption--lower{right:0;width:50%;text-align:center}.composite-slots{display:flex;gap:10px;margin-top:14px}.composite-slot{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;border:1px dashed var(--border);font-size:12px;color:var(--text-muted);background:#00000005}.composite-slot--filled{border-style:solid;border-color:var(--accent);color:var(--accent);background:#0000000a}.composite-slot__mark{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:50%;background:#00000014;font-size:10px;font-weight:700}.composite-slot--filled .composite-slot__mark{background:var(--accent);color:#fff}.app__brand{display:flex;align-items:center;gap:10px;font-weight:600;font-size:15px}.app__logo{color:var(--accent);font-size:18px;line-height:0}.app__hint{color:var(--text-muted);font-size:13px}.app__main{flex:1 1 auto;min-height:0;overflow:hidden;display:flex;flex-direction:column;gap:10px;padding:10px 14px 12px}.recon-stage{position:relative;flex:1 1 auto;min-height:0;background:#0c0c0e;border-radius:var(--radius);border:1px solid #111;overflow:hidden}.recon-stage canvas{width:100%;height:100%;display:block;touch-action:none}.recon-badge{position:absolute;top:10px;right:12px;font-size:11px;color:#ffffffd9;background:#0000008c;border:1px solid rgba(255,255,255,.15);border-radius:999px;padding:3px 9px;letter-spacing:.02em;text-transform:uppercase;pointer-events:auto;cursor:help}.recon-empty{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;color:#ffffff8c;background:#0c0c0e;border-radius:var(--radius);border:1px solid #111;font-size:13px}@media (max-width: 720px){body{overflow:auto}.app{height:auto;min-height:100dvh}.app__main{overflow:visible;padding:10px 10px 12px}.recon-stage,.recon-empty{min-height:60vh}.app__header{padding:10px 14px}.app__hint{display:none}}@media (max-height: 760px){.app__main{padding:8px 12px 10px;gap:8px}.app__header{padding:6px 14px}.panel{padding:8px 10px;gap:6px}.drop{padding:6px 10px}.thumb{width:64px;height:64px}.empty{padding:16px 20px}.empty h1{font-size:18px}.empty__sub{font-size:13px;line-height:1.4}.app__hint{display:none}}.empty{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background:var(--bg-card);border:1px dashed var(--border);border-radius:var(--radius);padding:24px 20px;overflow:hidden}.empty h1{margin:0 0 8px;font-size:20px;color:var(--text)}.empty__sub{margin:0;max-width:560px;color:var(--text-muted);line-height:1.5}.panel{flex:0 0 auto;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);padding:10px 12px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:8px}.drop{border:1.5px dashed var(--border);border-radius:var(--radius);padding:8px 12px;display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;cursor:pointer;transition:border-color .18s,background .18s;background:#f8fbfc}.drop:hover{border-color:var(--accent);background:#eefaf7}.drop--active{border-color:var(--accent);background:#d8f4ee}.drop__icon{font-size:20px;color:var(--accent);font-weight:300;line-height:1}.drop__label{font-weight:600;font-size:13px}.drop__hint{font-size:12px;color:var(--text-muted);margin-left:auto}.carousel{display:flex;gap:8px;overflow-x:auto;padding:2px}.thumb{flex:0 0 auto;position:relative;width:72px;height:72px;border-radius:8px;overflow:hidden;background:#111;border:1px solid var(--border)}.thumb img{width:100%;height:100%;object-fit:cover;display:block}.thumb__pos{position:absolute;bottom:3px;left:3px;right:3px;background:#000000a6;color:#fff;font-size:9px;font-weight:600;border-radius:4px;padding:2px 0;text-align:center;letter-spacing:.02em;text-transform:lowercase}.error{padding:8px 12px;background:#fff3f1;color:#b03a2e;border:1px solid #f5c2bb;border-radius:8px;font-size:13px}:root{--bg: #f4f8fa;--bg-card: #ffffff;--accent: #2dbfa8;--accent-dark: #1d8c7c;--text: #1c2a33;--text-muted: #6b7d87;--border: #dde6ea;--shadow: 0 6px 20px rgba(20, 40, 50, .08);--radius: 14px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}*{box-sizing:border-box}html,body,#root{margin:0;padding:0;height:100%}body{background:var(--bg);min-height:100vh}button{font:inherit;cursor:pointer}button:disabled{cursor:not-allowed;opacity:.6}
