:root{--bg:#fff8f3;--bg-2:#f7f1ff;--card:rgba(255,255,255,.86);--ink:#251821;--muted:#7a6b75;--soft:#fff1f5;--line:rgba(102,64,83,.14);--brand:#ff6f91;--brand-2:#7c5cff;--ok:#13a36d;--warn:#d88400;--danger:#d94a5b;--shadow:0 22px 70px rgba(120,78,115,.16);--radius:28px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI","Microsoft YaHei",Arial,sans-serif;background:radial-gradient(circle at 12% -8%,rgba(255,111,145,.22),transparent 34rem),radial-gradient(circle at 86% 2%,rgba(124,92,255,.18),transparent 30rem),linear-gradient(135deg,var(--bg),var(--bg-2));min-height:100vh}a{color:inherit;text-decoration:none}button,input,select{font:inherit}img{max-width:100%;display:block}.shell{width:min(1180px,calc(100% - 36px));margin:0 auto}.topbar{position:sticky;top:0;z-index:20;border-bottom:1px solid var(--line);background:rgba(255,248,243,.78);backdrop-filter:blur(18px)}.topbar-inner{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:18px}.brand{display:inline-flex;align-items:center;gap:12px;font-weight:950;letter-spacing:-.03em;font-size:21px;white-space:nowrap}.brand-mark{width:42px;height:42px;display:grid;place-items:center;border-radius:16px;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 14px 30px rgba(255,111,145,.26)}.nav{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.nav a{border:1px solid transparent;color:#665865;padding:10px 12px;border-radius:999px;font-weight:800;font-size:14px}.nav a:hover,.nav a.active{background:rgba(255,255,255,.72);border-color:var(--line);color:var(--ink)}.hero{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(330px,.9fr);align-items:center;gap:38px;padding:64px 0 34px}.eyebrow{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.72);color:#8a4c61;font-weight:900;box-shadow:0 12px 34px rgba(255,111,145,.10)}h1{margin:18px 0 16px;max-width:760px;font-size:clamp(42px,7vw,76px);line-height:.96;letter-spacing:-.07em}.gradient-text{background:linear-gradient(135deg,#f24e79,#7c5cff 68%,#2e73ff);-webkit-background-clip:text;background-clip:text;color:transparent}.lead{margin:0;max-width:720px;color:var(--muted);font-size:18px;line-height:1.78}.hero-actions,.row-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:26px}.btn{appearance:none;border:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:0 18px;border-radius:16px;color:#fff;font-weight:950;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 16px 32px rgba(124,92,255,.22);transition:transform .16s ease,box-shadow .16s ease,opacity .16s ease}.btn:hover{transform:translateY(-1px);box-shadow:0 18px 38px rgba(124,92,255,.28)}.btn:disabled{cursor:not-allowed;opacity:.55;transform:none;box-shadow:none}.btn.secondary{color:var(--ink);background:rgba(255,255,255,.86);border:1px solid var(--line);box-shadow:none}.btn.ghost{color:#7b5263;background:transparent;border:1px solid var(--line);box-shadow:none}.hero-card{position:relative;min-height:430px;padding:24px;border:1px solid rgba(255,255,255,.88);border-radius:40px;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(255,244,248,.78)),radial-gradient(circle at 70% 0%,rgba(124,92,255,.17),transparent 18rem);box-shadow:var(--shadow);overflow:hidden}.hero-card:after{content:"";position:absolute;inset:auto -50px -90px auto;width:250px;height:250px;border-radius:999px;background:rgba(255,111,145,.18);filter:blur(2px)}.pet-illustration{position:relative;z-index:1;min-height:260px;display:grid;place-items:center;border-radius:30px;background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.86),transparent 12rem),linear-gradient(145deg,#fff5dd,#ffe8f0);border:1px solid var(--line)}.pet-illustration svg{width:min(280px,74%);filter:drop-shadow(0 24px 18px rgba(109,74,86,.22))}.hero-stats{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.stat{padding:14px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.74)}.stat strong{display:block;font-size:22px;letter-spacing:-.04em}.stat span{display:block;margin-top:4px;color:var(--muted);font-size:12px;font-weight:800}.page-hero{padding:46px 0 20px}.page-hero h1{font-size:clamp(36px,5vw,58px)}.section{padding:34px 0}.section-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:18px}.section h2{margin:0;font-size:clamp(26px,4vw,38px);letter-spacing:-.045em}.section-desc{margin:8px 0 0;color:var(--muted);line-height:1.7}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.card{border:1px solid var(--line);border-radius:var(--radius);background:var(--card);box-shadow:0 18px 60px rgba(120,78,115,.10)}.feature-card,.plan-card{padding:24px}.icon{width:46px;height:46px;display:grid;place-items:center;border-radius:18px;background:var(--soft);color:#c33e65;font-size:22px;margin-bottom:16px}.card h3{margin:0 0 8px;letter-spacing:-.025em}.muted{color:var(--muted)}.small{font-size:13px}.plans{margin-top:16px}.price{margin:10px 0;display:inline-flex;align-items:baseline;gap:4px;color:#c43d68;font-weight:950;font-size:24px}.badge{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:rgba(19,163,109,.10);color:#08724c;font-weight:900;font-size:12px}.studio-layout{display:grid;grid-template-columns:minmax(300px,390px) minmax(0,1fr);gap:18px;align-items:start}.panel{padding:22px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}.panel-title h2,.panel-title h3{margin:0}.field{display:grid;gap:8px;margin:13px 0}label{color:#594550;font-weight:900;font-size:13px}input,select{width:100%;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.88);color:var(--ink);padding:13px 14px;outline:none;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}input:focus,select:focus{border-color:rgba(124,92,255,.46);box-shadow:0 0 0 4px rgba(124,92,255,.10);background:#fff}.preview{position:relative;min-height:170px;overflow:hidden;display:grid;place-items:center;border:2px dashed rgba(255,111,145,.34);border-radius:20px;background:rgba(255,255,255,.64)}.preview img{max-height:190px;object-fit:contain}.preview-empty{position:absolute;inset:0;display:grid;place-items:center;color:#a08391;font-weight:900;pointer-events:none}.preview img[src]:not([src=""])+.preview-empty{display:none}.workflow{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}.workflow-step{padding:16px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.64)}.num{width:32px;height:32px;display:grid;place-items:center;border-radius:999px;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));font-weight:950;margin-bottom:10px}.workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,340px);gap:16px;align-items:start}.subpanel{padding:18px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.62)}.candidates{min-height:238px;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}.candidate{cursor:pointer;border:2px solid transparent;border-radius:22px;background:#fff;padding:10px;text-align:left;transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease}.candidate:hover{transform:translateY(-2px)}.candidate.selected{border-color:var(--brand);box-shadow:0 0 0 5px rgba(255,111,145,.14)}.candidate img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:16px;background:#fff8fb}.candidate strong{display:block;margin:10px 4px 2px;font-size:14px}.candidate span{display:block;margin:0 4px 4px;color:var(--muted);font-size:12px}.status{min-height:132px;white-space:pre-wrap;word-break:break-word;border-radius:20px;padding:16px;color:#f9f4f8;background:#2f2330;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;font-size:12px;line-height:1.65}.progress{overflow:hidden;height:10px;border-radius:999px;background:rgba(255,255,255,.16);margin:12px 0 0}.progress span{display:block;height:100%;width:0%;border-radius:inherit;background:linear-gradient(90deg,var(--brand),var(--brand-2));transition:width .25s ease}.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.pet-card{overflow:hidden;display:flex;flex-direction:column;min-height:100%;background:rgba(255,255,255,.82)}.pet-img{height:178px;display:grid;place-items:center;padding:14px;background:linear-gradient(145deg,#fff,#fff0f5);border-bottom:1px solid var(--line)}.pet-img img{width:100%;height:100%;object-fit:contain}.pet-body{padding:16px;display:grid;gap:10px}.meta-row{display:flex;align-items:center;justify-content:space-between;gap:8px}.status-pill{display:inline-flex;align-items:center;max-width:100%;padding:6px 9px;border-radius:999px;background:rgba(124,92,255,.10);color:#6243d3;font-weight:900;font-size:12px}.code{overflow:auto;padding:9px 10px;border:1px solid var(--line);border-radius:12px;background:rgba(255,241,245,.9);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}.empty{min-height:170px;display:grid;place-items:center;text-align:center;padding:24px;border:1px dashed rgba(122,107,117,.30);border-radius:22px;color:var(--muted);background:rgba(255,255,255,.50)}.notice{display:flex;align-items:flex-start;gap:10px;padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.62);color:#66535f;line-height:1.6}.notice.ok{border-color:rgba(19,163,109,.22);background:rgba(19,163,109,.08);color:#08724c}.notice.warn{border-color:rgba(216,132,0,.24);background:rgba(216,132,0,.08);color:#885400}footer{padding:34px 0 46px;color:var(--muted);text-align:center;font-size:13px}@media(max-width:980px){.hero,.studio-layout,.workspace{grid-template-columns:1fr}.hero-card{min-height:auto}.grid-3,.workflow{grid-template-columns:1fr}}@media(max-width:720px){.shell{width:min(100% - 24px,1180px)}.topbar-inner{align-items:flex-start;flex-direction:column;padding:12px 0}.nav{justify-content:flex-start}.hero{padding-top:42px}.hero-stats{grid-template-columns:1fr}.section-head{align-items:flex-start;flex-direction:column}.btn{width:100%}.row-actions .btn,.hero-actions .btn{width:auto;flex:1 1 180px}}
body.modal-open{overflow:hidden}.auth-modal{position:fixed;inset:0;z-index:100;display:none;align-items:center;justify-content:center;padding:22px}.auth-modal.open{display:flex}.auth-modal-backdrop{position:absolute;inset:0;background:rgba(37,24,33,.38);backdrop-filter:blur(10px)}.auth-modal-card{position:relative;width:min(480px,100%);max-height:calc(100vh - 44px);overflow:auto;border:1px solid rgba(255,255,255,.82);border-radius:32px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(255,246,249,.96));box-shadow:0 30px 90px rgba(60,35,58,.28);padding:26px}.auth-modal-card h2{margin:12px 0 8px;font-size:30px;letter-spacing:-.05em}.auth-modal-close{position:absolute;right:18px;top:16px;width:38px;height:38px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.78);color:var(--ink);font-size:24px;line-height:1;cursor:pointer}.auth-modal-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0 16px}.auth-modal-tabs button{min-height:44px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.72);color:var(--muted);font-weight:950;cursor:pointer}.auth-modal-tabs button.active{border-color:transparent;color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 14px 28px rgba(124,92,255,.18)}.auth-modal-form{display:none}.auth-modal-form.active{display:block}.auth-modal-form .btn{width:100%;margin-top:8px}.auth-modal-message{margin-top:14px;min-height:52px}.auth-modal-footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:14px;color:var(--muted);font-size:12px}.auth-modal-footer a{font-weight:900;color:#7c5cff}.auth-modal-footer span{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:260px}@media(max-width:560px){.auth-modal{padding:12px}.auth-modal-card{padding:20px;border-radius:24px}.auth-modal-card h2{font-size:25px}.auth-modal-footer span{max-width:100%}}
.top-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px}.login-action{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border-radius:999px;color:#fff!important;font-weight:950;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 12px 24px rgba(124,92,255,.18);white-space:nowrap}.login-action:hover{transform:translateY(-1px);box-shadow:0 15px 30px rgba(124,92,255,.24);text-decoration:none}.login-action.active{background:linear-gradient(135deg,var(--brand),var(--brand-2));border-color:transparent;color:#fff!important}@media(max-width:720px){.top-actions{width:100%;justify-content:flex-start}.login-action{min-height:40px}}
/* PetDex-inspired landing layout */
.petdex-shell{overflow:hidden}.petdex-topbar{background:rgba(255,250,246,.86);box-shadow:0 12px 40px rgba(94,55,82,.06)}.petdex-topbar-inner{width:min(1320px,calc(100% - 36px))}.petdex-brand span:last-child{display:grid;gap:1px}.petdex-brand strong{font-size:18px}.petdex-brand small{font-size:11px;color:var(--muted);font-weight:800;letter-spacing:.02em}.petdex-nav{gap:4px}.petdex-nav a{font-size:13px;padding:9px 10px}.petdex-actions{gap:9px}.runtime-pill{display:inline-flex;align-items:center;min-height:36px;padding:0 12px;border:1px solid rgba(19,163,109,.18);border-radius:999px;background:rgba(19,163,109,.08);color:#08724c;font-size:12px;font-weight:950;white-space:nowrap}.start-action{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 16px;border-radius:999px;color:#fff!important;font-weight:950;background:#231522;box-shadow:0 12px 24px rgba(35,21,34,.18);white-space:nowrap}.petdex-homeHero{position:relative;padding:80px 0 52px}.petdex-homeHero:before{content:"";position:absolute;inset:-160px -10% auto -10%;height:560px;background:radial-gradient(circle at 20% 20%,rgba(255,111,145,.20),transparent 28rem),radial-gradient(circle at 82% 16%,rgba(124,92,255,.18),transparent 30rem);pointer-events:none}.petdex-hero{position:relative;grid-template-columns:minmax(0,1fr) minmax(360px,520px);width:min(1200px,calc(100% - 36px));padding:0;margin:0 auto;min-height:610px}.hero-copy{align-self:center}.hero-eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(255,111,145,.24);background:rgba(255,255,255,.74);color:#9a4963;border-radius:999px;padding:9px 14px;font-size:13px;font-weight:950;box-shadow:0 12px 28px rgba(255,111,145,.10)}.hero-title{max-width:780px;margin:18px 0 18px;font-size:clamp(54px,7.8vw,98px);line-height:.9;letter-spacing:-.08em}.hero-title em{font-style:normal;color:#ff5f87;text-shadow:0 12px 35px rgba(255,95,135,.18)}.hero-sub{max-width:660px;margin:0;color:#5e515b;font-size:20px;line-height:1.85}.hero-social-proof{display:inline-flex;margin:20px 0 0;padding:9px 13px;border-radius:999px;background:#fff;border:1px solid var(--line);color:#7b5263;font-weight:900;box-shadow:0 10px 24px rgba(120,78,115,.10)}.hero-ctas{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.primaryButton,.secondaryButton{appearance:none;border:0;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 20px;border-radius:16px;font-weight:950}.primaryButton{color:#fff;background:linear-gradient(135deg,var(--brand),var(--brand-2));box-shadow:0 16px 34px rgba(124,92,255,.22)}.secondaryButton{color:var(--ink);background:#fff;border:1px solid var(--line);box-shadow:0 12px 26px rgba(120,78,115,.08)}.hero-note{margin:12px 0 0;color:var(--muted);font-size:13px;font-weight:800}.hero-pet-stage{align-self:center}.desktop-window{border:1px solid rgba(255,255,255,.80);border-radius:36px;background:linear-gradient(145deg,rgba(255,255,255,.96),rgba(255,240,246,.80));box-shadow:0 30px 90px rgba(97,57,89,.20);overflow:hidden}.window-bar{height:54px;display:flex;align-items:center;gap:9px;padding:0 18px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.62)}.window-bar span{width:11px;height:11px;border-radius:50%;background:#ff6f91}.window-bar span:nth-child(2){background:#ffca5c}.window-bar span:nth-child(3){background:#38d996}.window-bar strong{margin-left:8px;color:#6b5a66;font-size:12px;letter-spacing:.04em}.window-canvas{position:relative;min-height:390px;display:grid;place-items:center;background:radial-gradient(circle at 48% 42%,#fff,transparent 13rem),linear-gradient(145deg,#fff7de,#ffe9f2)}.floating-tag{position:absolute;padding:7px 10px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.82);font-size:12px;font-weight:950;color:#7b5263;box-shadow:0 10px 22px rgba(120,78,115,.12)}.tag-a{left:34px;top:54px}.tag-b{right:36px;top:96px}.tag-c{left:64px;bottom:58px}.pixel-pet{position:relative;width:190px;height:170px;border-radius:44% 44% 38% 38%;background:#ffd58d;border:5px solid #4a2d2d;box-shadow:0 28px 0 rgba(74,45,45,.08),0 35px 45px rgba(101,69,77,.24);animation:petFloat 2.8s ease-in-out infinite}.pixel-pet .ear{position:absolute;top:-42px;width:66px;height:74px;background:#ffb2bc;border:5px solid #4a2d2d;border-radius:18px 44px 18px 44px}.pixel-pet .ear.left{left:16px;transform:rotate(-18deg)}.pixel-pet .ear.right{right:16px;transform:scaleX(-1) rotate(-18deg)}.pixel-pet .face{position:absolute;inset:44px 30px auto;display:flex;align-items:center;justify-content:space-between}.pixel-pet i{width:18px;height:24px;border-radius:50%;background:#2b1b1b}.pixel-pet b{position:absolute;left:50%;top:42px;width:34px;height:18px;border-bottom:5px solid #2b1b1b;border-radius:0 0 30px 30px;transform:translateX(-50%)}.body-dot{position:absolute;right:34px;bottom:28px;width:26px;height:18px;border-radius:50%;background:#ff9fb0;opacity:.82}@keyframes petFloat{50%{transform:translateY(-8px)}}.hero-mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}.hero-mini-stats div{padding:14px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.80);box-shadow:0 14px 30px rgba(120,78,115,.08)}.hero-mini-stats strong{display:block;font-size:26px}.hero-mini-stats span{display:block;color:var(--muted);font-size:12px;font-weight:900}.petdex-section{width:min(1200px,calc(100% - 36px));margin:0 auto;padding:54px 0}.section-kicker>span{display:inline-flex;margin-bottom:10px;color:#c33e65;font-weight:950;font-size:13px;letter-spacing:.06em;text-transform:uppercase}.section-kicker h2,.studio-copy h2,.installSection h2{margin:0;color:var(--ink);font-size:clamp(30px,4.4vw,54px);line-height:1.02;letter-spacing:-.06em}.section-kicker p,.studio-copy p,.installSection p{max-width:680px;color:var(--muted);line-height:1.8}.center{text-align:center}.center p{margin-left:auto;margin-right:auto}.caseGrid{display:grid;grid-template-columns:1.15fr .9fr .9fr;gap:16px}.caseCard{overflow:hidden;border:1px solid var(--line);border-radius:32px;background:rgba(255,255,255,.80);box-shadow:0 20px 55px rgba(120,78,115,.11)}.caseCardFeatured{background:linear-gradient(145deg,#fff,#fff4e0)}.caseCompare{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px;min-height:230px}.photo-card,.sprite-card{display:grid;place-items:center;border-radius:24px;min-height:205px;font-weight:950;color:#7b5263}.photo-card{background:linear-gradient(145deg,#fff,#f0e7ff);border:1px dashed rgba(124,92,255,.22)}.photo-cat{background:linear-gradient(145deg,#fff,#ffe9d2)}.photo-dog{background:linear-gradient(145deg,#fff,#e8f1ff)}.photo-rabbit{background:linear-gradient(145deg,#fff,#f1e8ff)}.sprite-card{background:#fff;border:1px solid var(--line);gap:8px}.mini-pet{width:90px;height:82px;border-radius:36px;background:#ffd58d;border:4px solid #4a2d2d;box-shadow:0 16px 28px rgba(80,48,60,.16)}.mini-pet.cream{background:#ffe4b8}.mini-pet.purple{background:#ddd0ff}.caseBody{padding:0 20px 20px}.caseBody strong{font-size:20px}.caseBadgeGold{font-size:12px;background:#ffe59a;color:#7b5200;border-radius:999px;padding:4px 8px}.caseBody p{color:var(--muted);line-height:1.65}.animTags{display:flex;flex-wrap:wrap;gap:8px}.animTags span{padding:6px 9px;border-radius:999px;background:#fff1f5;color:#9a4963;font-size:12px;font-weight:900}.processGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:24px}.processGrid article{padding:22px;border:1px solid var(--line);border-radius:26px;background:rgba(255,255,255,.76);box-shadow:0 18px 45px rgba(120,78,115,.08)}.processGrid b{color:#ff6f91;font-size:26px}.processGrid h3{margin:12px 0 8px}.processGrid p{color:var(--muted);line-height:1.7}.studioPreview{display:grid;grid-template-columns:.82fr 1.18fr;gap:20px;align-items:center}.studio-board{display:grid;grid-template-columns:260px 1fr;gap:14px;border:1px solid var(--line);border-radius:34px;background:rgba(255,255,255,.78);box-shadow:var(--shadow);padding:18px}.board-column{border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.70);padding:16px}.board-column h3{margin:0 0 14px}.preview-input{height:44px;border-radius:14px;background:#fff;border:1px solid var(--line);margin-bottom:10px}.preview-input.short{width:70%}.upload-box{display:grid;place-items:center;height:140px;border:2px dashed rgba(255,111,145,.34);border-radius:18px;color:#a35b70;font-weight:950;background:#fff8fb}.candidate-row{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.candidate-row span{aspect-ratio:1;border-radius:18px;background:linear-gradient(145deg,#fff,#ffe8f0);border:1px solid var(--line)}.preview-status{margin-top:14px;padding:13px;border-radius:16px;background:#2f2330;color:#fff;font-family:ui-monospace,monospace;font-size:12px}.teaserGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}.teaserCard{padding:24px;border:1px solid var(--line);border-radius:28px;background:#fff;box-shadow:0 18px 45px rgba(120,78,115,.09)}.teaserCard strong{font-size:22px}.teaserCard p{color:var(--muted);line-height:1.7}.teaserCard span{color:#7c5cff;font-weight:950}.installSection{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center;border:1px solid var(--line);border-radius:36px;background:linear-gradient(135deg,rgba(255,255,255,.86),rgba(255,241,245,.78));box-shadow:var(--shadow);padding:34px}.downloadCards{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.downloadCards div{padding:20px;border-radius:22px;background:#fff;border:1px solid var(--line);font-weight:950}.downloadCards span{display:block;margin-top:8px;color:var(--muted);font-size:12px}.faqGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:18px}.faqGrid details{border:1px solid var(--line);border-radius:22px;background:#fff;padding:18px}.faqGrid summary{cursor:pointer;font-weight:950}.faqGrid p{color:var(--muted);line-height:1.7}.petdex-footer{border-top:1px solid var(--line)}@media(max-width:1120px){.petdex-topbar-inner{align-items:flex-start;flex-direction:column;padding:14px 0}.petdex-actions{width:100%;justify-content:flex-start}.petdex-nav{justify-content:flex-start}.petdex-hero,.studioPreview,.installSection{grid-template-columns:1fr}.caseGrid,.processGrid,.teaserGrid{grid-template-columns:1fr 1fr}.hero-title{font-size:clamp(46px,11vw,82px)}}@media(max-width:720px){.petdex-homeHero{padding-top:42px}.petdex-hero{width:min(100% - 24px,1200px);min-height:auto}.petdex-section{width:min(100% - 24px,1200px);padding:38px 0}.hero-title{font-size:clamp(42px,15vw,62px)}.hero-sub{font-size:17px}.caseGrid,.processGrid,.teaserGrid,.downloadCards,.faqGrid,.studio-board{grid-template-columns:1fr}.caseCompare{min-height:0}.photo-card,.sprite-card{min-height:150px}.window-canvas{min-height:310px}.pixel-pet{transform:scale(.82);animation:none}.runtime-pill,.start-action{display:none}.petdex-nav{gap:6px}.petdex-nav a{font-size:12px;padding:8px 9px}.hero-ctas .primaryButton,.hero-ctas .secondaryButton{flex:1 1 160px}.installSection{padding:22px}}


/* Header refinement: remove account-center style, keep login at the right */
.topbar-inner{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  justify-content:normal;
}
.nav{justify-content:center;min-width:0}
.top-actions{justify-self:end;margin-left:auto;flex:0 0 auto}
.login-action{margin-left:auto}
@media(max-width:1120px){
  .topbar-inner,.petdex-topbar-inner{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"brand actions" "nav nav";
    align-items:center;
    gap:10px 12px;
    padding:12px 0;
  }
  .brand,.petdex-brand{grid-area:brand;min-width:0}
  .brand span:last-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
  .nav,.petdex-nav{
    grid-area:nav;
    width:100%;
    justify-content:flex-start;
    flex-wrap:nowrap;
    overflow-x:auto;
    scrollbar-width:none;
    padding-bottom:2px;
  }
  .nav::-webkit-scrollbar,.petdex-nav::-webkit-scrollbar{display:none}
  .top-actions,.petdex-actions{
    grid-area:actions;
    width:auto;
    justify-self:end;
    justify-content:flex-end;
    margin-left:auto;
  }
}
@media(max-width:720px){
  .topbar-inner,.petdex-topbar-inner{align-items:center;grid-template-columns:minmax(0,1fr) auto}
  .top-actions,.petdex-actions{width:auto;justify-content:flex-end}
  .login-action{min-height:38px;padding:0 14px}
  .nav,.petdex-nav{gap:6px}
  .nav a,.petdex-nav a{white-space:nowrap}
}

.runtime-pill.ok{border-color:rgba(19,163,109,.24);background:rgba(19,163,109,.10);color:#08724c}.runtime-pill.bad{border-color:rgba(217,74,91,.24);background:rgba(217,74,91,.10);color:#9d2636}.capabilityGrid{grid-template-columns:repeat(3,1fr)}.capabilityCard{padding-top:22px}.capabilityIcon{width:58px;height:58px;margin:0 20px 16px;display:grid;place-items:center;border-radius:22px;background:#fff1f5;font-size:28px;box-shadow:0 12px 28px rgba(120,78,115,.08)}.clean-stats strong{font-size:18px}.clean-downloadCards div{min-height:92px}@media(max-width:720px){.capabilityGrid{grid-template-columns:1fr}}

/* Generation workbench: retry controls and action frame preview */
.action-preview{margin-top:16px;display:grid;gap:12px}.action-preview .empty{min-height:120px}.action-preview-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:12px 14px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.72)}.action-preview-head strong{font-size:16px}.action-preview-head span{color:var(--muted);font-size:12px;font-weight:900}.action-preview-head .btn{min-height:36px;padding:0 12px;border-radius:12px;font-size:12px}.action-strip{padding:12px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.66)}.action-strip-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}.action-strip-title strong{font-size:14px}.action-strip-title span{color:var(--muted);font-size:12px;font-weight:900}.frame-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}.frame-row figure{flex:0 0 74px;margin:0;padding:7px;border:1px solid var(--line);border-radius:14px;background:#fff;text-align:center}.frame-row img{width:60px;height:60px;object-fit:contain;margin:0 auto;border-radius:10px;background:#fff8fb}.frame-row figcaption{margin-top:4px;color:var(--muted);font-size:11px;font-weight:900}
.action-strip-tools{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}.btn.mini{min-height:28px;padding:0 10px;border-radius:10px;font-size:12px}
.action-live-preview{display:grid;grid-template-columns:160px minmax(0,1fr);align-items:center;gap:14px;margin:8px 0 12px;padding:10px;border:1px solid rgba(102,64,83,.10);border-radius:16px;background:linear-gradient(145deg,rgba(255,255,255,.86),rgba(255,241,245,.58))}.action-live-stage{position:relative;width:160px;height:160px;display:grid;place-items:center;overflow:hidden;border-radius:16px;background:conic-gradient(from 45deg,#fff 0 25%,#f7f1ff 0 50%,#fff 0 75%,#f7f1ff 0);background-size:22px 22px;border:1px solid rgba(102,64,83,.12)}.action-live-stage:after{content:"";position:absolute;inset:0;border:2px dashed rgba(124,92,255,.32);border-radius:16px;pointer-events:none}.action-live-stage img,.action-live-stage canvas{width:160px;height:160px;object-fit:contain;image-rendering:auto;display:block}.action-live-info{min-width:0;display:grid;gap:4px}.action-live-info strong{font-size:14px}.action-live-info span{color:var(--muted);font-size:12px;font-weight:900}
@media(max-width:720px){.frame-row figure{flex-basis:68px}.frame-row img{width:54px;height:54px}.action-live-preview{grid-template-columns:1fr}.action-live-stage{margin:0 auto}}

/* Clean workbench pass: reduce clutter and increase breathing room */
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.compact-hero{display:flex;align-items:end;justify-content:space-between;gap:28px;padding:34px 0 8px}.compact-hero h1{margin:12px 0 0;font-size:clamp(34px,4.6vw,54px);letter-spacing:-.055em}.compact-hero .lead{max-width:360px;text-align:right;font-size:15px;line-height:1.6}.compact-section{padding-top:18px}.compact-footer{padding:18px 0 28px;opacity:.58}.compact-footer span{display:none}
body[data-page="create"] .petdex-topbar-inner{width:min(1240px,calc(100% - 44px));min-height:64px}body[data-page="create"] .brand-mark{width:38px;height:38px;border-radius:14px}body[data-page="create"] .petdex-brand strong{font-size:17px}body[data-page="create"] .petdex-brand small{font-size:11px}body[data-page="create"] .petdex-nav{justify-content:center;gap:8px}body[data-page="create"] .petdex-nav a{padding:9px 14px;font-size:13px;background:transparent}body[data-page="create"] .start-action{display:none}body[data-page="create"] .runtime-pill{min-height:34px;padding:0 10px;max-width:128px;overflow:hidden;text-overflow:ellipsis}body[data-page="create"] .login-action{min-height:38px;padding:0 15px}
body[data-page="create"] .studio-layout{grid-template-columns:minmax(300px,360px) minmax(0,1fr);gap:28px;align-items:start}body[data-page="create"] .card{background:rgba(255,255,255,.78);box-shadow:0 18px 54px rgba(76,49,75,.08)}body[data-page="create"] .panel{padding:28px;border-radius:32px}body[data-page="create"] .panel-title{margin-bottom:22px}body[data-page="create"] .panel-title h3{font-size:22px;letter-spacing:-.035em}body[data-page="create"] .field{margin:0 0 18px;gap:9px}body[data-page="create"] label{font-size:12px;color:#7a606d;letter-spacing:.04em}body[data-page="create"] input,body[data-page="create"] select{border-radius:18px;padding:14px 15px;background:#fff;border-color:rgba(102,64,83,.12)}body[data-page="create"] .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}body[data-page="create"] .preview{min-height:230px;border-radius:26px;background:linear-gradient(145deg,#fff,#fff8fb);border-color:rgba(255,111,145,.24)}body[data-page="create"] .preview img{max-height:230px}body[data-page="create"] .preview-empty{font-size:14px;color:#b08a9b}.compact-notice{padding:10px 12px;margin-bottom:18px;border-radius:16px}.primary-actions{margin-top:20px;display:grid;grid-template-columns:1fr auto;gap:12px}.primary-actions .btn{min-height:52px}.primary-actions .btn.ghost{padding:0 16px;color:#7a606d;background:#fff}
body[data-page="create"] .workspace{grid-template-columns:minmax(0,1fr) 260px;gap:22px}body[data-page="create"] .subpanel{padding:0;border:0;background:transparent}body[data-page="create"] .result-panel{min-width:0}body[data-page="create"] .candidates{min-height:350px;grid-template-columns:repeat(2,minmax(180px,1fr));gap:18px}body[data-page="create"] .candidate{padding:14px;border-radius:28px;border-width:1px;background:rgba(255,255,255,.92);box-shadow:0 14px 34px rgba(76,49,75,.07)}body[data-page="create"] .candidate:hover{transform:translateY(-3px);box-shadow:0 18px 42px rgba(76,49,75,.10)}body[data-page="create"] .candidate.selected{border-color:rgba(255,111,145,.72);box-shadow:0 0 0 5px rgba(255,111,145,.12),0 18px 42px rgba(76,49,75,.10)}body[data-page="create"] .candidate img{border-radius:20px;background:#fff;min-height:180px}body[data-page="create"] .candidate strong{margin:12px 3px 0;font-size:15px}body[data-page="create"] .candidate span{display:none}.secondary-actions{margin-top:20px;gap:10px}.secondary-actions .btn{min-height:42px;padding:0 15px;border-radius:14px}.status-panel{position:sticky;top:92px;padding:20px!important;border:1px solid var(--line)!important;border-radius:26px!important;background:rgba(255,255,255,.68)!important}.status-panel .panel-title{margin-bottom:12px!important}.status-panel .panel-title h3{font-size:18px!important}.status{min-height:84px;max-height:180px;overflow:auto;border-radius:18px;padding:14px;background:#302731;color:#fff;font-size:12px;line-height:1.55}.progress{height:8px;background:rgba(48,39,49,.10)}body[data-page="create"] .empty{min-height:300px;border-radius:26px;background:rgba(255,255,255,.48);padding:28px}body[data-page="create"] .empty p{display:none}.action-preview{margin-top:24px}.action-preview .empty{min-height:120px}.action-preview-head,.action-strip{background:rgba(255,255,255,.78);border-radius:20px}.frame-row figure{background:#fff;border-color:rgba(102,64,83,.10)}
@media(max-width:1080px){.compact-hero{align-items:flex-start;flex-direction:column;gap:10px}.compact-hero .lead{text-align:left}.status-panel{position:static}body[data-page="create"] .studio-layout,body[data-page="create"] .workspace{grid-template-columns:1fr}body[data-page="create"] .candidates{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}}@media(max-width:720px){.compact-hero{padding-top:22px}.compact-section{padding-top:10px}body[data-page="create"] .petdex-topbar-inner{width:min(100% - 24px,1240px)}body[data-page="create"] .panel{padding:20px;border-radius:26px}body[data-page="create"] .form-grid,.primary-actions{grid-template-columns:1fr}body[data-page="create"] .candidates{grid-template-columns:1fr;min-height:220px}.secondary-actions .btn{flex:1 1 130px}.status{max-height:140px}}

/* Minimal UI pass: calmer pages, less text, fewer panels */
.minimal-page .petdex-topbar-inner,body[data-page="create"] .petdex-topbar-inner{width:min(1180px,calc(100% - 48px));min-height:64px}.minimal-page .petdex-nav,.minimal-page .nav,body[data-page="create"] .petdex-nav{gap:10px}.minimal-page .petdex-nav a,.minimal-page .nav a,body[data-page="create"] .petdex-nav a{font-size:14px;padding:9px 15px}.minimal-page .brand-mark{width:38px;height:38px;border-radius:14px}.minimal-page .petdex-brand strong{font-size:17px}.minimal-page .petdex-brand small{font-size:11px}.minimal-page .start-action{display:none}.minimal-page .runtime-pill{min-height:34px;padding:0 10px;max-width:96px;overflow:hidden;text-overflow:ellipsis}.minimal-page .login-action{min-height:38px;padding:0 15px}.minimal-home{padding:56px 0 40px}.minimal-hero{min-height:560px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);gap:42px;align-items:center;padding:58px;border-radius:42px;background:linear-gradient(145deg,rgba(255,255,255,.90),rgba(255,246,249,.72));box-shadow:0 24px 80px rgba(70,45,72,.10)}.minimal-hero h1{max-width:760px;margin:18px 0 18px;font-size:clamp(48px,7vw,88px);line-height:.92;letter-spacing:-.075em}.minimal-hero p{max-width:480px;margin:0;color:var(--muted);font-size:18px;line-height:1.7}.minimal-pet{min-height:420px;display:grid;place-items:center;border-radius:34px;background:radial-gradient(circle at 50% 42%,#fff,transparent 13rem),linear-gradient(145deg,#fff7de,#ffe9f2);border:1px solid var(--line)}.minimal-links{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}.minimal-links a{display:flex;align-items:center;justify-content:center;min-height:78px;border-radius:24px;background:rgba(255,255,255,.72);border:1px solid var(--line);font-size:20px;font-weight:950;box-shadow:0 14px 40px rgba(70,45,72,.06)}.compact-actions{margin-top:0}.minimal-page .page-hero.compact-hero{padding-top:42px}.minimal-page .gallery{gap:22px}.minimal-page .empty{min-height:300px;background:rgba(255,255,255,.55);border-radius:30px}.minimal-page .pet-card{border-radius:28px}.minimal-page .pet-body p,.minimal-page .code{display:none}
body[data-page="create"] .workspace{display:block}body[data-page="create"] .inline-status{position:static!important;margin:-6px 0 22px;padding:14px 16px!important;border-radius:22px!important;background:rgba(48,39,49,.045)!important;border:1px solid rgba(102,64,83,.08)!important}body[data-page="create"] .status-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:center}body[data-page="create"] .inline-status .progress{margin:0;height:7px;background:rgba(48,39,49,.10)}body[data-page="create"] .inline-status .status{min-height:0;max-height:48px;overflow:hidden;margin-top:9px;padding:0;background:transparent;color:#64515d;font-family:inherit;font-weight:850;font-size:13px;line-height:1.45}body[data-page="create"] .inline-status .small{font-size:12px;font-weight:950;color:#7c5cff}body[data-page="create"] .candidates{min-height:420px;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:22px}body[data-page="create"] .empty{min-height:420px}body[data-page="create"] .secondary-actions{padding-top:2px}body[data-page="create"] .secondary-actions .btn.ghost:last-child{display:none}body[data-page="create"] .action-preview:empty{display:none}body[data-page="create"] .action-preview{margin-top:22px}.status-panel:not(.inline-status){display:none!important}
@media(max-width:1080px){.minimal-hero{grid-template-columns:1fr;min-height:auto}.minimal-pet{min-height:300px}.minimal-links{grid-template-columns:1fr 1fr 1fr}}@media(max-width:720px){.minimal-page .petdex-topbar-inner,body[data-page="create"] .petdex-topbar-inner{width:min(100% - 24px,1180px)}.minimal-home{padding:24px 0}.minimal-hero{padding:28px;border-radius:30px}.minimal-hero h1{font-size:clamp(40px,14vw,62px)}.minimal-pet{display:none}.minimal-links{grid-template-columns:1fr}.minimal-links a{min-height:58px}.compact-actions{width:100%;display:grid;grid-template-columns:1fr 1fr}.compact-actions .btn{width:100%}body[data-page="create"] .candidates{grid-template-columns:1fr;min-height:260px}body[data-page="create"] .empty{min-height:260px}}

/* Visual polish after screenshot review */
body[data-page="create"] #file{position:absolute!important;width:1px;height:1px;opacity:0;pointer-events:none}.file-trigger{display:flex!important;align-items:center;justify-content:center;min-height:48px;border-radius:18px;background:#fff;border:1px solid rgba(102,64,83,.12);color:#3c2935;font-size:15px!important;font-weight:950;letter-spacing:0!important;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.file-trigger:hover{transform:translateY(-1px);border-color:rgba(124,92,255,.28);box-shadow:0 10px 24px rgba(76,49,75,.08)}#photoPreview:not([src]),#photoPreview[src=""]{display:none!important}body[data-page="create"] .preview{min-height:210px}body[data-page="create"] .preview-empty{font-size:15px;color:#b896a5}body[data-page="create"] .candidates>.empty{grid-column:1/-1;min-height:300px}body[data-page="create"] .empty strong{font-size:18px;color:#81707b}body[data-page="create"] .compact-notice{display:none!important}body[data-page="create"] .panel-title{margin-bottom:18px}body[data-page="create"] .studio-layout{gap:30px}body[data-page="create"] .candidates{min-height:360px}body[data-page="create"] .candidate img{min-height:160px}.minimal-page .empty p,body[data-page="create"] .empty p{display:none}
body[data-page="create"]:not(.has-candidates) .secondary-actions{display:none}body[data-page="create"]:not(.has-candidates) .candidates{margin-bottom:0}body[data-page="create"].has-candidates .candidates>.empty{display:none}
.pet-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}.btn.danger{color:#9d2636;background:rgba(217,74,91,.08);border:1px solid rgba(217,74,91,.22);box-shadow:none}.btn.danger:hover{box-shadow:0 12px 24px rgba(217,74,91,.12)}.minimal-page .pet-card-actions .btn{min-height:40px;border-radius:14px;padding:0 12px;font-size:13px}
body[data-page="create"]:not(.has-pet) .current-pet-delete{display:none}body[data-page="create"].has-pet:not(.has-candidates) .secondary-actions{display:flex}body[data-page="create"].has-pet:not(.has-candidates) .secondary-actions .btn:not(.current-pet-delete){display:none}body[data-page="create"] .current-pet-delete{margin-left:auto}
/* Install/download page */
.install-download-panel{margin-top:8px}.installerCards a{display:block;padding:20px;border-radius:22px;background:#fff;border:1px solid var(--line);font-weight:950;transition:transform .16s ease,box-shadow .16s ease}.installerCards a:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(76,49,75,.10)}.installerCards strong{display:block}.install-note-card{padding:24px}.install-note-card code{padding:2px 6px;border-radius:8px;background:rgba(48,39,49,.08);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
.minimal-links{grid-template-columns:repeat(4,1fr)}@media(max-width:1080px){.minimal-links{grid-template-columns:repeat(2,1fr)}}@media(max-width:720px){.minimal-links{grid-template-columns:1fr}}
.installerCards a.disabled-download{opacity:.45;cursor:not-allowed;background:rgba(255,255,255,.55)}.installerCards a.disabled-download:hover{transform:none;box-shadow:none}

/* Library page polish */
body[data-page="library"] .library-hero{padding-top:38px;align-items:flex-end}
.library-lead{max-width:520px!important;text-align:left!important;margin-top:10px!important;font-size:15px!important;color:#7a6b75}
.library-actions{align-items:center}
.library-section{padding-top:18px}.library-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:18px;padding:16px 18px;border-radius:24px;background:rgba(255,255,255,.68);box-shadow:0 14px 40px rgba(70,45,72,.07)}.library-toolbar div{display:grid;gap:3px}.library-toolbar strong{font-size:17px}.library-toolbar span{font-size:12px;color:var(--muted);font-weight:850}.library-toolbar .btn{min-height:40px;border-radius:14px;padding:0 14px;font-size:13px}
body[data-page="library"] .library-gallery{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:22px;align-items:stretch}.library-card{position:relative;overflow:hidden;border-radius:32px;background:rgba(255,255,255,.84);box-shadow:0 18px 52px rgba(70,45,72,.09);transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease}.library-card:hover{transform:translateY(-3px);box-shadow:0 24px 70px rgba(70,45,72,.13);border-color:rgba(255,111,145,.22)}.library-pet-img{position:relative;height:230px;padding:20px;background:radial-gradient(circle at 50% 45%,#fff 0,rgba(255,255,255,.85) 33%,rgba(255,238,245,.82) 70%),linear-gradient(145deg,#fff8fb,#f4efff);border-bottom:1px solid rgba(102,64,83,.10)}.library-pet-img img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 16px 18px rgba(73,44,61,.13))}.library-placeholder{font-size:64px;filter:drop-shadow(0 12px 20px rgba(73,44,61,.12))}.library-status{position:absolute;left:16px;top:16px;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.86);border:1px solid rgba(102,64,83,.10);font-size:12px;font-weight:950;color:#665865;box-shadow:0 8px 20px rgba(70,45,72,.08)}.library-status.ok{color:#08724c;background:rgba(19,163,109,.10);border-color:rgba(19,163,109,.20)}.library-status.bad{color:#9d2636;background:rgba(217,74,91,.10);border-color:rgba(217,74,91,.22)}.library-status.work{color:#885400;background:rgba(216,132,0,.10);border-color:rgba(216,132,0,.22)}.library-status.idle{color:#6243d3;background:rgba(124,92,255,.10);border-color:rgba(124,92,255,.18)}.library-card-body{padding:18px;gap:13px}.library-title-row{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.library-title-row h3{margin:0;min-width:0;font-size:20px;line-height:1.18;letter-spacing:-.035em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.library-chip{flex:0 0 auto;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:950;background:#fff1f5;color:#9a4963}.library-chip.public{background:rgba(19,163,109,.10);color:#08724c}.library-meta{display:flex;gap:7px;flex-wrap:wrap}.library-meta span{padding:6px 8px;border-radius:999px;background:rgba(48,39,49,.055);color:#786671;font-size:11px;font-weight:900}.library-summary{display:grid;grid-template-columns:1fr 88px;gap:10px}.library-summary>div{padding:11px 12px;border:1px solid rgba(102,64,83,.10);border-radius:16px;background:rgba(255,255,255,.62)}.library-summary strong{display:block;font-size:14px}.library-summary span{display:block;margin-top:3px;color:var(--muted);font-size:11px;font-weight:850}.library-code{width:100%;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px;text-align:left;padding:10px 12px;border:1px dashed rgba(124,92,255,.22);border-radius:16px;background:rgba(124,92,255,.055);cursor:pointer}.library-code span{color:#7a6b75;font-size:11px;font-weight:950}.library-code strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px}.library-code.muted-code{cursor:default;border-style:solid;background:rgba(48,39,49,.04);opacity:.72}.library-primary-row{display:grid;grid-template-columns:1fr auto;gap:10px}.library-primary-row .btn,.library-card-actions .btn{min-height:42px;border-radius:14px;padding:0 13px;font-size:13px}.library-download{box-shadow:0 12px 24px rgba(124,92,255,.17)}.library-card-actions{margin-top:0;grid-template-columns:1fr 1fr}
body[data-page="library"] .empty{grid-column:1/-1;min-height:360px;border-radius:32px;background:rgba(255,255,255,.62)}body[data-page="library"] .empty p{display:block;margin-top:12px}
@media(max-width:760px){body[data-page="library"] .library-hero{align-items:flex-start}.library-toolbar{align-items:flex-start;flex-direction:column}.library-toolbar .btn{width:100%}body[data-page="library"] .library-gallery{grid-template-columns:1fr}.library-pet-img{height:210px}.library-summary{grid-template-columns:1fr 1fr}.library-primary-row{grid-template-columns:1fr 1fr}}

/* Library image containment fix: preview image must never cover text/actions */
body[data-page="library"] .library-card{display:grid!important;grid-template-rows:230px auto;isolation:isolate;overflow:hidden!important}
body[data-page="library"] .library-pet-img{height:230px!important;min-height:230px;max-height:230px;overflow:hidden!important;position:relative;z-index:1;align-self:stretch}
body[data-page="library"] .library-pet-img img{width:auto!important;height:auto!important;max-width:100%!important;max-height:188px!important;object-fit:contain!important;position:relative;z-index:1;margin:auto;display:block}
body[data-page="library"] .library-status{z-index:3}
body[data-page="library"] .library-card-body{position:relative;z-index:2;background:rgba(255,255,255,.92);border-top:1px solid rgba(102,64,83,.08);min-width:0;overflow:hidden}
body[data-page="library"] .library-card-body>*{min-width:0}
body[data-page="library"] .library-title-row,body[data-page="library"] .library-meta,body[data-page="library"] .library-summary,body[data-page="library"] .library-code,body[data-page="library"] .library-primary-row,body[data-page="library"] .library-card-actions{position:relative;z-index:2}
@media(max-width:760px){body[data-page="library"] .library-card{grid-template-rows:210px auto}body[data-page="library"] .library-pet-img{height:210px!important;min-height:210px;max-height:210px}body[data-page="library"] .library-pet-img img{max-height:170px!important}}

/* Preview boundary fix: canvas clipping boundary must equal dashed box. */
.action-live-stage{border:0!important;box-shadow:inset 0 0 0 1px rgba(102,64,83,.12)}
.action-live-stage canvas{position:absolute;inset:0;width:100%!important;height:100%!important}
.action-live-stage:after{box-sizing:border-box}


/* 2026-06-30 Sprite inspection workbench */
body.inspection-page{--bg:#f7efe5;--bg-2:#ecf2ff;--ink:#241b22;--muted:#776a72;--line:rgba(56,42,53,.13);--brand:#ff6b8a;--brand-2:#5f6cff;--film:#1f1a20;background:radial-gradient(circle at 8% 6%,rgba(255,107,138,.18),transparent 28rem),radial-gradient(circle at 92% 2%,rgba(95,108,255,.16),transparent 30rem),linear-gradient(135deg,#fff9f1,#eef3ff 70%)}
body.inspection-page .inspection-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,420px);gap:28px;align-items:end;padding-top:40px;padding-bottom:18px}
body.inspection-page .inspection-hero h1{max-width:850px;font-size:clamp(40px,6.4vw,76px);line-height:.94;letter-spacing:-.075em}
body.inspection-page .inspection-hero .lead{max-width:760px;color:#5e535b}
.inspection-legend{display:grid;gap:10px;padding:16px;border:1px solid var(--line);border-radius:26px;background:rgba(255,255,255,.62);box-shadow:0 18px 50px rgba(48,35,49,.08)}
.inspection-legend span{display:flex;align-items:center;gap:10px;min-height:42px;padding:0 12px;border-radius:16px;background:#fff;color:#574b53;font-weight:950}.inspection-legend b{color:#ff6b8a;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
body.inspection-page .inspection-layout{grid-template-columns:minmax(300px,370px) minmax(0,1fr);gap:26px}.input-panel,.output-panel{border-radius:34px!important}.input-panel{position:sticky;top:86px}.output-panel{padding:26px!important;background:linear-gradient(145deg,rgba(255,255,255,.82),rgba(255,250,246,.62))!important}.panel-subtitle{margin:5px 0 0;color:var(--muted);font-size:13px;font-weight:850}.upload-field .preview{min-height:260px;border-radius:28px;background:linear-gradient(145deg,#fff,#fff8fb);border:1px dashed rgba(255,107,138,.38)}.upload-field .preview-empty{display:grid!important;place-items:center;text-align:center;gap:6px}.upload-field .preview-empty strong{font-size:15px;color:#6e5b66}.upload-field .preview-empty span{font-size:12px;color:#a08493}.input-hints{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 18px}.input-hints span{padding:7px 9px;border-radius:999px;background:rgba(255,107,138,.08);color:#9d4b61;font-size:12px;font-weight:950}.result-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin:4px 0 14px}.result-head strong{font-size:18px}.result-head span{color:var(--muted);font-size:12px;font-weight:900}body.inspection-page .workspace{display:block}body.inspection-page .result-panel{padding:0!important}.inspection-page .inline-status{margin:0 0 20px!important;background:rgba(31,26,32,.045)!important}.inspection-page .inline-status .status{color:#554a52!important}.inspection-page .candidates{min-height:320px;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px}.inspection-page .candidate{position:relative;border-radius:26px;background:#fff;box-shadow:0 16px 38px rgba(48,35,49,.08)}.inspection-page .candidate:before{content:"";position:absolute;left:18px;right:18px;top:10px;height:4px;border-radius:99px;background:repeating-linear-gradient(90deg,rgba(31,26,32,.14) 0 8px,transparent 8px 14px)}.inspection-page .candidate img{margin-top:8px;border-radius:18px;background:conic-gradient(from 45deg,#fff 0 25%,#f3eef6 0 50%,#fff 0 75%,#f3eef6 0);background-size:24px 24px}.inspection-page .secondary-actions{position:sticky;bottom:12px;z-index:4;padding:12px;margin:14px -8px 0;border:1px solid rgba(56,42,53,.10);border-radius:22px;background:rgba(255,255,255,.80);backdrop-filter:blur(14px)}
.inspection-head{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:14px;align-items:center;padding:18px;border-radius:26px;background:linear-gradient(135deg,#211b22,#35263a);color:#fff;box-shadow:0 22px 54px rgba(31,26,32,.20)}.inspection-head strong{display:block;font-size:24px;letter-spacing:-.04em}.inspection-head p{margin:5px 0 0;color:rgba(255,255,255,.72);font-size:13px;line-height:1.55}.inspection-kicker{display:block;margin-bottom:4px;color:#ffb7c6;font-size:11px;text-transform:uppercase;letter-spacing:.14em;font-weight:950}.inspection-score{display:flex;align-items:baseline;gap:3px;min-width:100px;justify-content:center}.inspection-score b{font-size:42px;letter-spacing:-.07em}.inspection-score span{color:rgba(255,255,255,.72);font-weight:950}.inspection-head .btn{background:#fff;color:#241b22;box-shadow:none}.inspection-timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:12px 0}.inspection-timeline span{display:flex;align-items:center;gap:8px;padding:10px;border:1px solid var(--line);border-radius:16px;background:rgba(255,255,255,.66);color:#897b85;font-size:12px;font-weight:950}.inspection-timeline span.done{background:rgba(19,163,109,.10);color:#08724c;border-color:rgba(19,163,109,.22)}.inspection-timeline b{display:grid;place-items:center;width:24px;height:24px;border-radius:999px;background:rgba(31,26,32,.08);font-size:11px}.inspection-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.inspection-metrics div{padding:13px 14px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.70)}.inspection-metrics strong{display:block;font-size:20px;letter-spacing:-.04em}.inspection-metrics span{display:block;margin-top:2px;color:var(--muted);font-size:11px;font-weight:900}.inspection-empty{display:grid;gap:10px;padding:22px;border:1px dashed rgba(56,42,53,.20);border-radius:24px;background:rgba(255,255,255,.54);color:#786b74}.inspection-empty strong{color:#241b22;font-size:20px}.inspection-strip{position:relative;overflow:hidden;border-radius:24px!important;background:rgba(255,255,255,.82)!important}.inspection-strip:before{content:"";position:absolute;left:0;top:0;bottom:0;width:5px;background:#13a36d}.inspection-strip.warn:before{background:#d88400}.inspection-strip.bad:before{background:#d94a5b}.inspection-strip .action-strip-title{align-items:flex-start}.inspection-strip .action-strip-title>div:first-child{display:grid;gap:4px}.quality-pill{display:inline-flex;align-items:center;justify-content:center;min-width:52px;height:30px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:950}.quality-pill.ok{background:rgba(19,163,109,.12);color:#08724c}.quality-pill.warn{background:rgba(216,132,0,.12);color:#885400}.quality-pill.bad{background:rgba(217,74,91,.12);color:#9d2636}.inspection-live{background:linear-gradient(145deg,rgba(255,255,255,.94),rgba(236,242,255,.70))!important}.inspection-frames{padding:10px;border-radius:18px;background:#211b22}.inspection-frames figure{background:#fff!important;border:0!important;box-shadow:0 8px 20px rgba(0,0,0,.12)}.inspection-frames figcaption{color:#6f606a!important;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.inspection-frames img{background:conic-gradient(from 45deg,#fff 0 25%,#f2edf5 0 50%,#fff 0 75%,#f2edf5 0)!important;background-size:14px 14px!important}.inspection-page .action-live-stage{background:conic-gradient(from 45deg,#fff 0 25%,#ece6f0 0 50%,#fff 0 75%,#ece6f0 0)!important;background-size:20px 20px!important;border-radius:18px!important}.inspection-page .action-live-stage:after{border-color:rgba(255,107,138,.45)!important;border-style:solid!important}@media(max-width:1080px){body.inspection-page .inspection-hero,body.inspection-page .inspection-layout{grid-template-columns:1fr}.input-panel{position:static}.inspection-head{grid-template-columns:1fr}.inspection-score{justify-content:flex-start}.inspection-page .secondary-actions{position:static}}@media(max-width:720px){body.inspection-page .inspection-hero h1{font-size:clamp(38px,13vw,56px)}.inspection-legend,.inspection-timeline,.inspection-metrics{grid-template-columns:1fr}.inspection-page .candidates{grid-template-columns:1fr;min-height:220px}.inspection-head{padding:16px;border-radius:22px}.inspection-frames{margin-left:-4px;margin-right:-4px}.inspection-page .secondary-actions{display:grid!important;grid-template-columns:1fr 1fr}.inspection-page .secondary-actions .btn{width:100%}}

.upload-field .preview img[src]:not([src=""])+.preview-empty{display:none!important}


/* 2026-06-30 Product operations architecture */
.product-page{--ops-bg:#f8f3ea;--ops-ink:#211a20;--ops-muted:#6f626b;--ops-line:rgba(38,27,36,.13);--ops-panel:rgba(255,255,255,.76);--ops-pink:#ff6b8a;--ops-blue:#596dff;--ops-gold:#f2b84b;--ops-dark:#201a21;background:radial-gradient(circle at 8% -4%,rgba(255,107,138,.18),transparent 30rem),radial-gradient(circle at 92% 0%,rgba(89,109,255,.15),transparent 34rem),linear-gradient(135deg,#fffaf3,#eef3ff 70%);color:var(--ops-ink)}
.product-topbar{background:rgba(255,250,244,.84);box-shadow:0 10px 36px rgba(43,31,42,.07)}.product-topbar .petdex-topbar-inner{width:min(1240px,calc(100% - 48px));min-height:66px}.product-page .brand-mark{background:linear-gradient(135deg,var(--ops-pink),var(--ops-blue));box-shadow:0 14px 30px rgba(89,109,255,.18)}.product-page .nav a.active{background:#fff;border-color:var(--ops-line);box-shadow:0 8px 20px rgba(43,31,42,.06)}
.product-hero{min-height:690px;display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,520px);gap:46px;align-items:center;padding:68px 0 44px}.product-hero-copy h1,.product-page-head h1{margin:16px 0 16px;max-width:900px;font-size:clamp(46px,7vw,88px);line-height:.9;letter-spacing:-.08em}.product-hero-copy p,.product-page-head p{max-width:740px;margin:0;color:var(--ops-muted);font-size:18px;line-height:1.8}.product-kicker{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,107,138,.22);border-radius:999px;background:rgba(255,255,255,.65);color:#a2475e;font-size:12px;font-weight:950;letter-spacing:.08em;text-transform:uppercase}.product-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}.product-actions.compact{align-items:center;justify-content:flex-end;margin-top:0}.product-proof{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}.product-proof span{padding:8px 10px;border-radius:999px;background:#fff;border:1px solid var(--ops-line);color:#63555f;font-size:12px;font-weight:950}.product-console{overflow:hidden;border:1px solid rgba(255,255,255,.82);border-radius:38px;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(255,244,248,.78));box-shadow:0 30px 90px rgba(46,33,45,.18)}.console-bar{height:54px;display:flex;align-items:center;gap:9px;padding:0 18px;border-bottom:1px solid var(--ops-line);background:rgba(255,255,255,.58)}.console-bar span{width:11px;height:11px;border-radius:50%;background:#ff6b8a}.console-bar span:nth-child(2){background:#f2b84b}.console-bar span:nth-child(3){background:#22c88a}.console-bar strong{margin-left:8px;color:#6d6069;font-size:12px;letter-spacing:.12em;text-transform:uppercase}.console-stage{position:relative;min-height:460px;padding:28px;display:grid;align-content:center;gap:18px;background:radial-gradient(circle at 50% 34%,#fff 0 23%,transparent 42%),linear-gradient(145deg,#fff6dc,#ffeaf2)}.sprite-film{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:10px;border-radius:18px;background:#201a21;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}.sprite-film i{height:62px;border-radius:12px;background:conic-gradient(from 45deg,#fff 0 25%,#f1ebf3 0 50%,#fff 0 75%,#f1ebf3 0);background-size:18px 18px;border:4px solid #fff}.console-pet{min-height:210px;display:grid;place-items:center}.console-readout{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:end;padding:16px;border:1px solid var(--ops-line);border-radius:20px;background:rgba(255,255,255,.82)}.console-readout b{color:var(--ops-muted);font-size:12px;text-transform:uppercase;letter-spacing:.1em}.console-readout strong{font-size:34px;letter-spacing:-.06em}.console-readout span{grid-column:1/-1;color:#08724c;font-size:12px;font-weight:950}.product-section{padding:50px 0}.product-section .section-kicker h2{max-width:850px}.ops-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px}.ops-grid article,.product-card,.ops-toolbar,.square-intro,.runtime-card{border:1px solid var(--ops-line);border-radius:28px;background:var(--ops-panel);box-shadow:0 18px 52px rgba(43,31,42,.08)}.ops-grid article{padding:22px}.ops-grid b{display:inline-flex;margin-bottom:14px;color:var(--ops-pink);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:20px}.ops-grid h3{margin:0 0 8px;font-size:20px;letter-spacing:-.035em}.ops-grid p{margin:0;color:var(--ops-muted);line-height:1.7}.product-split{display:grid;grid-template-columns:1.08fr .92fr;gap:18px;align-items:stretch}.product-card{padding:30px}.product-card h2{margin:8px 0 12px;font-size:clamp(30px,4.2vw,54px);line-height:1;letter-spacing:-.06em}.product-card p,.product-card li{color:var(--ops-muted);line-height:1.75}.dark-card{background:linear-gradient(135deg,#211a21,#34243a);color:#fff}.dark-card span{color:#ffb7c6;font-size:12px;font-weight:950;text-transform:uppercase;letter-spacing:.12em}.dark-card p{color:rgba(255,255,255,.72)}.checklist-card ul{margin:14px 0 0;padding:0;list-style:none}.checklist-card li{position:relative;padding:10px 0 10px 30px;border-bottom:1px solid var(--ops-line);font-weight:850}.checklist-card li:before{content:"";position:absolute;left:0;top:15px;width:16px;height:16px;border-radius:50%;background:linear-gradient(135deg,var(--ops-pink),var(--ops-blue))}.product-page-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:48px 0 18px}.product-page-head h1{font-size:clamp(42px,6vw,76px)}.ops-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;margin-bottom:20px}.ops-toolbar strong{display:block;font-size:20px}.ops-toolbar span,.square-intro span{display:block;margin-top:4px;color:var(--ops-muted);font-size:13px;font-weight:850}.toolbar-actions{display:flex;gap:10px;flex-wrap:wrap}.product-gallery{gap:22px}.square-intro{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;margin-bottom:20px}.runtime-card{padding:18px;min-width:220px}.runtime-card strong{display:block;font-size:13px;color:var(--ops-muted);text-transform:uppercase;letter-spacing:.1em}.runtime-card span{display:block;margin-top:8px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;word-break:break-all}.install-steps{margin:14px 0 0;padding-left:22px}.install-steps li{padding:7px 0}.download-matrix{display:grid;gap:12px}.download-matrix a{display:block;padding:22px;border:1px solid var(--ops-line);border-radius:24px;background:#fff;box-shadow:0 16px 40px rgba(43,31,42,.07);transition:transform .16s ease,box-shadow .16s ease}.download-matrix a:hover{transform:translateY(-2px);box-shadow:0 20px 54px rgba(43,31,42,.11)}.download-matrix strong{display:block;font-size:22px}.download-matrix span{display:block;margin-top:8px;color:var(--ops-muted);font-size:13px;font-weight:850}.download-matrix .disabled-download{opacity:.48;cursor:not-allowed}.download-matrix .disabled-download:hover{transform:none;box-shadow:0 16px 40px rgba(43,31,42,.07)}.small-grid{grid-template-columns:repeat(3,1fr)}.product-footer{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:26px 0 34px;color:var(--ops-muted);font-size:12px}.product-footer strong{color:var(--ops-ink)}.product-footer #apiBaseText{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media(max-width:1080px){.product-hero,.product-split,.product-page-head{grid-template-columns:1fr;display:grid}.product-page-head{align-items:start}.product-actions.compact{justify-content:flex-start}.ops-grid{grid-template-columns:1fr 1fr}.product-console{max-width:620px}.ops-toolbar,.square-intro{align-items:flex-start;flex-direction:column}.toolbar-actions{width:100%}.toolbar-actions .secondaryButton{flex:1}}
@media(max-width:720px){.product-topbar .petdex-topbar-inner{width:min(100% - 24px,1240px)}.product-hero{min-height:auto;padding:36px 0 24px;grid-template-columns:1fr}.product-hero-copy h1,.product-page-head h1{font-size:clamp(40px,14vw,62px)}.product-hero-copy p,.product-page-head p{font-size:16px}.console-stage{min-height:340px;padding:18px}.sprite-film{grid-template-columns:repeat(3,1fr)}.sprite-film i{height:48px}.ops-grid,.small-grid{grid-template-columns:1fr}.product-card{padding:22px}.product-section{padding:34px 0}.product-actions .primaryButton,.product-actions .secondaryButton,.toolbar-actions .secondaryButton{width:100%}.product-footer{align-items:flex-start;flex-direction:column}.product-footer #apiBaseText{max-width:100%}}

/* React full rebuild surface */
.login-action.as-button{appearance:none;border:1px solid var(--line);cursor:pointer;background:#231522;color:#fff;border-radius:999px;min-height:42px;padding:0 16px;font-weight:950;box-shadow:0 12px 24px rgba(35,21,34,.18)}
.empty-state{grid-column:1/-1;min-height:160px;display:grid;place-items:center;text-align:center;padding:24px;border:1px dashed rgba(122,107,117,.30);border-radius:22px;color:var(--muted);background:rgba(255,255,255,.56);font-weight:850;line-height:1.6}.product-pet-card{border:1px solid var(--line);border-radius:28px;overflow:hidden;background:rgba(255,255,255,.82);box-shadow:0 18px 50px rgba(120,78,115,.09)}.pet-card-art{min-height:190px;display:grid;place-items:center;padding:18px;background:linear-gradient(145deg,#fff,#fff0f5);border-bottom:1px solid var(--line)}.pet-card-art img{width:100%;max-height:210px;object-fit:contain}.pet-card-body{padding:18px;display:grid;gap:10px}.pet-card-body h3{margin:0;font-size:22px;letter-spacing:-.04em}.pet-card-body p{margin:0;color:var(--muted)}.action-card{border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.78);padding:14px;margin-top:14px;box-shadow:0 12px 34px rgba(76,49,75,.06)}.action-card-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.action-card-head span{color:var(--muted);font-size:12px;font-weight:900}.action-card-head button{border:1px solid rgba(217,74,91,.22);border-radius:999px;background:rgba(217,74,91,.08);color:#9d2636;font-weight:950;cursor:pointer;padding:6px 10px}.frame-strip{display:grid;grid-template-columns:repeat(auto-fill,minmax(56px,1fr));gap:8px;padding:10px;border-radius:18px;background:#211b22}.frame-strip img{aspect-ratio:1;object-fit:contain;border-radius:12px;background:conic-gradient(from 45deg,#fff 0 25%,#f2edf5 0 50%,#fff 0 75%,#f2edf5 0);background-size:14px 14px}.modal-backdrop{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:22px;background:rgba(37,24,33,.38);backdrop-filter:blur(10px)}.auth-panel{position:relative;width:min(480px,100%);max-height:calc(100vh - 44px);overflow:auto;border:1px solid rgba(255,255,255,.82);border-radius:32px;background:linear-gradient(145deg,rgba(255,255,255,.98),rgba(255,246,249,.96));box-shadow:0 30px 90px rgba(60,35,58,.28);padding:26px;display:grid;gap:14px}.auth-panel h2{margin:4px 0 0;font-size:30px;letter-spacing:-.05em}.auth-panel p{margin:0;color:var(--muted);line-height:1.7}.auth-panel label{display:grid;gap:8px}.modal-close{position:absolute;right:18px;top:16px;width:38px;height:38px;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.78);color:var(--ink);font-size:24px;line-height:1;cursor:pointer}.primaryButton.full,.secondaryButton.full{width:100%}.product-auth .product-page-head{min-height:58vh;align-items:center}.runtime-card{padding:20px;border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.78);box-shadow:0 14px 40px rgba(120,78,115,.08)}.runtime-card strong,.runtime-card span{display:block}.runtime-card span{margin-top:6px;color:var(--muted);font-size:13px}.download-matrix{display:grid;gap:12px}.download-matrix a{display:grid;gap:8px;padding:20px;border-radius:22px;background:#fff;border:1px solid var(--line);font-weight:950}.download-matrix span{color:var(--muted);font-size:12px}.disabled-download{opacity:.55}.install-steps{color:var(--muted);line-height:1.8;font-weight:800}.ops-toolbar,.square-intro{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px;margin-bottom:18px}.ops-toolbar strong,.square-intro strong{display:block;font-size:20px}.ops-toolbar span,.square-intro span{color:var(--muted);font-size:13px}.toolbar-actions{display:flex;gap:10px;flex-wrap:wrap}@media(max-width:720px){.ops-toolbar,.square-intro{align-items:flex-start;flex-direction:column}.action-card-head{align-items:flex-start;flex-direction:column}.frame-strip{grid-template-columns:repeat(auto-fill,minmax(48px,1fr))}.modal-backdrop{padding:12px}.auth-panel{border-radius:24px;padding:20px}}

/* React workbench keeps action controls visible and uses disabled state for availability. */
body[data-page="create"] .secondary-actions{display:flex!important}
body[data-page="create"] .secondary-actions .btn.ghost:last-child{display:inline-flex!important}

/* App-console redesign: operational product UI, not marketing pages */
body.product-page{background:#f4f6fb;color:#1f2430}.product-topbar{background:rgba(246,248,252,.94)!important;border-bottom:1px solid #dce2ec!important;box-shadow:none!important}.product-topbar .petdex-topbar-inner{width:min(1440px,calc(100% - 40px))!important}.product-page .brand-mark{border-radius:10px;background:#1f2430!important;box-shadow:none!important}.petdex-brand small{letter-spacing:.08em;text-transform:uppercase}.product-page .nav a{border-radius:10px;color:#596273}.product-page .nav a.active,.product-page .nav a:hover{background:#fff;border-color:#dce2ec;box-shadow:none}.login-action.as-button{border-radius:10px;background:#fff;color:#1f2430;box-shadow:none}.runtime-pill{border-radius:10px;background:#e9f8f0;color:#08724c}.product-footer{width:min(1440px,calc(100% - 40px));padding:18px 0 26px;border-top:1px solid #dce2ec}.app-dashboard,.app-module{width:min(1440px,calc(100% - 40px));padding:24px 0 34px}.app-commandbar,.module-header{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:18px;padding:0 0 14px;border-bottom:1px solid #dce2ec}.app-breadcrumb,.panel-label{display:inline-flex;color:#667085;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.app-commandbar h1,.module-header h1{margin:8px 0 8px;max-width:none;font-size:clamp(30px,4vw,48px);line-height:1.02;letter-spacing:-.045em}.app-commandbar p,.module-header p{max-width:760px;margin:0;color:#667085;font-size:15px;line-height:1.65}.command-actions{display:flex;gap:10px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.command-actions .primaryButton,.command-actions .secondaryButton,.console-panel a,.task-row a,.toolbar-right a,.delivery-card a{border-radius:10px;min-height:40px;padding:0 14px;font-size:13px}.command-actions .primaryButton{background:#1f2430;box-shadow:none}.command-actions .secondaryButton{box-shadow:none}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}.metric-grid article,.console-panel,.module-toolbar{border:1px solid #dce2ec;border-radius:18px;background:#fff;box-shadow:0 10px 26px rgba(31,36,48,.04)}.metric-grid article{padding:16px}.metric-grid span{display:block;color:#667085;font-size:12px;font-weight:900}.metric-grid strong{display:block;margin:8px 0 4px;font-size:34px;letter-spacing:-.05em}.metric-grid small{color:#8a93a3;font-weight:800}.console-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:14px;margin-top:14px}.lower-layout{grid-template-columns:minmax(0,1fr) minmax(360px,.52fr)}.console-panel{padding:18px}.console-primary-panel{background:linear-gradient(180deg,#fff,#fbfcff)}.panel-title-row{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:14px}.panel-title-row h2{margin:4px 0 0;font-size:22px;letter-spacing:-.035em}.panel-title-row>a{display:inline-flex;align-items:center;border:1px solid #dce2ec;background:#fff;color:#1f2430;font-weight:950}.task-stack{display:grid;gap:10px}.task-row{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px;border:1px solid #e6ebf2;border-radius:14px;background:#fff}.task-row.active{border-color:#b9c6ff;background:#f7f8ff}.task-row b{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#eef1f6;color:#596273;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.task-row strong{display:block;font-size:14px}.task-row span{display:block;color:#667085;font-size:12px;line-height:1.5}.task-row>a,.task-row>span:last-child{justify-self:end;color:#1f2430;font-size:12px;font-weight:950}.qa-list{display:grid;gap:10px;margin:0;padding:0;list-style:none}.qa-list li{padding:12px;border:1px solid #e6ebf2;border-radius:14px;background:#fbfcff}.qa-list b{display:block;margin-bottom:4px}.qa-list span{color:#667085;font-size:13px;line-height:1.55}.pipeline-table{display:grid;border:1px solid #e6ebf2;border-radius:14px;overflow:hidden}.pipeline-head,.pipeline-row{display:grid;grid-template-columns:1.2fr .9fr .7fr .7fr;gap:10px;align-items:center;padding:11px 13px}.pipeline-head{background:#f1f4f8;color:#667085;font-size:12px;font-weight:950}.pipeline-row{border-top:1px solid #e6ebf2;background:#fff;font-size:13px}.pipeline-row strong{font-weight:950}.pipeline-row span,.pipeline-row time{color:#667085}.recent-panel .pet-card{box-shadow:none;border-radius:14px;margin-top:10px}.recent-panel .pet-card-art{display:none}.recent-panel .pet-card-body{padding:12px}.dense-empty{min-height:110px}.module-toolbar{display:grid;grid-template-columns:repeat(3,160px) minmax(0,1fr);align-items:center;gap:10px;padding:14px;margin:16px 0}.module-toolbar strong{display:block;font-size:26px;letter-spacing:-.04em}.module-toolbar span{display:block;color:#667085;font-size:12px;font-weight:900}.toolbar-right{justify-self:end;display:flex;gap:10px}.toolbar-right a{display:inline-flex;align-items:center;border:1px solid #dce2ec;background:#fff;font-weight:950}.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;margin-top:14px}.asset-grid .product-pet-card{border-color:#dce2ec;border-radius:18px;box-shadow:0 10px 26px rgba(31,36,48,.04)}.asset-grid .pet-card-art{min-height:150px;background:#f8fafc}.module-empty{min-height:180px;margin-top:14px}.release-rules{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:16px 0}.release-rules>div{padding:12px;border:1px solid #e6ebf2;border-radius:14px;background:#fbfcff}.release-rules b{display:block}.release-rules span{display:block;margin-top:4px;color:#667085;font-size:13px}.delivery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:16px 0}.delivery-card span{color:#667085;font-size:12px;font-weight:950;text-transform:uppercase}.delivery-card strong{display:block;margin:8px 0;font-size:24px;letter-spacing:-.04em}.delivery-card p{min-height:58px;color:#667085;line-height:1.6}.delivery-card a{display:inline-flex;align-items:center;background:#1f2430;color:#fff;font-weight:950}.muted-card{opacity:.62}.handoff-panel{margin-top:14px}.compact-table .pipeline-head,.compact-table .pipeline-row{grid-template-columns:.4fr 1.4fr .7fr .7fr}.auth-module{min-height:55vh}.product-hero,.product-section,.product-page-head{display:none!important}@media(max-width:980px){.app-commandbar,.module-header,.console-layout{display:grid;grid-template-columns:1fr}.metric-grid,.delivery-grid,.release-rules{grid-template-columns:1fr 1fr}.module-toolbar{grid-template-columns:repeat(3,1fr)}.toolbar-right{grid-column:1/-1;justify-self:start}}@media(max-width:640px){.app-dashboard,.app-module,.product-topbar .petdex-topbar-inner,.product-footer{width:min(100% - 24px,1440px)!important}.metric-grid,.delivery-grid,.release-rules,.module-toolbar{grid-template-columns:1fr}.pipeline-head,.pipeline-row,.compact-table .pipeline-head,.compact-table .pipeline-row{grid-template-columns:1fr;gap:4px}.task-row{grid-template-columns:36px 1fr}.task-row>a,.task-row>span:last-child{grid-column:2;justify-self:start}.command-actions,.command-actions .primaryButton,.command-actions .secondaryButton{width:100%}}

/* 2026-07-01 Frame Studio workstation layout */
:root{
  --frame-bg:#f7f1e7;
  --frame-paper:#fffaf1;
  --frame-ink:#161719;
  --frame-muted:#706a62;
  --frame-line:rgba(22,23,25,.13);
  --frame-blue:#5b7cfa;
  --frame-mint:#72e6b1;
  --frame-coral:#ff7a5c;
  --frame-shadow:0 24px 70px rgba(22,23,25,.11);
  --frame-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
}
body.product-page{
  min-height:100vh;
  background:
    radial-gradient(circle at 8% 6%,rgba(91,124,250,.13),transparent 30rem),
    radial-gradient(circle at 95% 12%,rgba(114,230,177,.16),transparent 28rem),
    linear-gradient(135deg,#fbf4e8 0%,#f6efe4 52%,#eef3ff 100%)!important;
  color:var(--frame-ink)!important;
  font-family:Inter,"PingFang SC","Microsoft YaHei",system-ui,sans-serif;
}
.studio-app-frame{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh;gap:0}.studio-sidebar{position:sticky;top:0;height:100vh;padding:22px 18px;display:flex;flex-direction:column;border-right:1px solid var(--frame-line);background:rgba(255,250,241,.78);backdrop-filter:blur(22px);z-index:20}.studio-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--frame-ink);padding:10px 8px 22px}.studio-brand .brand-mark{width:44px;height:44px;border-radius:15px;display:grid;place-items:center;background:var(--frame-ink)!important;color:#fff;font-weight:950;box-shadow:8px 8px 0 rgba(91,124,250,.18)!important}.studio-brand strong{display:block;font-size:18px;letter-spacing:-.04em}.studio-brand small{display:block;color:var(--frame-muted);font-family:var(--frame-mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em}.studio-nav{display:grid;gap:8px;margin-top:10px}.studio-nav a{position:relative;display:flex;align-items:center;gap:10px;min-height:46px;padding:0 13px;border:1px solid transparent;border-radius:16px;color:#3a3835;text-decoration:none;font-weight:950}.studio-nav a:before{content:"";width:8px;height:8px;border-radius:50%;background:rgba(22,23,25,.18)}.studio-nav a.active,.studio-nav a:hover{background:#fff;border-color:var(--frame-line);box-shadow:0 12px 28px rgba(22,23,25,.07)}.studio-nav a.active:before{background:var(--frame-blue);box-shadow:0 0 0 5px rgba(91,124,250,.14)}.studio-sidebar-card{margin-top:auto;padding:16px;border:1px solid var(--frame-line);border-radius:22px;background:#fff;box-shadow:0 18px 48px rgba(22,23,25,.08)}.studio-sidebar-card p{margin:12px 0;color:var(--frame-muted);font-size:12px;line-height:1.65}.studio-sidebar-card .login-action{width:100%;justify-content:center;border-radius:14px;background:var(--frame-ink)!important;color:#fff!important}.runtime-pill{display:inline-flex;align-items:center;gap:6px;border-radius:999px!important;padding:7px 10px;background:rgba(255,122,92,.12)!important;color:#a43a24!important;border:1px solid rgba(255,122,92,.18);font-family:var(--frame-mono);font-size:11px;font-weight:900}.runtime-pill.ok{background:rgba(114,230,177,.18)!important;color:#146a4a!important;border-color:rgba(114,230,177,.35)}.studio-main-frame{min-width:0;display:flex;flex-direction:column}.studio-content{flex:1;padding:26px clamp(18px,3vw,42px) 18px}.studio-footer{width:auto!important;margin:0 clamp(18px,3vw,42px);padding:18px 0 28px!important;border-top:1px solid var(--frame-line)!important;color:var(--frame-muted)}.studio-page{width:min(1500px,100%);margin:0 auto}.studio-page-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:start;margin-bottom:18px}.studio-page-head h1{margin:8px 0 10px;font-size:clamp(38px,5.4vw,78px);line-height:.88;letter-spacing:-.08em;color:var(--frame-ink)}.studio-page-head p{margin:0;max-width:790px;color:var(--frame-muted);font-size:16px;line-height:1.75}.app-breadcrumb,.panel-label{font-family:var(--frame-mono);font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#6a66a8}.primaryButton,.secondaryButton,.btn{border-radius:15px!important;min-height:42px;font-weight:950!important}.primaryButton,.btn:not(.ghost):not(.secondary):not(.danger){background:var(--frame-ink)!important;color:#fff!important;box-shadow:8px 8px 0 rgba(91,124,250,.18)!important}.secondaryButton,.btn.secondary,.btn.ghost{background:#fff!important;color:var(--frame-ink)!important;border:1px solid var(--frame-line)!important;box-shadow:none!important}.btn.danger{background:rgba(255,122,92,.12)!important;color:#9d321f!important;border:1px solid rgba(255,122,92,.28)!important}.workbench-card,.metric-grid article,.module-toolbar,.console-panel{border:1px solid var(--frame-line)!important;border-radius:26px!important;background:rgba(255,250,241,.9)!important;box-shadow:var(--frame-shadow)!important}.workbench-card{padding:20px}.metric-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:18px 0}.metric-grid article{padding:18px;position:relative;overflow:hidden}.metric-grid article:after{content:"";position:absolute;right:14px;top:14px;width:36px;height:48px;border-left:7px dotted rgba(22,23,25,.12);opacity:.8}.metric-grid span,.module-toolbar span{color:var(--frame-muted)!important;font-family:var(--frame-mono);font-size:11px!important;text-transform:uppercase}.metric-grid strong,.module-toolbar strong{display:block;color:var(--frame-ink);font-size:36px;letter-spacing:-.06em}.metric-grid small{color:var(--frame-muted)}.console-layout{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:16px;margin-top:16px}.lower-layout{grid-template-columns:minmax(0,1fr) minmax(360px,.55fr)}.panel-title,.panel-title-row{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;margin-bottom:14px}.panel-title h3,.panel-title-row h2{margin:0;color:var(--frame-ink);font-size:22px;letter-spacing:-.045em}.panel-subtitle{margin:4px 0 0;color:var(--frame-muted);font-size:13px}.task-stack,.qa-list{display:grid;gap:10px}.task-row{display:grid;grid-template-columns:44px minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px;border:1px solid var(--frame-line);border-radius:18px;background:#fff}.task-row.active{background:linear-gradient(135deg,#fff,#edf2ff);border-color:rgba(91,124,250,.42)}.task-row b{display:grid;place-items:center;width:36px;height:36px;border-radius:13px;background:var(--frame-ink);color:#fff;font-family:var(--frame-mono)}.task-row strong{display:block}.task-row span,.qa-list span{display:block;color:var(--frame-muted);font-size:13px;line-height:1.55}.qa-list{padding:0;margin:0;list-style:none}.qa-list li,.release-rules>div{padding:13px;border:1px solid var(--frame-line);border-radius:18px;background:#fff}.pipeline-table{border:1px solid var(--frame-line)!important;border-radius:20px!important;overflow:hidden}.pipeline-head,.pipeline-row{display:grid;grid-template-columns:1.2fr .9fr .7fr .7fr;gap:10px;align-items:center;padding:12px 14px}.pipeline-head{background:#eee8dc;color:var(--frame-muted);font-family:var(--frame-mono);font-size:11px;font-weight:950;text-transform:uppercase}.pipeline-row{background:#fff;border-top:1px solid var(--frame-line);font-size:13px}.pipeline-row span,.pipeline-row time{color:var(--frame-muted)}.workbench-grid{display:grid;grid-template-columns:300px minmax(420px,1fr) 320px;gap:16px;align-items:start}.input-panel{position:sticky;top:24px}.field{display:grid;gap:8px;margin:13px 0}label{color:#3c3833!important;font-weight:950}.preview{min-height:176px;border:1px dashed rgba(91,124,250,.38)!important;border-radius:22px!important;background:linear-gradient(45deg,rgba(22,23,25,.035) 25%,transparent 25%,transparent 75%,rgba(22,23,25,.035) 75%),linear-gradient(45deg,rgba(22,23,25,.035) 25%,transparent 25%,transparent 75%,rgba(22,23,25,.035) 75%)!important;background-position:0 0,12px 12px!important;background-size:24px 24px!important}.input-hints{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}.input-hints span{padding:7px 9px;border-radius:999px;background:rgba(114,230,177,.16);color:#116347;font-size:12px;font-weight:950}.safe-canvas{padding:18px;border:1px solid var(--frame-line);border-radius:28px;background:#fff}.safe-canvas-grid{position:relative;min-height:460px;display:grid;place-items:center;overflow:hidden;border-radius:22px;background-color:#f9fafb;background-image:linear-gradient(45deg,#e4e7ec 25%,transparent 25%),linear-gradient(-45deg,#e4e7ec 25%,transparent 25%),linear-gradient(45deg,transparent 75%,#e4e7ec 75%),linear-gradient(-45deg,transparent 75%,#e4e7ec 75%);background-size:28px 28px;background-position:0 0,0 14px,14px -14px,-14px 0}.safe-canvas-grid img{max-width:74%;max-height:360px;object-fit:contain;filter:drop-shadow(0 18px 32px rgba(22,23,25,.18))}.safe-line{position:absolute;border-color:var(--frame-coral);opacity:.78}.safe-line.top,.safe-line.bottom{left:7%;right:7%;border-top:2px dashed var(--frame-coral)}.safe-line.top{top:7%}.safe-line.bottom{bottom:7%}.safe-line.left,.safe-line.right{top:7%;bottom:7%;border-left:2px dashed var(--frame-coral)}.safe-line.left{left:7%}.safe-line.right{right:7%}.canvas-placeholder{display:grid;gap:6px;text-align:center;color:var(--frame-muted)}.candidate-dock{margin-top:14px}.candidates{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(126px,1fr))!important;gap:10px!important;min-height:0!important}.candidate{border:1px solid var(--frame-line)!important;border-radius:18px!important;background:#fff!important;overflow:hidden}.candidate.selected{border-color:var(--frame-blue)!important;box-shadow:0 0 0 4px rgba(91,124,250,.14)!important}.candidate img{height:116px!important;object-fit:contain!important;background:#f7f8fb}.inspector-panel{position:sticky;top:24px}.quality-stack{display:grid;grid-template-columns:1fr;gap:10px;margin:14px 0}.quality-stack div{display:flex;justify-content:space-between;align-items:center;padding:13px;border:1px solid var(--frame-line);border-radius:18px;background:#fff}.quality-stack b{font-family:var(--frame-mono);font-size:20px}.quality-stack span{color:var(--frame-muted);font-weight:900}.inspector-actions{display:grid!important;grid-template-columns:1fr!important;gap:9px!important}.frame-timeline-panel{margin-top:16px}.action-preview{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}.action-card{border:1px solid var(--frame-line)!important;border-radius:22px!important;background:#fff!important;padding:14px!important;overflow:hidden}.action-card-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.action-card-head span{font-family:var(--frame-mono);font-size:11px;color:var(--frame-muted)}.frame-strip{display:flex;gap:8px;overflow:auto;padding:10px;border-radius:16px;background:#f1eee7}.frame-strip img{width:64px;height:64px;object-fit:contain;border-radius:12px;background:#fff;border:1px solid rgba(22,23,25,.08)}.studio-metrics-strip{display:grid!important;grid-template-columns:repeat(3,160px) minmax(0,1fr)!important;gap:12px!important;padding:15px!important;margin:16px 0!important}.toolbar-right{justify-self:end;display:flex;gap:10px}.toolbar-right a{display:inline-flex;align-items:center;border:1px solid var(--frame-line);background:#fff;color:var(--frame-ink);font-weight:950;text-decoration:none}.production-asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(285px,1fr));gap:16px;margin-top:16px}.asset-card-shell{border:1px solid var(--frame-line);border-radius:28px;background:rgba(255,255,255,.62);padding:10px;box-shadow:0 18px 48px rgba(22,23,25,.08)}.asset-card-meta{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:5px 8px 10px}.asset-card-meta span{padding:6px 9px;border-radius:999px;background:rgba(91,124,250,.12);color:#314fb8;font-size:12px;font-weight:950}.asset-card-meta b{font-family:var(--frame-mono);font-size:11px;color:var(--frame-muted)}.product-pet-card{border-radius:22px!important;border:1px solid var(--frame-line)!important;background:#fff!important;box-shadow:none!important;overflow:hidden}.pet-card-art{min-height:176px!important;background:linear-gradient(45deg,#f0f2f5 25%,transparent 25%,transparent 75%,#f0f2f5 75%),linear-gradient(45deg,#f0f2f5 25%,#fff 25%,#fff 75%,#f0f2f5 75%)!important;background-size:28px 28px!important;background-position:0 0,14px 14px!important}.pet-card-art img{object-fit:contain!important;padding:14px}.pet-card-body{padding:14px!important}.release-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:16px;align-items:start}.release-rules{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;margin:0!important}.release-gallery{min-width:0}.delivery-grid{display:grid!important;grid-template-columns:repeat(3,1fr);gap:16px;margin:16px 0}.delivery-card{position:relative;min-height:210px}.delivery-card span{font-family:var(--frame-mono);color:var(--frame-muted);font-size:11px;text-transform:uppercase;font-weight:950}.delivery-card strong{display:block;margin:10px 0;font-size:28px;letter-spacing:-.05em}.delivery-card p{color:var(--frame-muted);line-height:1.65}.handoff-panel{margin-top:16px}.account-board{max-width:980px}.account-card{min-height:360px;display:grid;align-content:center;justify-items:start;background:linear-gradient(135deg,#fffaf1,#edf2ff)!important}.account-card h2{margin:14px 0 10px;font-size:clamp(32px,5vw,58px);line-height:.95;letter-spacing:-.07em}.account-card p{max-width:620px;color:var(--frame-muted);line-height:1.8}.auth-panel{border-radius:28px!important;background:var(--frame-paper)!important;border:1px solid var(--frame-line)!important;box-shadow:var(--frame-shadow)!important}.modal-backdrop{backdrop-filter:blur(10px)}.empty-state{border-radius:24px!important;border:1px dashed var(--frame-line)!important;background:rgba(255,255,255,.6)!important;color:var(--frame-muted)!important}.status-panel{border-radius:20px!important;background:#fff!important;border:1px solid var(--frame-line)!important}.progress span{background:linear-gradient(90deg,var(--frame-blue),var(--frame-mint))!important}.notice{border-radius:18px!important;background:rgba(91,124,250,.1)!important;border:1px solid rgba(91,124,250,.18)!important;color:#314fb8!important}@media(max-width:1180px){.studio-app-frame{grid-template-columns:1fr}.studio-sidebar{position:relative;height:auto;display:grid;grid-template-columns:1fr;gap:10px}.studio-nav{grid-template-columns:repeat(5,minmax(0,1fr))}.studio-sidebar-card{display:none}.workbench-grid,.console-layout,.lower-layout,.release-layout{grid-template-columns:1fr}.input-panel,.inspector-panel{position:static}.safe-canvas-grid{min-height:360px}.delivery-grid{grid-template-columns:1fr 1fr!important}}@media(max-width:720px){.studio-content{padding:18px 12px}.studio-page-head{grid-template-columns:1fr}.studio-page-head h1{font-size:44px}.studio-nav{grid-template-columns:1fr 1fr}.metric-grid,.studio-metrics-strip,.delivery-grid{grid-template-columns:1fr!important}.toolbar-right{justify-self:start;grid-column:1/-1;flex-wrap:wrap}.safe-canvas-grid{min-height:280px}.production-asset-grid{grid-template-columns:1fr}.pipeline-head,.pipeline-row{grid-template-columns:1fr 1fr}.pipeline-head span:nth-child(n+3),.pipeline-row span:nth-child(n+3),.pipeline-row time{display:none}}

/* 2026-07-01 Image reference alignment: dark nav + compact white studio */
body.product-page{
  background:#eef2f5!important;
  color:#12151b!important;
}
.studio-app-frame{grid-template-columns:244px minmax(0,1fr);background:#eef2f5}.studio-sidebar{background:linear-gradient(180deg,#111923 0%,#0b1117 100%)!important;border-right:0!important;color:#eaf0f8;padding:22px 14px;box-shadow:18px 0 48px rgba(8,13,18,.16)}.studio-brand{color:#fff!important;padding:8px 10px 24px}.studio-brand .brand-mark{background:#1e63ff!important;border-radius:14px;box-shadow:0 12px 28px rgba(30,99,255,.35)!important}.studio-brand strong{font-size:21px;color:#fff}.studio-brand small{color:#8fa0b4}.studio-nav a{color:#c7d2df!important;border-radius:9px;min-height:42px;padding:0 12px}.studio-nav a:before{width:18px;height:18px;border-radius:6px;background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}.studio-nav a.active,.studio-nav a:hover{background:linear-gradient(180deg,#2f78ff,#1e5cff)!important;color:#fff!important;border-color:rgba(255,255,255,.14)!important;box-shadow:0 10px 24px rgba(30,99,255,.36)!important}.studio-nav a.active:before{background:rgba(255,255,255,.9);box-shadow:none}.studio-sidebar-card{background:rgba(255,255,255,.04)!important;border:1px solid rgba(255,255,255,.14)!important;border-radius:14px!important;box-shadow:none!important;color:#cbd6e3}.studio-sidebar-card p{color:#95a4b8}.studio-sidebar-card .login-action{background:#2f78ff!important;border:0!important;border-radius:8px!important}.runtime-pill{background:#10251f!important;color:#71e8b0!important;border-color:rgba(114,230,177,.25)!important;border-radius:8px!important}.runtime-pill.ok{background:#10251f!important;color:#71e8b0!important}.studio-content{padding:18px 24px 14px;background:#eef2f5}.studio-page{width:min(1540px,100%)}.studio-page-head{min-height:74px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:16px;margin-bottom:14px;padding:0 0 10px}.studio-page-head h1{margin:3px 0 5px!important;font-size:clamp(28px,3.2vw,44px)!important;line-height:1!important;letter-spacing:-.05em!important;color:#11151b!important}.studio-page-head p{max-width:720px;font-size:13px!important;line-height:1.55!important;color:#697386!important}.app-breadcrumb,.panel-label{color:#406cff!important;font-size:11px!important;font-family:var(--frame-mono);letter-spacing:.08em}.inspection-legend{display:flex!important;gap:8px!important;padding:0!important;background:transparent!important;border:0!important}.inspection-legend span{display:flex;align-items:center;gap:7px;min-height:42px;padding:0 14px!important;border-radius:12px!important;background:#fff!important;border:1px solid #dde3eb!important;box-shadow:0 8px 24px rgba(18,21,27,.05);font-weight:950;color:#162033}.inspection-legend b{color:#ff5d7a;font-family:var(--frame-mono)}.workbench-card,.metric-grid article,.module-toolbar,.console-panel{background:#fff!important;border:1px solid #dbe2eb!important;border-radius:14px!important;box-shadow:0 12px 32px rgba(16,24,40,.06)!important}.workbench-card{padding:16px!important}.panel-title,.panel-title-row{margin-bottom:12px!important}.panel-title h3,.panel-title-row h2{font-size:19px!important;letter-spacing:-.03em!important}.panel-subtitle{font-size:12px!important;color:#6b7484!important}.primaryButton,.btn:not(.ghost):not(.secondary):not(.danger){background:#246bff!important;color:#fff!important;border:0!important;border-radius:8px!important;box-shadow:0 8px 18px rgba(36,107,255,.24)!important}.secondaryButton,.btn.secondary,.btn.ghost{background:#fff!important;border:1px solid #dbe2eb!important;border-radius:8px!important;color:#172033!important}.btn.danger{border-radius:8px!important;background:#fff3ef!important;color:#cf4d32!important;border:1px solid #ffcbbd!important;box-shadow:none!important}.command-actions .primaryButton,.command-actions .secondaryButton{min-height:38px!important;border-radius:8px!important}.metric-grid{gap:10px!important;margin:12px 0!important}.metric-grid article{padding:14px!important}.metric-grid article:after{display:none}.metric-grid strong,.module-toolbar strong{font-size:28px!important}.metric-grid span,.module-toolbar span{color:#6b7484!important}.console-layout{gap:12px!important;margin-top:12px!important}.workbench-grid{grid-template-columns:300px minmax(440px,1fr) 300px;gap:12px!important}.input-panel,.inspector-panel{top:18px}.field{margin:10px 0!important}.field input,.field select,input,select{border-radius:8px!important;border:1px solid #dbe2eb!important;background:#fff!important;min-height:38px;padding:9px 11px!important}.file-trigger{border-radius:8px!important;background:#fff!important;border:1px solid #c9d6eb!important;color:#235bd7!important}.preview{border-radius:10px!important;border:1px dashed #cfd8e7!important;background-color:#fafcff!important}.safe-canvas{border-radius:12px!important;border:1px solid #dbe2eb!important;padding:12px!important}.safe-canvas-grid{min-height:430px;border-radius:10px!important;background-size:22px 22px!important;background-position:0 0,0 11px,11px -11px,-11px 0!important}.safe-canvas-grid img{max-width:76%;max-height:340px}.safe-line.top,.safe-line.bottom{border-top:2px dashed #30d49a!important}.safe-line.left,.safe-line.right{border-left:2px dashed #30d49a!important}.safe-line{opacity:.88!important}.candidate-dock{margin-top:12px}.candidates{grid-template-columns:repeat(auto-fill,minmax(112px,1fr))!important;gap:8px!important}.candidate{border-radius:10px!important}.candidate img{height:96px!important}.candidate.selected{border-color:#246bff!important;box-shadow:0 0 0 3px rgba(36,107,255,.12)!important}.status-panel{border-radius:12px!important;background:#f8fafc!important;border:1px solid #dbe2eb!important}.quality-stack{gap:8px!important}.quality-stack div{border-radius:10px!important;border:1px solid #dbe2eb!important}.inspector-actions{gap:8px!important;grid-template-columns:1fr 1fr!important}.inspector-actions .btn{min-height:40px!important}.frame-timeline-panel{margin-top:12px;background:#121821!important;border-color:#121821!important;color:#fff!important}.frame-timeline-panel .panel-title h3,.frame-timeline-panel .panel-subtitle{color:#fff!important}.frame-timeline-panel .empty-state{background:#0f151d!important;border-color:rgba(255,255,255,.16)!important;color:#aab7c8!important}.action-card{border-radius:10px!important;border:1px solid rgba(255,255,255,.12)!important;background:#fff!important}.frame-strip{background:#0d1219!important;border-radius:8px!important}.frame-strip img{border-radius:6px!important;width:58px!important;height:58px!important}.studio-metrics-strip{grid-template-columns:repeat(3,170px) minmax(0,1fr)!important;border-radius:14px!important;padding:12px!important}.toolbar-right a{border-radius:8px!important;padding:0 14px;color:#132033!important}.production-asset-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;margin-top:12px}.asset-card-shell{border-radius:14px!important;background:#fff!important;border:1px solid #dbe2eb!important;box-shadow:0 12px 32px rgba(16,24,40,.06)!important;padding:0!important;overflow:hidden}.asset-card-meta{background:#f8fafc;border-bottom:1px solid #e3e8f0;padding:10px 12px!important}.asset-card-meta span{background:#fff0d8!important;color:#a96500!important;border-radius:7px!important}.asset-card-meta b{color:#7a8494}.product-pet-card{border:0!important;border-radius:0!important}.pet-card-art{min-height:132px!important;background-size:20px 20px!important}.pet-card-body{padding:12px!important}.status-pill{border-radius:7px!important;background:#eaf1ff!important;color:#235bd7!important}.row-actions{gap:8px!important}.row-actions .btn,.row-actions a.btn{min-height:34px!important;padding:0 10px!important;font-size:12px!important}.pipeline-table{border-radius:10px!important;border-color:#dbe2eb!important}.pipeline-head{background:#f7f9fc!important;color:#667085!important}.pipeline-row{background:#fff!important}.release-layout{grid-template-columns:310px minmax(0,1fr);gap:12px}.delivery-grid{gap:12px!important}.delivery-card{min-height:190px}.account-card{background:#fff!important;border-radius:14px!important}.studio-footer{margin:0 24px!important;color:#6b7484!important}.empty-state{background:#fff!important;border-color:#dbe2eb!important;color:#687386!important;border-radius:12px!important}.notice{border-radius:10px!important;background:#eaf1ff!important;border-color:#bdd0ff!important;color:#235bd7!important}@media(max-width:1180px){.studio-sidebar{background:#111923!important}.studio-nav{grid-template-columns:repeat(5,minmax(0,1fr))}.workbench-grid{grid-template-columns:1fr}.safe-canvas-grid{min-height:340px}.inspector-actions{grid-template-columns:repeat(3,1fr)!important}}@media(max-width:720px){.studio-content{padding:14px 10px}.studio-page-head{display:grid;grid-template-columns:1fr}.studio-page-head h1{font-size:34px!important}.studio-nav{grid-template-columns:1fr 1fr}.inspection-legend{flex-wrap:wrap}.inspector-actions{grid-template-columns:1fr!important}}

/* 2026-07-01 Reference fidelity pass: compact admin product */
body.product-page{background:#0b1218!important;overflow-x:hidden}.studio-app-frame{grid-template-columns:244px minmax(0,1fr)!important;background:#0b1218!important}.studio-sidebar{width:244px;background:#0b1218!important;padding:24px 14px 16px!important}.studio-brand{padding:0 8px 28px!important}.studio-brand .brand-mark{width:44px!important;height:44px!important;border-radius:12px!important;font-size:20px!important;background:#1f6bff!important}.studio-brand strong{font-size:23px!important;line-height:1;color:#fff!important}.studio-brand small{font-size:10px!important;color:#8b98a8!important;letter-spacing:.08em}.studio-nav{gap:8px!important}.studio-nav a{height:44px!important;min-height:44px!important;border-radius:8px!important;padding:0 13px!important;font-size:14px!important;font-weight:900!important;color:#c8d2df!important}.studio-nav a:before{width:16px!important;height:16px!important;border-radius:4px!important;background:transparent!important;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.22)!important}.studio-nav a.active{background:#236bff!important;color:#fff!important}.studio-nav a.active:before{background:#dce8ff!important;box-shadow:none!important}.studio-sidebar-card{padding:14px!important;border-radius:10px!important;background:#0f171f!important;border:1px solid rgba(255,255,255,.14)!important}.studio-sidebar-card strong{display:block;color:#fff;margin-bottom:10px}.quota-line{display:grid;gap:6px;margin:10px 0 12px;color:#9dafc4;font-size:11px}.quota-line b{height:6px;border-radius:999px;background:linear-gradient(90deg,#25d998 76%,rgba(255,255,255,.16) 76%)}.studio-main-frame{background:#eef2f5!important;border-radius:0!important;min-width:0}.studio-topbar{height:64px;display:flex;align-items:center;justify-content:flex-end;padding:0 22px;background:#eef2f5!important}.studio-topbar-actions{display:flex;align-items:center;gap:12px}.topbar-pill,.topbar-account,.topbar-primary{height:36px;display:inline-flex;align-items:center;gap:8px;border-radius:7px;border:1px solid #d8e0eb;background:#fff;color:#172033;text-decoration:none;padding:0 13px;font-size:12px;font-weight:800}.topbar-pill.ok:after{content:"";width:6px;height:6px;border-radius:50%;background:#21c77c}.topbar-account b{padding:2px 6px;border-radius:999px;background:#eef3ff;color:#246bff;font-size:10px}.topbar-primary{background:#236bff!important;border-color:#236bff!important;color:#fff!important;box-shadow:0 8px 18px rgba(35,107,255,.22)}.studio-content{padding:0 22px 18px!important;background:#eef2f5!important}.studio-page{max-width:none!important;width:100%!important;background:#fff;border:1px solid #d9e1eb;border-radius:14px;padding:22px!important;box-shadow:0 20px 50px rgba(15,23,42,.08)}.studio-page-head{min-height:44px!important;margin:0 0 16px!important;padding:0!important;grid-template-columns:minmax(0,1fr) auto!important}.studio-page-head h1{font-size:30px!important;line-height:1.05!important;margin:0 0 4px!important;letter-spacing:-.04em!important}.app-breadcrumb{font-size:12px!important;color:#7b8493!important;letter-spacing:0!important;text-transform:none!important}.command-actions{gap:10px!important}.command-actions .primaryButton,.command-actions .secondaryButton{height:36px!important;min-height:36px!important;border-radius:7px!important;padding:0 14px!important;font-size:12px!important}.inspection-legend{gap:8px!important}.inspection-legend span{height:42px!important;min-height:42px!important;border-radius:13px!important;padding:0 14px!important}.workbench-grid{grid-template-columns:330px minmax(560px,1fr) 320px!important;gap:12px!important}.workbench-card,.metric-grid article,.module-toolbar,.console-panel{border-radius:10px!important;border:1px solid #d9e1eb!important;background:#fff!important;box-shadow:none!important;padding:14px!important}.panel-title{height:28px;margin-bottom:10px!important}.panel-title h3,.panel-title-row h2{font-size:18px!important}.panel-subtitle,.studio-page-head p{display:none!important}.field{margin:8px 0!important}.field label,label{font-size:12px!important;color:#1f2937!important}.field input,.field select,input,select{height:38px!important;min-height:38px!important;border-radius:6px!important}.file-trigger{height:38px!important;border-radius:6px!important}.preview{height:210px!important;min-height:210px!important;border-radius:8px!important}.preview-empty strong{font-size:13px}.preview-empty span{font-size:11px}.input-hints{gap:7px!important;margin:10px 0!important}.input-hints span{border-radius:999px!important;font-size:11px!important;padding:5px 8px!important}.primary-actions{display:grid!important;grid-template-columns:1fr .62fr!important}.primary-actions .btn{width:100%!important}.safe-canvas{padding:10px!important;border-radius:9px!important}.safe-canvas-grid{min-height:442px!important;border-radius:7px!important}.safe-line.top,.safe-line.bottom{left:8%!important;right:8%!important}.safe-line.left,.safe-line.right{top:8%!important;bottom:8%!important}.candidate-dock{margin-top:10px!important}.result-head{height:26px;display:flex;align-items:center;justify-content:space-between}.result-head strong{font-size:16px}.result-head span{font-size:12px;color:#667085}.candidate .empty-state,.candidate-dock .empty-state{height:132px!important;min-height:132px!important;display:grid;place-items:center;text-align:center}.status-panel{padding:12px!important;margin-bottom:10px!important}.action-checklist{display:grid;gap:8px;margin:10px 0}.action-checklist div{height:38px;display:flex;align-items:center;justify-content:space-between;padding:0 10px;border:1px solid #d9e1eb;border-radius:7px;background:#fbfcfe}.action-checklist span{font-size:13px;font-weight:800}.action-checklist b{font-size:11px;color:#7a8494}.action-checklist .done{background:#eefcf5;border-color:#bdf1d7}.action-checklist .done b{color:#11a266}.quality-stack{grid-template-columns:1fr!important;margin:8px 0!important}.quality-stack div{height:44px;border-radius:7px!important}.quality-stack b{font-size:17px!important}.inspector-actions{grid-template-columns:1fr 1fr!important;gap:8px!important}.inspector-actions .btn{height:34px!important;min-height:34px!important}.frame-timeline-panel{margin-top:12px!important;background:#111821!important;color:#fff!important;border-color:#111821!important;border-radius:10px!important}.frame-timeline-panel .panel-title{height:auto}.action-preview{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:8px!important}.action-card{border-radius:7px!important;padding:8px!important}.frame-strip{padding:6px!important;gap:6px!important}.frame-strip img{width:50px!important;height:50px!important}.library-tabs{height:42px;display:flex;align-items:center;gap:6px;border-bottom:1px solid #e5eaf1;margin-bottom:12px}.library-tabs button{height:30px;border:0;background:transparent;border-radius:6px;padding:0 12px;color:#667085;font-weight:800}.library-tabs button.active{background:#236bff;color:#fff}.library-tabs b{margin-left:4px}.asset-table{border:1px solid #d9e1eb;border-radius:10px;overflow:hidden;background:#fff}.asset-table-head,.asset-table-row{display:grid;grid-template-columns:64px minmax(180px,1.2fr) .8fr .55fr .55fr .65fr .9fr 1fr;gap:10px;align-items:center;padding:10px 12px}.asset-table-head{height:42px;background:#f8fafc;color:#667085;font-size:12px;font-weight:900}.asset-table-row{min-height:68px;border-top:1px solid #edf1f5;font-size:13px}.asset-table-row strong{display:grid;gap:2px}.asset-table-row small{font-family:var(--frame-mono);font-size:10px;color:#8a94a6;font-weight:600}.asset-thumb{width:44px;height:44px;border:1px solid #d9e1eb;border-radius:8px;display:grid;place-items:center;background:#fff}.asset-thumb img{max-width:42px;max-height:42px;object-fit:contain}.asset-table mark{padding:4px 8px;border-radius:6px;background:#fff2d8;color:#b66a00;font-weight:900}.asset-table .ok{color:#10a86a;font-weight:900}.asset-table .warn{color:#f59e0b;font-weight:900}.asset-table em{font-style:normal;padding:4px 8px;border-radius:6px;background:#dff8eb;color:#12915f;font-weight:900}.asset-row-actions{display:flex;gap:6px;justify-content:flex-end}.asset-row-actions a,.asset-row-actions button{height:28px;border-radius:6px;border:1px solid #d9e1eb;background:#fff;color:#1f2937;text-decoration:none;padding:0 9px;font-size:12px;font-weight:800}.asset-row-actions a:first-child{background:#236bff;color:#fff;border-color:#236bff}.metric-grid{grid-template-columns:repeat(4,1fr)!important}.task-row{border-radius:8px!important}.qa-list li,.release-rules>div{border-radius:8px!important}.delivery-grid{grid-template-columns:repeat(3,1fr)!important}.studio-footer{display:none!important}@media(max-width:1320px){.workbench-grid{grid-template-columns:310px minmax(420px,1fr)!important}.inspector-panel{grid-column:1/-1;position:static!important}.action-checklist{grid-template-columns:repeat(4,1fr)}}@media(max-width:980px){.studio-page{padding:16px!important}.studio-topbar{display:none}.workbench-grid{grid-template-columns:1fr!important}.asset-table{overflow:auto}.asset-table-head,.asset-table-row{min-width:980px}.studio-sidebar{width:auto!important}.studio-app-frame{grid-template-columns:1fr!important}}
