.favicon-shell,.favicon-content{max-width:980px}.drop-zone{border:2px dashed #93a1b2;border-radius:1rem;background:#f8fafc;transition:.15s}.drop-zone.is-dragging{border-color:#0d6efd;background:#eaf3ff}.crop-area{width:min(100%,520px);aspect-ratio:1;border-radius:1rem;overflow:hidden;background-image:linear-gradient(45deg,#ddd 25%,transparent 25%),linear-gradient(-45deg,#ddd 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#ddd 75%),linear-gradient(-45deg,transparent 75%,#ddd 75%);background-size:20px 20px;background-position:0 0,0 10px,10px -10px,-10px 0;touch-action:none;cursor:grab}.crop-area:focus{outline:3px solid rgba(13,110,253,.45);outline-offset:3px}.crop-area canvas{display:block;width:100%;height:100%}.position-grid{display:grid;grid-template-columns:repeat(3,2.75rem);gap:.35rem}.position-grid button{border:1px solid #adb5bd;border-radius:.4rem;background:white;min-height:2.75rem}.position-grid button[data-move=up]{grid-column:2}.position-grid button[data-move=left]{grid-column:1}.position-grid button[data-move=center]{grid-column:2}.position-grid button[data-move=right]{grid-column:3}.position-grid button[data-move=down]{grid-column:2}.browser-tab{max-width:360px;display:flex;align-items:center;gap:.55rem;padding:.7rem 1rem;border:1px solid #d1d5db;border-bottom:0;border-radius:.75rem .75rem 0 0;background:#fff;box-shadow:0 3px 8px #0001}.browser-tab canvas{width:16px;height:16px;image-rendering:auto}.actual-previews{display:flex;gap:1.5rem;align-items:end}.actual-previews span{display:flex;align-items:center;gap:.5rem;font-size:.85rem}.phone-preview{min-height:250px;border-radius:1.4rem;padding:2.3rem 1rem 1rem;display:flex;flex-direction:column;align-items:center;gap:.65rem;color:white;text-align:center;background:linear-gradient(145deg,#314d7a,#11223f);box-shadow:inset 0 0 0 5px #17202b}.phone-preview canvas{width:78px;height:78px}.phone-preview.iphone canvas{border-radius:18px}.phone-preview.android{background:linear-gradient(145deg,#546e7a,#263238)}.phone-preview .mask-safe{width:86px;height:86px;border:1px dashed #ffffff99;border-radius:50%;display:grid;place-items:center}.phone-preview .mask-safe canvas{border-radius:50%}.code-preview{max-height:240px;overflow:auto;padding:1rem;border-radius:.5rem;background:#17212b;color:#f8f9fa;white-space:pre;word-break:normal}.result-card{border-top:4px solid #198754!important}@media(max-width:575.98px){.card-body{padding:1.25rem!important}.phone-preview{max-width:230px;margin:auto}.code-preview{font-size:.8rem}.preview-grid>div{min-width:0}}