:root{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji";line-height:1.5;font-weight:400;color-scheme:light;color:#1f2937;background:radial-gradient(1200px 600px at 20% 0%,#fff7ed,#fff 55%,#fff7ed);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:transparent}a{color:inherit;text-decoration:none}button,input{font:inherit}.app{min-height:100vh;padding:16px 16px 24px}.container{width:100%;max-width:720px;margin:0 auto;display:flex;flex-direction:column;gap:16px}.brand{display:flex;align-items:center;justify-content:space-between;padding:6px 2px}.brandTitle{font-size:16px;font-weight:700;letter-spacing:-.01em}.brandSub{font-size:12px;color:#6b7280}.card{background:#ffffffe6;border:1px solid rgba(226,232,240,.9);border-radius:18px;box-shadow:0 10px 30px #0f172a14;overflow:hidden}.pad{padding:16px}.uploader{display:grid;place-items:center;min-height:220px}.uploadBtn{width:96px;height:96px;border-radius:999px;border:1px solid rgba(251,146,60,.35);background:linear-gradient(180deg,#fff7ed,#ffedd5);color:#9a3412;font-size:44px;line-height:1;cursor:pointer;display:grid;place-items:center;box-shadow:0 10px 24px #f973162e;transition:transform .12s ease,box-shadow .12s ease}.uploadBtn:active{transform:scale(.98);box-shadow:0 8px 18px #f9731624}.previewRow{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:start}.previewImg{width:100%;aspect-ratio:4 / 3;object-fit:cover;border-radius:16px;border:1px solid rgba(226,232,240,.9)}.iconBtn{width:44px;height:44px;border-radius:12px;border:1px solid rgba(226,232,240,.9);background:#fff;cursor:pointer}.iconBtn:active{transform:scale(.98)}.hint{margin:10px 0 0;font-size:13px;color:#6b7280}.resultTitle{margin:0 0 10px;font-size:14px;font-weight:700;color:#111827}.resultBox{white-space:pre-wrap;margin:0;padding:14px;border-radius:14px;border:1px solid rgba(226,232,240,.9);background:#fffaf5;min-height:160px}.errorBox{white-space:pre-wrap;margin:0;padding:14px;border-radius:14px;border:1px solid rgba(252,165,165,.55);background:#fef2f2e6;color:#991b1b}.bottomBar{position:sticky;bottom:0;padding:12px 0 0;background:linear-gradient(180deg,#fff7ed00,#fff7edd9 35%,#fff7ed);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.primaryBtn{width:100%;height:52px;border-radius:16px;border:1px solid rgba(249,115,22,.35);background:linear-gradient(180deg,#fb923c,#f97316);color:#fff;font-weight:700;cursor:pointer;box-shadow:0 12px 24px #f9731638}.primaryBtn:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.modalOverlay{position:fixed;inset:0;background:#0f172a8c;display:grid;place-items:end center;padding:16px}.modalSheet{width:100%;max-width:560px;border-radius:20px;background:#fff;border:1px solid rgba(226,232,240,.9);box-shadow:0 24px 60px #0f172a38;padding:14px}.modalHeader{display:flex;align-items:center;justify-content:space-between;padding:6px 6px 10px}.modalTitle{font-size:14px;font-weight:800}.field{display:flex;flex-direction:column;gap:6px;padding:8px 6px}.label{font-size:12px;font-weight:700;color:#374151}.input{height:44px;border-radius:14px;border:1px solid rgba(226,232,240,.9);padding:0 12px;background:#fff}.helper{font-size:12px;color:#6b7280}.modalActions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px 6px 6px}.ghostBtn{height:48px;border-radius:16px;border:1px solid rgba(226,232,240,.9);background:#fff;font-weight:700;cursor:pointer}@media(min-width:768px){.app{padding:24px 20px 32px}.uploader{min-height:280px}.uploadBtn{width:110px;height:110px;font-size:50px}.modalOverlay{place-items:center}}.loadingOverlay{position:fixed;inset:0;background:#0f172abf;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:grid;place-items:center;z-index:1000}.loadingContent{display:flex;flex-direction:column;align-items:center;gap:24px}.loadingSpinner{width:56px;height:56px;border:4px solid rgba(255,255,255,.2);border-top-color:#fb923c;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loadingMessage{color:#fff;font-size:18px;font-weight:600;text-align:center;animation:fadeInOut 2.5s ease-in-out infinite}
