.app-shell{display:flex;flex-direction:column;gap:1.1rem;animation:fade-rise .42s ease-out}.hero{background:linear-gradient(135deg,#fff8e6,#f0f7ff 70%);border:1px solid #d8e3ef;border-radius:18px;box-shadow:0 20px 45px -28px #182f4473;padding:1.5rem}.kicker{margin:0;color:#2f5f7a;font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.hero h1{margin:.45rem 0 0;color:#173147;font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.2}.hero-copy{margin:.65rem 0 0;color:#39556e;max-width:68ch}.panel{background:#ffffffdb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid #d9e2eb;border-radius:18px;box-shadow:0 18px 35px -30px #0e1f3080;padding:1rem}.panel h2{margin:0;font-size:1.1rem;color:#173147}.config-panel{animation:fade-rise .46s ease-out}.controls-grid{margin-top:.95rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:.75rem}.controls-grid label{display:flex;flex-direction:column;gap:.35rem;color:#34536b;font-size:.86rem;font-weight:600}.controls-grid input,.controls-grid select{border:1px solid #c3d2e0;border-radius:10px;padding:.62rem .68rem;font-size:.95rem;color:#173147;background:#fbfdff}.controls-grid input:focus,.controls-grid select:focus{outline:2px solid #8ab5d8;outline-offset:1px}.controls-grid input[type=range]{padding:0}.range-value{color:#1d4f5f;font-size:.82rem}.button-row{margin-top:.95rem;display:flex;flex-wrap:wrap;gap:.55rem}button{appearance:none;border:0;border-radius:10px;background:linear-gradient(135deg,#0e5c72,#1d8b9e);color:#f5fbff;cursor:pointer;font-size:.9rem;font-weight:700;letter-spacing:.01em;padding:.64rem .92rem;transition:transform .14s ease,opacity .14s ease,filter .14s ease}button:hover:not(:disabled){transform:translateY(-1px);filter:saturate(1.05)}button:disabled{opacity:.48;cursor:not-allowed}.button-secondary{background:#f2f5f8;color:#254761;border:1px solid #d0d9e2}.hint-text,.drop-subcopy,.result-head p,.compressed-meta p,.empty-state p{margin:0;color:#4a6a84}.hint-text{margin-top:.7rem;font-size:.84rem}.warning-text{margin:.7rem 0 0;color:#a14e14;font-weight:600;font-size:.88rem}.small-text{font-size:.78rem}.error-text{color:#b13939;font-weight:700}.success-text{color:#1e6b36;font-weight:600}.drop-panel{display:grid;place-items:center;min-height:120px;border-style:dashed;text-align:center}.drop-panel>p:first-child{color:#173147;font-size:1rem;font-weight:700;margin:0}.drop-panel.is-dragging{border-color:#2f8fa1;background:linear-gradient(135deg,#eef8ff,#e8fff8)}.summary-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:.7rem}.summary-card{background:#fffffff0;border:1px solid #d7e0e9;border-radius:14px;padding:.8rem .9rem}.summary-card h3{margin:0;color:#35566f;font-size:.83rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase}.summary-card p{margin:.35rem 0 0;color:#163249;font-size:1.15rem;font-weight:700}.results-section{background:#ffffffe0;border:1px solid #d9e2eb;border-radius:18px;box-shadow:0 18px 35px -30px #0e1f3073;padding:1rem}.results-section h2{margin:0;color:#173147;font-size:1.05rem}.empty-state{margin-top:.85rem;border:1px dashed #c5d4e1;border-radius:14px;padding:1.2rem}.result-list{display:flex;flex-direction:column;gap:.9rem;margin-top:.9rem}.result-card{border:1px solid #d8e2ec;border-radius:14px;background:#fcfdff;padding:.85rem;animation:fade-rise .32s ease-out}.result-head{align-items:center;display:flex;gap:.5rem;justify-content:space-between}.result-head h3{color:#1f3c53;font-size:.96rem;margin:0;max-width:44ch;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-actions{display:flex;flex-wrap:wrap;gap:.4rem}.compare-grid{display:grid;gap:.65rem;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:.75rem}.image-panel{border:1px solid #dde6ef;border-radius:12px;padding:.7rem}.image-panel h4{margin:0;color:#28506b;font-size:.84rem;letter-spacing:.03em;text-transform:uppercase}.preview-frame{align-items:center;background:linear-gradient(180deg,#f4f8fb,#f8fbfd);border:1px solid #dae4ee;border-radius:9px;display:flex;justify-content:center;margin-top:.55rem;min-height:175px;overflow:hidden}.preview-frame img{display:block;max-height:300px;max-width:100%;object-fit:contain}.preview-placeholder{color:#5c7287;font-size:.88rem;text-align:center}.exif-meta{border-top:1px solid #e0e8f0;margin-top:.6rem;padding-top:.55rem;display:flex;flex-direction:column;gap:.18rem}.exif-meta h5{margin:0;color:#2e536d;font-size:.77rem;letter-spacing:.03em;text-transform:uppercase}.exif-meta p{margin:0;color:#4a6a84;font-size:.8rem}.exif-label{color:#2a506a;font-weight:700}.compressed-meta{display:flex;flex-direction:column;gap:.25rem;margin-top:.65rem}.download-link{color:#12637a;font-size:.86rem;font-weight:700;margin-top:.24rem;text-decoration:none}.download-link:hover{text-decoration:underline}.visually-hidden{border:0;clip:rect(0 0 0 0);clip-path:inset(50%);height:1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}@keyframes fade-rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media(max-width:850px){.compare-grid{grid-template-columns:1fr}.result-head{align-items:flex-start;flex-direction:column}}:root{font-family:Space Grotesk,Avenir Next,Trebuchet MS,sans-serif;font-synthesis:none;line-height:1.45;text-rendering:optimizeLegibility;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}*{box-sizing:border-box}body{margin:0;min-height:100vh;min-width:320px;color:#132b3e;background:radial-gradient(circle at 5% 0%,#fff7d8 0%,transparent 32%),radial-gradient(circle at 90% 15%,#dceefe 0%,transparent 28%),linear-gradient(180deg,#f4f8fb,#ecf2f8 55%,#eef6f3)}#root{margin:0 auto;max-width:1240px;padding:clamp(.8rem,1.8vw,1.5rem)}