: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:#fff;--card-border:1px solid #0000000d;--text-primary:#1a1a1f;--text-muted:#8a8a8a;--text-tag:#666670;--tag-bg:#f2f0ed;--divider:#ededf0;--share-stack-h-per-w:1.52;--share-stack-vpad:48px}.wrap{--share-column-w:min(92vw, 500px, max(280px, calc((100dvh - var(--share-stack-vpad)) / var(--share-stack-h-per-w))), max(280px, calc((100vh - var(--share-stack-vpad)) / var(--share-stack-h-per-w))));--u:calc(var(--share-column-w) / 500);width:var(--share-column-w);align-items:stretch;gap:calc(30 * var(--u));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:calc(20 * var(--u));flex-direction:column;justify-content:center;align-items:center;gap:16px;width:100%;padding:28px 20px;display:flex;box-shadow:0 4px 24px -2px #00000014}.loading-spinner{border:4px solid #0000001f;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-radius:calc(20 * var(--u));border:none;width:100%;overflow:hidden;box-shadow:0 0 0 1px #0000000d,0 2.857px 17.143px -2px #00000014}.image-section{box-sizing:border-box;background:#0a0a0a;width:100%;margin:0;position:relative}.image-area{aspect-ratio:1;box-sizing:border-box;background:#0a0a0a;border-radius:0;width:100%;position:relative;overflow:hidden}.image-area img{object-fit:cover;object-position:center;transform-origin:50%;width:100%;height:100%;display:block;transform:scale(1.01)}.image-gradient{pointer-events:none;height:calc(128.571 * var(--u));background:linear-gradient(#0000,#00000059);position:absolute;bottom:0;left:0;right:0}.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:#fff;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;z-index:1;background:#00000073;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-section{gap:calc(11.43 * var(--u));padding:calc(17.14 * var(--u)) calc(22.86 * var(--u)) calc(14.29 * var(--u));box-sizing:border-box;flex-direction:column;display:flex}.content-row{justify-content:space-between;align-items:stretch;gap:calc(12 * var(--u));width:100%;min-width:0;display:flex}.title-column{justify-content:flex-start;gap:calc(15.71 * var(--u));flex-direction:column;flex:1;min-width:0;display:flex}.title-colors{gap:calc(7.14 * var(--u));flex-direction:column;min-width:0;display:flex}.preset-name{font-size:calc(22.86 * var(--u));color:var(--text-primary);font-weight:600;line-height:calc(30 * var(--u));-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;display:-webkit-box;overflow:hidden}.color-balls{align-items:center;gap:calc(7.14 * var(--u));height:calc(14.286 * var(--u));display:flex}.color-ball{width:calc(14.286 * var(--u));height:calc(14.286 * var(--u));min-width:calc(14.286 * var(--u));min-height:calc(14.286 * var(--u));box-sizing:border-box;border:1px solid #ffffffe6;border-radius:50%;flex-shrink:0;display:block;box-shadow:0 0 0 .5px #0000000f}.tags{gap:calc(7.14 * var(--u));flex-wrap:wrap;min-width:0;display:flex}.tag-pill{background:var(--tag-bg);color:var(--text-tag);font-size:calc(12.86 * var(--u));padding:calc(3.96 * var(--u)) calc(9.89 * var(--u));border-radius:calc(16.615 * var(--u));white-space:nowrap;box-sizing:border-box;justify-content:center;align-items:center;font-weight:400;line-height:1.2;display:inline-flex}.preset-shortcode{font-size:calc(14 * var(--u));color:var(--text-muted);word-break:break-all;margin:0;font-weight:400;line-height:1.2}.qr-area{align-items:center;gap:calc(6.43 * var(--u));width:calc(71.43 * var(--u));flex-direction:column;flex-shrink:0;display:flex}.qr-label{font-size:calc(11.43 * var(--u));color:#8c9199;white-space:nowrap;text-align:center;font-weight:400;line-height:1.2}.qr-box{width:calc(71.43 * var(--u));height:calc(71.43 * var(--u));background:#fff;border-radius:2px;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-divider{background:var(--divider);flex-shrink:0;width:100%;height:1px}.card-footer{justify-content:flex-end;align-items:center;gap:calc(4.286 * var(--u));width:100%;min-width:0;display:flex}.card-footer-logo{width:calc(20 * var(--u));height:calc(20 * var(--u));object-fit:cover;border-radius:999px;flex-shrink:0;display:block}.card-footer-brand,.card-footer-author{font-size:calc(12.86 * var(--u));color:var(--text-muted);white-space:nowrap;font-weight:400;line-height:1.2}.card-footer-author{text-overflow:ellipsis;max-width:55%;overflow:hidden}.action-button-container{width:100%}.action-button{width:100%;height:calc(63.74 * var(--u));background:var(--accent);color:#ececec;min-height:48px;font-size:calc(22 * var(--u));border-radius:calc(5.666 * var(--u));appearance:none;cursor:pointer;border:none;outline:none;justify-content:center;align-items:center;font-weight:400;transition:transform .18s,box-shadow .18s,opacity .18s;display:flex}.action-button:hover{transform:translateY(-1px);box-shadow:0 10px 28px #2b91eb73}.action-button:active{opacity:.92;transform:translateY(0)}
