/* Public application refinement. Existing routes, catalog and actions retained. */
.prototype-app{background:#fafafb;--primary-color:#ed142c;--vip-color:#ed142c}
.prototype-app>header{position:sticky;top:0;z-index:100;background:#ffffffed;backdrop-filter:blur(18px);border-bottom:1px solid #ededf2;box-shadow:0 6px 25px #18182805;min-height:72px}
.prototype-app .menu-btn{width:42px;height:42px;border:1px solid #eeeef3;border-radius:13px;background:#fff;display:grid;align-content:center;justify-content:center;gap:4px;transition:background .2s,transform .2s}
.prototype-app .menu-btn .bar{margin:0;width:18px;height:2px;border-radius:3px}
.prototype-app .desktop-nav{gap:6px;background:#f4f4f7;border:1px solid #ededf2;padding:5px;border-radius:16px}
.prototype-app .desktop-nav a{padding:9px 14px;border-radius:11px;font-size:12px;font-weight:650;transition:background .2s,color .2s}
.prototype-app .desktop-nav a.active{background:#fff;color:#e4162d;box-shadow:0 3px 10px #18182809}
.prototype-app .vip-badge-header{display:inline-flex;align-items:center;gap:6px;padding:8px 11px;background:linear-gradient(130deg,#fff9e9,#fff0c5);border:1px solid #eed5a0;border-radius:12px;color:#875607;box-shadow:inset 0 1px #fff,0 3px 10px #91680d0b;font-size:11px;font-weight:800;letter-spacing:.03em}
.vip-badge-header .ui-icon{width:16px;height:16px}
.prototype-app .search-input{background:#fff!important;border:1px solid #e6e6ed!important;box-shadow:0 4px 18px #20203004;min-height:50px}
.prototype-app .filter-tabs{gap:8px;padding:3px 0}
.prototype-app .tab{border-radius:12px;padding:10px 15px;background:#fff;box-shadow:0 2px 5px #18182803;font-weight:600}
.prototype-app .tab.active{background:linear-gradient(145deg,#ff3348,#d90822);box-shadow:0 5px 13px #e3183026;color:#fff}
.prototype-app .prototype-home-banner{position:relative;isolation:isolate;min-height:340px;padding:38px;border-radius:28px;background:radial-gradient(ellipse at 80% 30%,#ff5461 0%,#ef1833 40%,#c90521 100%);box-shadow:0 14px 30px #c9052120;overflow:hidden}
.prototype-home-banner:before{content:'';position:absolute;inset:-50% -15% -60% 40%;border:1px solid #ffffff24;border-radius:50%;z-index:-1;box-shadow:0 0 0 35px #ffffff06,0 0 0 95px #ffffff06}
.prototype-app .prototype-home-banner>div{position:relative;z-index:2;width:51%;pointer-events:none}
.prototype-app .prototype-home-banner h1{font-size:clamp(28px,4.3vw,48px);font-weight:850;letter-spacing:-1.8px;line-height:1.04;text-shadow:0 2px 9px #78001215}
.prototype-app .prototype-home-banner p{font-size:14px;color:#fff4f5;margin:15px 0 22px}
.prototype-app .prototype-home-banner a{pointer-events:auto;min-height:44px;align-items:center;padding:12px 20px;border-radius:13px;color:#bd0923;box-shadow:0 6px 18px #72031620}
.prototype-app .prototype-home-banner img{position:absolute;right:-2%;bottom:-5%;width:56%;height:105%;max-width:none;object-fit:contain;border-radius:0;filter:drop-shadow(0 15px 14px #7b051c38);z-index:1}
.prototype-app .prototype-section-heading{margin:28px 0 14px;align-items:center}
.prototype-app .prototype-section-heading h2{font-size:18px;font-weight:800;letter-spacing:-.5px}
.prototype-app .prototype-section-heading>a{font-weight:650;color:#cc1530;background:#fff0f2;padding:8px 12px;border-radius:10px;font-size:11px}
.prototype-app .popular-categories{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:26px;overflow:visible}
.prototype-app .popular-item{padding:17px 10px 14px;background:#fff;border:1px solid #e9e9f0;border-radius:19px;box-shadow:0 4px 14px #191a2d05;gap:11px;min-width:0;transition:transform .2s,box-shadow .2s,border-color .2s}
.prototype-app .popular-icon{width:49px;height:49px;min-width:49px;margin:auto;border:1px solid #ffe1e6;border-radius:15px;background:linear-gradient(145deg,#fff8f9,#ffedf0);color:#df1933;box-shadow:inset 0 1px #fff;display:grid;place-items:center}
.popular-icon .ui-icon{width:25px;height:25px;stroke-width:1.6}
.prototype-app .popular-name{color:#353441;font-size:12px;font-weight:650;line-height:1.35}
.prototype-app .search-category-grid a,.prototype-app .popular-card{background:#fff;border:1px solid #e9e9f0;border-radius:19px;box-shadow:0 5px 15px #17182b06;color:#31323e}
.search-category-grid .ui-icon,.popular-card-icon .ui-icon{color:#d81731;width:28px;height:28px}
.prototype-app .search-category-list a{background:#fff;border:1px solid #ebebf1;border-radius:12px;margin-bottom:7px;padding:15px}
.prototype-app .sticker-grid{gap:16px}
.prototype-app .sticker-card{border:1px solid #dddde6;border-radius:21px;box-shadow:0 7px 20px #16172b0b;transition:box-shadow .22s,transform .22s;border-bottom:2px solid #e4e4ed}
.prototype-app .sticker-card>img{padding:13px;background-color:#6f707a;background-image:conic-gradient(#7f8089 25%,#73747e 0 50%,#7f8089 0 75%,#73747e 0);background-size:20px 20px}
.prototype-app .sticker-card .sticker-actions{padding:10px;gap:7px;background:linear-gradient(#fff,#fcfcfe)}
.prototype-app .sticker-actions .sticker-copy{border-radius:11px;background:linear-gradient(155deg,#ff344b,#d90a28);border:1px solid #e41a35;box-shadow:0 4px 9px #d70d2828,inset 0 1px #ff708066;font-weight:750;font-size:12px;min-height:43px;transition:transform .18s,box-shadow .18s}
.prototype-app .sticker-actions .sticker-animate{border-radius:11px;border-color:#e1dfe8;background:linear-gradient(#fff,#f5f4f9);color:#32303e;box-shadow:0 3px 7px #19182b08,inset 0 1px #fff;font-size:10px;font-weight:650;min-height:40px}
.prototype-app .sticker-actions button:not(.sticker-copy){color:#767382;background:none;border:0;font-size:10px}
.prototype-app .premium-badge,.prototype-app .animated-badge{backdrop-filter:blur(10px);border:1px solid #ffffff80;border-radius:8px;box-shadow:0 3px 10px #10101d1c;padding:4px 7px;font-size:10px;line-height:1.2;font-weight:800}
.prototype-app .premium-badge{background:linear-gradient(130deg,#fff7d7,#ffe3a0);color:#794d00}
.prototype-app .animated-badge{background:#23222edf;color:#fff;letter-spacing:.05em}
.prototype-app .fav-btn{border-radius:11px;border:1px solid #ffffffaa;background:#fffffff0;box-shadow:0 4px 12px #11111c18}
.prototype-app .sidebar{left:0;padding:0;width:min(340px,calc(100vw - 28px));transform:translateX(-105%);background:linear-gradient(160deg,#fff 55%,#fff6f7);border-right:1px solid #e7e6ed;box-shadow:22px 0 70px #13132420;transition:transform .32s cubic-bezier(.22,1,.36,1),visibility .32s;overscroll-behavior:contain}
.prototype-app.menu-open .sidebar{transform:translateX(0);visibility:visible;transition-delay:0s}
.prototype-app:not(.menu-open) .sidebar{transition:transform .32s cubic-bezier(.22,1,.36,1),visibility 0s .32s}
.prototype-app.menu-open{overflow:hidden}
.prototype-app .sidebar-overlay{background:#16142060;backdrop-filter:blur(5px);transition:opacity .28s,visibility .28s}
.prototype-app .sidebar-header{padding:25px 20px 18px;border-bottom:1px solid #f0e9ed}
.sidebar-brand{display:grid;grid-template-columns:24px 1fr;align-items:center;gap:4px 9px;font-size:17px;font-weight:750;letter-spacing:-.5px}
.sidebar-brand>.ui-icon{color:#ef1e3a;grid-row:1/3}
.sidebar-brand>span{grid-column:2;font-size:9px;letter-spacing:2px;color:#918594;font-weight:600}
.prototype-app .close-btn{display:grid;place-items:center;width:33px;height:33px;background:#f6f3f6;border:1px solid #e9e3e9;border-radius:11px;font-size:24px;line-height:1}
.prototype-app #sidebarCatSearch{border-radius:12px!important;background:#fff!important;box-shadow:0 3px 8px #19182704}
.prototype-app .sidebar-list{padding:3px 12px 24px}
.prototype-app .sidebar-list>li>a,.prototype-app .cat-link{display:flex;align-items:center;gap:11px;padding:12px;border-radius:12px;font-size:13px;font-weight:550;margin:3px 0;transition:background .18s,transform .18s,color .18s}
.prototype-app .sidebar .ui-icon{width:19px;height:19px;color:#8b8293}
.prototype-app .sidebar a.active{background:#ffe9ee;color:#ca102c;box-shadow:inset 3px 0 #eb1b38}
.prototype-app .sidebar a.active .ui-icon{color:#ca102c}
.prototype-app .cat-toggle{margin-left:auto;font-size:9px}
.prototype-app .cat-link{justify-content:flex-start}
.prototype-app .sidebar-divider{background:#eeeaef;margin:14px 10px}
.prototype-app .subcat-link{color:#777180!important;justify-content:flex-start;gap:8px}
.prototype-app .subcat-link.active,.prototype-app .subcat-link:hover{color:#bd102b!important;background:#fff0f3}
@media(hover:hover){.prototype-app .popular-item:hover,.prototype-app .sticker-card:hover{transform:translateY(-4px);box-shadow:0 12px 27px #23192c12;border-color:#f5b9c3}.prototype-app .sidebar a:hover,.prototype-app .cat-link:hover{background:#fff0f3;color:#d01530;transform:translateX(3px)}.prototype-app .sticker-copy:hover{box-shadow:0 6px 13px #d70d283f;transform:translateY(-1px)}.prototype-app .menu-btn:hover{background:#fff0f2;transform:translateY(-1px)}}
.prototype-app .sticker-actions button:active,.prototype-app .sticker-animate:active{transform:scale(.97)}
@keyframes create-breathe{0%,100%{box-shadow:0 5px 14px #dc15363d,0 0 0 0 #ef23462a}55%{box-shadow:0 7px 20px #dc153647,0 0 0 7px #ef234600}}
@media(max-width:768px){
 .prototype-app>header{min-height:65px;padding:10px 14px}.prototype-app .menu-btn{width:35px;height:35px}.prototype-app .brand-wordmark{font-size:18px}
 .prototype-app:not(.access-page){padding-bottom:100px}
 .prototype-app .prototype-home-banner{padding:23px 18px;min-height:245px;border-radius:24px;margin-top:17px}
 .prototype-app .prototype-home-banner>div{width:51%}.prototype-app .prototype-home-banner h1{font-size:28px;letter-spacing:-1px}.prototype-app .prototype-home-banner p{font-size:11px;max-width:135px;margin:12px 0 17px;line-height:1.5}
 .prototype-app .prototype-home-banner img{width:67%;height:113%;right:-13%;bottom:-7%}.prototype-app .prototype-home-banner a{padding:10px 13px;font-size:11px;min-height:40px}
 .prototype-app .popular-categories{display:flex;overflow-x:auto;gap:10px;padding:3px 2px 13px;scroll-snap-type:x proximity;scrollbar-width:none}.prototype-app .popular-item{flex:0 0 98px;scroll-snap-align:start;padding:13px 8px}.prototype-app .popular-name{font-size:11px}
 .prototype-app .bottom-nav{left:12px;right:12px;bottom:calc(10px + env(safe-area-inset-bottom,0px));width:auto;border:1px solid #ffffffd9;background:#ffffffed;backdrop-filter:blur(20px);border-radius:22px;box-shadow:0 8px 35px #201b3225;min-height:70px;padding:7px 3px 5px}
 .prototype-app .bottom-nav .nav-item{gap:5px;font-size:9px;min-width:0;padding:3px 0;color:#8a8595}
 .prototype-app .bottom-nav .nav-item.active{color:#d81834}.prototype-app .bottom-nav .nav-icon{width:21px;height:21px;stroke-width:1.7}
 .prototype-app .bottom-nav .nav-item:nth-child(3):not(.favorites-nav) .nav-icon{width:48px;height:48px;margin-top:-21px;padding:13px;border-radius:17px;background:linear-gradient(145deg,#ff3651,#d4082a);border:3px solid #fff;animation:create-breathe 3s ease-in-out infinite;box-shadow:0 5px 14px #dc15363d}
 .prototype-app .bottom-nav .nav-item:nth-child(3):not(.favorites-nav)>span{color:#d81834;font-weight:750}
 .prototype-app .sticker-grid{gap:11px}.prototype-app .sticker-card{border-radius:17px}.prototype-app .sticker-card .sticker-actions{padding:8px;gap:6px}
 body.prototype-app:has(.studio-editor) .studio-editor{bottom:calc(92px + env(safe-area-inset-bottom,0px))}
 .prototype-app .install-banner{bottom:calc(94px + env(safe-area-inset-bottom,0px))}
}
@media(max-width:350px){.prototype-app .prototype-home-banner h1{font-size:24px}.prototype-app .prototype-home-banner{min-height:225px;padding:20px 14px}.prototype-app .brand-wordmark{font-size:16px}.prototype-app .vip-badge-header{padding:7px 8px}}
@media(prefers-reduced-motion:reduce){.prototype-app .bottom-nav .nav-icon{animation:none!important}.prototype-app .sidebar,.prototype-app:not(.menu-open) .sidebar,.prototype-app.menu-open .sidebar,.prototype-app .sidebar-overlay,.prototype-app .popular-item,.prototype-app .sticker-card,.prototype-app .sidebar a{transition:none!important}}

/* VIP access stays protected; the artwork remains visible. */
.prototype-app .sticker-card.locked img{filter:none;opacity:1}
.prototype-app .sticker-card.locked.loading img{opacity:0}
.prototype-app .sticker-card .lock-overlay{position:relative;inset:auto;display:flex;flex-direction:row;align-items:center;justify-content:space-between;background:#fff;padding:10px;gap:8px;border-top:1px solid #e7e5ec;z-index:1;width:100%;box-sizing:border-box}
.prototype-app .lock-icon{display:grid;place-items:center;flex:0 0 32px;width:32px;height:34px;border-radius:10px;color:#9b680b;background:linear-gradient(145deg,#fff8e7,#f9e4ad)}
.prototype-app .lock-icon svg{width:19px;height:19px}
.prototype-app .lock-cta{flex:1;min-width:0;padding:10px 5px;min-height:36px;font-size:12px;border-radius:10px;background:linear-gradient(135deg,#ff3048,#e41131);box-shadow:0 4px 9px #d8173226}
@media(max-width:768px){
 .prototype-app .bottom-nav .nav-create{position:relative;overflow:visible}
 .prototype-app .bottom-nav .nav-create .create-orb{position:relative;display:grid;place-items:center;width:60px;height:60px;margin-top:-31px;border:4px solid white;border-radius:21px;background:linear-gradient(145deg,#ff5264 0%,#f51b39 45%,#b80021 100%);color:#fff;box-shadow:inset 0 2px 2px #ffffff70,0 8px 17px #d00a3445;animation:create-breathe 3s ease-in-out infinite;transform:rotate(-6deg)}
 .prototype-app .create-orb>svg{width:28px;height:28px;transform:rotate(6deg)}
 .prototype-app .create-orb .create-plus{position:absolute;right:-5px;top:-5px;display:grid;place-items:center;width:21px;height:21px;background:#fff3cf;color:#9b6208;border:2px solid white;border-radius:8px;font-size:17px;line-height:1;box-shadow:0 2px 4px #59121825}
 .prototype-app .bottom-nav .nav-create>span:last-child{font-size:10px;font-weight:800;color:#c41431}
 .prototype-app .nav-create:active .create-orb{transform:rotate(0) scale(.94)}
}
@media(prefers-reduced-motion:reduce){.prototype-app .create-orb{animation:none!important}}

.prototype-app .bottom-nav .create-orb>svg{color:#fff;stroke:#fff;fill:none}
/* VIP invitation: shared by all subscription entry points. */
.prototype-app .vip-modal{padding:18px}
.prototype-app .vip-modal-backdrop{background:#15121fcc;backdrop-filter:blur(9px)}
.prototype-app .vip-modal-card{width:min(460px,100%);padding:28px;border-radius:28px;border:1px solid #fff;background:radial-gradient(ellipse at 50% 0,#fff0d9 0,transparent 48%),#fff;box-shadow:0 30px 100px #09071666;max-height:calc(100dvh - 36px);overflow:auto;overscroll-behavior:contain}
.prototype-app .vip-modal-close{top:13px;right:13px;width:34px;height:34px;display:grid;place-items:center;border:1px solid #e9e3dc;border-radius:50%;background:#ffffffc9;color:#73717b;font-size:24px;line-height:1}
.prototype-app .vip-modal-badge{display:inline-flex;align-items:center;gap:7px;margin:0 0 14px;padding:7px 12px;border:1px solid #e7cd92;background:linear-gradient(130deg,#fff9e7,#f7e1aa);color:#805414;font-size:10px;letter-spacing:1.4px;box-shadow:0 3px 10px #ba8a2910}
.prototype-app .vip-modal-badge svg{width:16px;height:16px}
.prototype-app .vip-modal-card h2{max-width:300px;margin:0 auto;font-size:27px;line-height:1.12;letter-spacing:-.9px;font-weight:800;color:#201c28}
.prototype-app .vip-modal-card .vip-mascot{width:150px;height:150px;margin:10px auto 0;mix-blend-mode:normal;filter:none}
.prototype-app .vip-modal-price{display:inline-block;padding:7px 12px;margin:4px 0 18px;border:1px solid #eee7dc;border-radius:9px;background:#ffffffb8;font-size:11px;font-weight:550;color:#807363}
.prototype-app .vip-modal-benefits{display:grid;gap:8px;margin:0 0 16px}
.prototype-app .vip-modal-benefits li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid #efedf2;border-radius:13px;background:#faf9fc}
.prototype-app .vip-modal-benefits li:last-child{border:1px solid #efedf2}
.vip-benefit-icon{display:grid;place-items:center;width:35px;height:35px;flex:0 0 35px;border-radius:11px;background:#fff0f2;color:#e51d3b}
.vip-benefit-icon svg{width:20px;height:20px}
.prototype-app .vip-modal-benefits strong{display:block;font-size:13px;font-weight:700;color:#34303d;line-height:1.4}
.prototype-app .vip-modal-benefits small{display:block;font-size:11px;color:#7e7989;line-height:1.5}
.prototype-app .vip-modal-cta{display:flex;align-items:center;justify-content:center;gap:10px;min-height:49px;border-radius:14px;background:linear-gradient(135deg,#ff354f,#e50c31);box-shadow:0 7px 17px #e31a3533;border:1px solid #fa2846;color:#fff;font-size:14px}
.prototype-app .vip-modal-cta>span{margin-left:auto}.prototype-app .vip-modal-cta>svg{margin-right:auto;width:20px;height:20px}
.prototype-app .vip-modal-secondary{background:transparent;border:0;box-shadow:none;color:#7a7484;font-size:12px;font-weight:550;min-height:40px;margin-top:7px}
.prototype-app .vip-modal a:focus-visible,.prototype-app .vip-modal button:focus-visible{outline:3px solid #c3923d;outline-offset:3px}
@media(hover:hover){.prototype-app .vip-modal-cta:hover{background:linear-gradient(135deg,#ef2441,#c9072a);box-shadow:0 9px 22px #e31a3545}.prototype-app .vip-modal-secondary:hover{background:#f6f4f8;color:#24212c}}
@media(max-width:480px){.prototype-app .vip-modal{padding:12px}.prototype-app .vip-modal-card{padding:24px 18px 14px;border-radius:24px;max-height:calc(100dvh - 24px)}.prototype-app .vip-modal-card h2{font-size:25px;max-width:270px}.prototype-app .vip-modal-card .vip-mascot{width:125px;height:125px}.prototype-app .vip-modal-benefits li{padding:8px 10px}.prototype-app .vip-modal-price{margin-bottom:12px}}
