:root{color:#0f172a;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:radial-gradient(circle at top,#60a5fa40,#0000 30%),radial-gradient(circle at 0 100%,#f472b633,#0000 24%),#f8fafc;font-family:Plus Jakarta Sans,Noto Sans KR,sans-serif;font-weight:400;line-height:1.5}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{min-width:320px}button,input{font:inherit}img{max-width:100%}h1,p{margin:0}.app-shell{min-height:100vh;padding:16px}.hero-panel{grid-template-columns:1fr;gap:16px;width:min(100%,1100px);margin:0 auto;display:grid}.hero-copy,.form-card{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#ffffffd1;border:1px solid #0f172a14;border-radius:24px;box-shadow:0 18px 60px #0f172a14}.hero-copy{background:radial-gradient(circle at 0 0,#f472b629,#0000 28%),radial-gradient(circle at 100% 100%,#3b82f629,#0000 32%),#ffffffd1;flex-direction:column;gap:24px;padding:24px;display:flex}.hero-copy-inner{flex-direction:column;gap:14px;display:flex}.eyebrow{letter-spacing:.22em;text-transform:uppercase;color:#2563eb;margin:0;font-size:.72rem;font-weight:700}.hero-copy h1{letter-spacing:-.04em;color:#0f172a;margin:0;font-size:clamp(2rem,7vw,3.4rem);line-height:1.05}.hero-text{color:#475569;margin:0;font-size:.98rem;line-height:1.7}.hero-points{flex-wrap:wrap;gap:8px;display:flex}.hero-points span{color:#334155;background:#ffffffbf;border:1px solid #94a3b82e;border-radius:999px;padding:9px 12px;font-size:.85rem}.form-card{flex-direction:column;gap:16px;padding:18px;display:flex}.upload-card{cursor:pointer;background:linear-gradient(135deg,#eff6ff,#f8fafc 48%,#fff1f2);border:1px dashed #2563eb47;border-radius:22px;min-height:260px;transition:border-color .2s,transform .2s,box-shadow .2s;display:block;position:relative;overflow:hidden}.upload-card.is-drag-active{border-color:#2563eb;transform:translateY(-1px);box-shadow:0 20px 44px #2563eb29}.upload-card input{opacity:0;cursor:pointer;position:absolute;inset:0}.upload-placeholder{text-align:center;color:#0f172a;flex-direction:column;justify-content:center;align-items:center;gap:10px;height:100%;min-height:260px;padding:24px;display:flex}.upload-placeholder strong{font-size:1.05rem}.upload-placeholder p{color:#64748b;max-width:24rem;margin:0;line-height:1.6}.upload-icon{background:#ffffffc2;border-radius:18px;place-items:center;width:54px;height:54px;font-size:1.9rem;display:grid;box-shadow:inset 0 0 0 1px #ffffffd9}.preview-frame{min-height:260px;position:relative}.preview-image{object-fit:cover;width:100%;height:100%;min-height:260px;display:block}.preview-badge{color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0f172aad;border-radius:999px;padding:9px 12px;font-size:.83rem;position:absolute;bottom:14px;left:14px}.upload-meta{color:#64748b;flex-direction:column;align-items:flex-start;gap:4px;padding:0 2px;font-size:.9rem;display:flex}.upload-meta strong{color:#0f172a;word-break:break-all;font-size:.95rem}.input-grid{grid-template-columns:1fr;gap:12px;display:grid}.field{flex-direction:column;gap:9px;display:flex}.field span{color:#334155;font-size:.9rem;font-weight:600}.input-wrap{background:#f8fafcf0;border:1px solid #94a3b847;border-radius:18px;align-items:center;gap:10px;min-height:56px;padding:0 16px;display:flex}.input-wrap input{color:#0f172a;background:0 0;border:0;outline:0;flex:1;width:100%;min-width:0;font-size:1rem}.input-wrap input[type=number]{-moz-appearance:textfield}.input-wrap input[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-wrap input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.input-wrap input::placeholder{color:#94a3b8}.input-wrap em{color:#64748b;flex-shrink:0;font-style:normal}.analyze-button{color:#fff;letter-spacing:-.01em;cursor:pointer;background:linear-gradient(135deg,#0f172a,#1d4ed8);border:0;border-radius:18px;min-height:58px;margin-top:4px;font-size:1rem;font-weight:700;transition:transform .2s,box-shadow .2s,opacity .2s;box-shadow:0 18px 36px #1d4ed83d}.analyze-button:hover{transform:translateY(-1px);box-shadow:0 24px 42px #1d4ed847}.analyze-button:disabled{cursor:not-allowed;opacity:.6;box-shadow:none;transform:none}.result-card{background:#f8fafcf2;border:1px solid #94a3b833;border-radius:20px;padding:18px}.result-header{color:#475569;flex-direction:column;align-items:flex-start;gap:4px;margin-bottom:12px;font-size:.92rem;display:flex}.result-header strong{color:#0f172a}.result-visual{flex-direction:column;gap:14px;display:flex}.analysis-card{background:#fff;border:1px solid #94a3b82e;border-radius:18px;padding:14px}.analysis-card h2{color:#0f172a;margin:0 0 8px;font-size:.98rem}.analysis-text{white-space:pre-wrap;color:#334155;margin:0;line-height:1.75}.result-gallery{grid-template-columns:1fr;gap:12px;display:grid}.result-media-card{background:#fff;border:1px solid #94a3b82e;border-radius:18px;margin:0;padding:12px}.result-media-card figcaption{color:#334155;margin-top:10px;font-size:.88rem;font-weight:600}.result-image{border:1px solid #94a3b833;border-radius:16px;width:100%;display:block}.result-text,.result-placeholder,.result-error{white-space:pre-wrap;margin:0;line-height:1.7}.result-text{color:#0f172a}.result-placeholder{color:#64748b}.result-error{color:#b91c1c}.analyze-button:focus-visible,.upload-card:focus-within,.input-wrap:focus-within{outline-offset:3px;outline:2px solid #2563eb59}@media (width>=720px){.app-shell{padding:24px}.hero-panel{gap:20px}.hero-copy{padding:32px}.form-card{padding:24px}.input-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.upload-meta,.result-header{flex-direction:row;justify-content:space-between;align-items:center}.result-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (width>=1024px){.app-shell{justify-content:center;align-items:center;padding:32px;display:flex}.hero-panel{grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);align-items:stretch;gap:28px}.hero-copy{justify-content:space-between;min-height:720px;padding:44px}.form-card{padding:28px}.upload-card,.upload-placeholder,.preview-frame,.preview-image{min-height:320px}}.result-image-fallback{text-align:center;background:#fef2f2e6;border:1px dashed #ef444447;border-radius:16px;justify-content:center;align-items:center;min-height:240px;padding:18px;display:flex}
