@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap";:root{--blue: #003366;--gold: #C5A059;--bg: #FAFAFA;--surface: #FFFFFF;--slate: #64748B;--border: #F1F5F9;--radius: 12px;--font: "Inter", sans-serif}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;background:var(--bg);font-family:var(--font);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overscroll-behavior:none}#root{min-height:100vh;display:flex;justify-content:center;background:var(--bg)}.app-shell{width:100%;max-width:480px;min-height:100vh;background:var(--surface);display:flex;flex-direction:column;position:relative;box-shadow:0 0 0 1px #0000000a}.app-header{padding:24px 20px 16px;border-bottom:1px solid var(--border)}.app-header--compact{padding:14px 20px 12px}.app-logo{font-size:22px;font-weight:700;color:var(--blue);letter-spacing:-.02em}.app-subtitle{font-size:13px;color:var(--slate);margin-top:3px}.template-selector{flex:1;overflow-y:auto;padding:16px;-webkit-overflow-scrolling:touch}.template-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.template-card{background:var(--surface);border:1.5px solid #E8EDF2;border-radius:var(--radius);padding:10px 10px 8px;cursor:pointer;transition:border-color .15s ease,box-shadow .15s ease;-webkit-tap-highlight-color:transparent}.template-card:hover,.template-card:active{border-color:var(--blue);box-shadow:0 2px 8px #0033661a}.template-card.is-active{border-color:var(--blue)}.template-preview{width:100%;aspect-ratio:9 / 16;border-radius:6px;overflow:hidden;position:relative;background:#f1f5f9;margin-bottom:7px}.template-name{font-size:11px;font-weight:700;color:var(--blue);letter-spacing:-.01em;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.template-count{font-size:10px;font-weight:700;color:var(--slate);text-transform:uppercase;letter-spacing:.05em;margin-top:2px}.preview-slot{position:absolute;background:#cbd5e1}.preview-slot:nth-child(1){background:#b8c8dc}.preview-slot:nth-child(2){background:#94a3b8}.preview-slot:nth-child(3){background:#c4cdd9}.preview-slot:nth-child(4){background:#a8b5c5}.preview-slot:nth-child(5){background:#8898aa}.preview-slot--instax{background:#fff;border:1px solid #E2E8F0;box-shadow:0 2px 6px #0000001f}.canvas-wrapper{width:100%;aspect-ratio:9 / 16;position:relative;background:#f1f5f9;overflow:hidden;flex-shrink:0;display:flex;align-items:center;justify-content:center}@media (max-width: 480px){.app-shell--canvas{height:100vh;height:100dvh;overflow:hidden}.canvas-wrapper{flex:1;min-height:0;aspect-ratio:unset;flex-shrink:1}}.canvas-wrapper canvas{display:block}.toolbar{padding:12px 16px 20px;display:flex;align-items:center;gap:8px;border-top:1px solid var(--border);background:var(--surface)}.toolbar-btn{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;background:transparent;border:1.5px solid var(--border);border-radius:var(--radius);cursor:pointer;color:var(--slate);font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;font-family:var(--font);transition:border-color .15s,color .15s,background .15s;-webkit-tap-highlight-color:transparent}.toolbar-btn:hover,.toolbar-btn:active{border-color:var(--gold);color:var(--gold)}.toolbar-btn svg{width:20px;height:20px;flex-shrink:0}.toolbar-btn--secondary{border-color:var(--slate);color:var(--slate)}.toolbar-btn--secondary:hover,.toolbar-btn--secondary:active{border-color:var(--blue);color:var(--blue)}.toolbar-btn--export{flex:2;background:var(--blue);border-color:var(--blue);color:#fff;font-size:11px}.toolbar-btn--export:hover,.toolbar-btn--export:active{background:#002855;border-color:#002855;color:#fff}.share-wrap{flex:2;position:relative;display:flex;flex-direction:column}.share-wrap .toolbar-btn{flex:unset;width:100%}.share-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:10}.share-menu{position:absolute;bottom:calc(100% + 8px);right:0;left:0;background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius);box-shadow:0 4px 20px #00000024;overflow:hidden;z-index:11}.share-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:13px 16px;background:transparent;border:none;font-family:var(--font);font-size:13px;font-weight:600;color:var(--blue);cursor:pointer;-webkit-tap-highlight-color:transparent;transition:background .12s}.share-menu-item+.share-menu-item{border-top:1px solid var(--border)}.share-menu-item:active{background:var(--bg)}.share-menu-item__text{display:flex;flex-direction:column;text-align:left}.share-menu-item__label{font-size:13px;font-weight:600;line-height:1.2}.share-menu-item__hint{font-size:11px;font-weight:400;opacity:.75;margin-top:2px}.share-menu-item--primary{background:var(--blue);color:#fff}.share-menu-item--primary:active{background:#002855}@supports (padding-bottom: env(safe-area-inset-bottom)){.toolbar{padding-bottom:calc(16px + env(safe-area-inset-bottom))}}