:where(:not(html,iframe,canvas,img,svg,video):not(svg *,symbol *)){all:unset;display:revert}*,:before,:after{box-sizing:border-box}html,body{width:100%;height:100%}body{min-height:100vh;padding:max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));background:#000;justify-content:center;align-items:center;font-family:-apple-system,BlinkMacSystemFont,SF Pro Display,SF Pro Text,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;display:flex}#root{width:100%;display:block}:root{--accent:#2b91eb;--card-bg:#ececec;--text-primary:#0a0a0a;--text-muted:#8a8a8a;--share-stack-h-per-w:1.45;--share-stack-vpad:96px}.wrap{--share-column-w:min(92vw, 700px, max(260px, calc((100dvh - var(--share-stack-vpad)) / var(--share-stack-h-per-w))), max(260px, calc((100vh - var(--share-stack-vpad)) / var(--share-stack-h-per-w))));width:var(--share-column-w);align-items:center;gap:calc(var(--share-column-w) * (40 / 700));box-sizing:border-box;flex-direction:column;min-height:0;max-height:min(100dvh,100vh);margin:0 auto;display:flex;overflow:hidden auto}.state-card{background:var(--card-bg);border:var(--card-border);border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;padding:28px 20px;display:flex}.loading-spinner{border:4px solid #0a0a0a1f;border-top-color:var(--accent);border-radius:50%;width:44px;height:44px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.state-text{color:#666;font-size:16px;font-weight:600}.error-title{color:#ea5555;font-size:20px;font-weight:800}.error-message{color:#666;text-align:center;font-size:14px}.preset-card{background:var(--card-bg);border:var(--card-border);width:100%;overflow:hidden;box-shadow:0 8px 32px #0a0a0a59}.image-section{box-sizing:border-box;width:calc(100% - 24px);margin:12px 12px 0;position:relative}.image-area{aspect-ratio:1;box-sizing:border-box;width:100%;position:relative;overflow:hidden}.image-area img{object-fit:cover;object-position:center;width:100%;height:100%;display:block}.image-placeholder{color:#999;background:linear-gradient(135deg,#f5f5f5 0%,#e0e0e0 100%);justify-content:center;align-items:center;width:100%;height:100%;font-size:14px;display:flex}.image-compare-btn{color:#ececec;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:#0a0a0a73;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;display:flex;position:absolute;bottom:12px;right:12px}.image-compare-btn:active{opacity:.9}.info-area{justify-content:space-between;align-items:flex-start;gap:18px;margin-top:0;padding:16px 16px 0;display:flex}.info-left{flex:1;min-width:0;padding-top:0}.preset-name{font-size:clamp(17px, calc(var(--share-column-w) * (22 / 700)), 22px);color:var(--text-primary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:8px;font-weight:500;line-height:1.25;display:-webkit-box;overflow:hidden}.preset-shortcode{font-size:clamp(14px, calc(var(--share-column-w) * (17 / 700)), 17px);color:var(--text-muted);word-break:break-all;margin:0;font-weight:400;line-height:1.2}.qr-area{width:clamp(70px, calc(var(--share-column-w) * (130 / 700)), 130px);flex-shrink:0;justify-content:right;align-items:center;display:flex}.qr-box{width:clamp(70px, calc(var(--share-column-w) * (130 / 700)), 130px);height:clamp(70px, calc(var(--share-column-w) * (130 / 700)), 130px);background:#eaeaea;border-radius:4px;justify-content:center;align-items:center;display:flex;overflow:hidden}.qr-box img{object-fit:contain;width:100%;height:100%;display:block}.qr-fallback{color:#999;text-align:center;padding:8px;font-size:12px}.card-footer{justify-content:flex-end;align-items:center;gap:8px;padding:14px 16px 16px;display:flex}.card-footer-logo{object-fit:contain;border-radius:4px;flex-shrink:0;width:16px;height:16px;display:block}.card-footer-text{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:13px;font-weight:400;line-height:1.2;overflow:hidden}.action-button-container{width:100%}.action-button{width:100%;min-height:max(52px, calc(var(--share-column-w) * (72 / 700)));background:var(--accent);color:#ececec;font-size:clamp(16px, calc(var(--share-column-w) * (20 / 700)), 20px);appearance:none;cursor:pointer;border:none;border-radius:4px;outline:none;justify-content:center;align-items:center;font-weight:500;transition:transform .18s,box-shadow .18s,opacity .18s;display:flex}.action-button:hover{transform:translateY(-1px);box-shadow:0 10px 28px #2f84f673}.action-button:active{opacity:.92;transform:translateY(0)}