@font-face{font-family:Douyin;src:url('/assets/brand/douyin-sans-bold.ttf') format('truetype');font-weight:700;font-display:swap}
:root{--ink:#22262c;--muted:#7c838d;--red:#c94737;--soft:#f4f5f7}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);background:#fff;font:15px/1.5 'Microsoft YaHei UI','PingFang SC',sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{touch-action:manipulation}button:active{transform:scale(.95)}button:focus-visible,a:focus-visible,.gallery:focus-visible{outline:3px solid #c9473780;outline-offset:5px}.nav{width:min(1220px,calc(100% - 64px));height:76px;margin:22px auto 0;display:flex;align-items:center;gap:52px;padding:0 30px;border-radius:20px;background:#ffffffde;border:1px solid #e9edf1;box-shadow:0 5px 22px #20283805;backdrop-filter:blur(16px)}.brand{display:flex;align-items:center}.brand img{width:165px;height:58px;object-fit:contain}.nav nav{display:flex;gap:34px;margin:auto}.nav a{font-size:13px}.nav .current{position:relative;font-weight:700}.current:after{position:absolute;content:'';height:2px;left:6px;right:6px;background:var(--red);bottom:-10px}.return{color:var(--muted)}.intro{max-width:1220px;margin:56px auto 0;display:flex;align-items:end;justify-content:space-between;padding:0 28px}.eyebrow{font-size:10px;letter-spacing:.16em;color:#a0a6ae;margin:0 0 12px}h1{font-family:Douyin,'Microsoft YaHei UI',sans-serif;font-size:clamp(30px,3vw,44px);letter-spacing:-.025em;line-height:1.3;margin:0}h1 span{color:#707880}.sub{color:var(--muted);margin:12px 0 0;font-size:15px}.preview-badge{font-size:11px;color:#929aa3;border:1px solid #edf0f3;padding:5px 10px;border-radius:6px}.gallery{height:clamp(340px,32vw,490px);margin-top:24px;position:relative;overflow:hidden;touch-action:pan-y;cursor:grab;outline-offset:-5px!important;user-select:none;isolation:isolate}.gallery.dragging{cursor:grabbing}.stage{position:absolute;inset:0;perspective:1600px;perspective-origin:44% 50%;mask-image:linear-gradient(to right,transparent,black 4%,black 95%,transparent);-webkit-mask-image:linear-gradient(to right,transparent,black 4%,black 95%,transparent)}.plaque{position:absolute;top:50%;left:44%;width:var(--card-w);height:var(--card-h);transform-style:preserve-3d;transform-origin:center;will-change:transform;cursor:pointer;contain:layout style}.glass{width:100%;height:100%;position:relative;overflow:hidden;border-radius:14px;background:linear-gradient(145deg,#ffffffea,#f7fafc83 65%,#ffffffdf);border:1px solid #c8d5dfb0;box-shadow:inset 0 1px 0 #fff,inset 1px 0 1px #ffffff,2px 1px 0 #bccbd955,5px 3px 0 -3px #d6e2ed99,0 18px 30px -20px #24394d39}.glass:after{content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,#ffffff66,transparent 28%,transparent 73%,#ffffff45);box-shadow:inset 0 0 0 3px #ffffff55}.plaque.active .glass{border-color:#b6c9d6;box-shadow:inset 0 1px 0 #fff,3px 2px 0 #bed1df66,6px 4px 0 -3px #e0e9ee,0 24px 36px -24px #273d5950}.glass .visual{position:absolute;left:0;bottom:0;width:60%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#f8fafb}.visual img{width:100%;height:100%;object-fit:cover;pointer-events:none;mix-blend-mode:multiply;opacity:.93}.visual:after{content:'';position:absolute;inset:0;background:linear-gradient(to right,transparent 70%,#fafcfd)}.copy{position:absolute;left:59%;top:0;right:0;height:100%;padding:27px 23px 26px 16px;display:flex;flex-direction:column;justify-content:center;z-index:2}.copy small{font-size:9px;color:#8e98a3;letter-spacing:.15em;margin-bottom:10px}.copy h2{font-family:Douyin,'Microsoft YaHei UI',sans-serif;font-size:26px;line-height:1.3;margin:0 0 10px}.copy p{font-size:12px;line-height:1.8;color:#7c858f;margin:0;max-width:200px}.enter{align-self:start;display:flex;align-items:center;gap:14px;color:#fff;background:var(--red);font-size:12px;padding:11px 16px;border-radius:7px;margin-top:24px;box-shadow:0 4px 10px #c9473715}.plaque:not(.active) .enter{background:transparent;color:#697889;box-shadow:none;padding-left:0}.controls{display:flex;gap:18px;align-items:center;justify-content:center;margin-top:6px}.controls>button{border:1px solid #edf0f3;background:#f9fafba6;border-radius:50%;width:44px;height:44px;color:#596575;font-size:20px}.positions{display:flex;gap:8px}.positions button{padding:0;border:0;background:transparent;width:24px;height:40px;position:relative}.positions button:after{content:'';position:absolute;left:0;right:0;top:18px;height:3px;border-radius:3px;background:#e1e5e9}.positions button[aria-pressed=true]:after{background:var(--red)}#counter{font-size:10px;color:#9ca4ad;letter-spacing:.05em;font-variant-numeric:tabular-nums}.gesture{text-align:center;font-size:11px;color:#a1a8b0;margin:12px 0 34px}.dock{display:flex;justify-content:center;align-items:end;gap:14px;flex-wrap:wrap;padding:0 24px;min-height:62px}.dock button{border:0;background:transparent;color:#939ba5;min-height:48px;padding:8px 13px;position:relative;font-size:12px;transition:color .2s,transform .25s}.dock button[aria-pressed=true]{color:#303e4b;transform:translateY(-5px);font-weight:700}.dock button[aria-pressed=true]:after{content:'';position:absolute;width:4px;height:4px;border-radius:50%;background:var(--red);bottom:0;left:calc(50% - 2px)}footer{max-width:1220px;margin:38px auto 0;border-top:1px solid #f1f3f5;padding:22px 28px;display:flex;justify-content:space-between;font-size:10px;color:#a1a8b0}.screen-reader{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
/* Native interface composition uses product UI rather than invented screenshots. */
.competition-product{width:91%;height:77%;background:#fff;border:1px solid #dce5e0;border-radius:9px;box-shadow:0 12px 20px #203c3314;padding:13px 15px;transform:rotate(-4deg);display:flex;flex-direction:column}.comp-head{display:flex;align-items:center;justify-content:space-between;font-size:11px;font-weight:800}.comp-head b{font-size:7px;color:#d5493a;border:1px solid #f0c9c3;border-radius:9px;padding:2px 5px}.comp-flow{display:flex;align-items:center;gap:5px;flex:1}.comp-flow>div{background:#f7f9f8;border:1px solid #e5ece7;border-radius:5px;flex:1;min-width:0;padding:7px 5px;display:grid;gap:5px}.comp-flow small{font-size:6px;color:#788a7e}.comp-flow strong{font-size:7px;white-space:nowrap;color:#3a5343}.comp-flow>div:nth-of-type(2){background:#fff0ed;border-color:#f7d3cb}.comp-flow i{font-size:9px;color:#d4503e;font-style:normal}.comp-bottom{display:flex;align-items:center;gap:6px;font-size:6px;letter-spacing:.08em;color:#9ea8a1}.comp-bottom em{flex:1;height:2px;background:linear-gradient(90deg,#d8e5dc,#dc5543)}
.voting-product{position:relative;width:92%;height:86%;pointer-events:none}.result-demo{position:absolute;width:77%;height:65%;right:0;top:10%;border-radius:9px;background:#fff;box-shadow:0 2px 1px #dae3ec,0 12px 20px #32496013;padding:18px;transform:rotate(-3deg)}.result-demo>strong{font-size:12px}.result-demo>small{display:block;font-size:8px;color:#a3acb5;margin:6px 0 14px}.result-row{display:flex;gap:8px;align-items:center;font-size:8px;margin:13px 0}.result-row span{width:27px}.result-row i{height:8px;border-radius:2px;background:#e8edf1;flex:1}.result-row b{display:block;height:100%;background:#d95a4a;border-radius:2px}.phone-demo{position:absolute;bottom:2%;left:7%;height:83%;aspect-ratio:.49;background:#fafbfc;border:5px solid #3a424b;border-radius:17px;box-shadow:3px 1px 0 #95a3b0,8px 12px 13px #35445019;transform:rotate(-8deg);padding:19px 9px 10px;display:flex;flex-direction:column}.phone-demo:before{content:'';position:absolute;top:5px;left:34%;width:32%;height:5px;border-radius:4px;background:#303841}.phone-demo strong{font-size:9px}.phone-demo small{font-size:6px;color:#a0a7af;margin:6px 0 14px}.phone-option{padding:8px 5px;margin-bottom:6px;font-size:7px;border:1px solid #edf0f2;border-radius:4px;display:flex;gap:5px;align-items:center}.phone-option:before{content:'';border:1px solid #cad3da;width:7px;height:7px;border-radius:50%}.phone-option:first-of-type{background:#fff0ec;border-color:#f5d2c9}.phone-option:first-of-type:before{background:#d75343;border-color:#d75343}.phone-button{font-size:7px;background:#cb4d3d;color:#fff;border-radius:4px;padding:7px;text-align:center;margin-top:auto}
@media(max-width:900px){.nav{width:calc(100% - 32px);padding:0 18px;gap:20px}.nav nav{gap:20px}.intro{margin-top:42px}.gallery{height:390px}.copy h2{font-size:24px}.dock{gap:3px}.dock button{font-size:11px;padding:8px 10px}}
@media(max-width:600px){.nav{height:62px;margin-top:12px;border-radius:14px}.brand img{width:127px;height:44px}.nav nav{margin-left:auto}.nav nav a:first-child,.nav .return{display:none}.intro{padding:0 24px;gap:15px;margin-top:35px}.preview-badge{display:none}.eyebrow{font-size:8px}h1{font-size:29px}.sub{font-size:12px}.gallery{height:330px;margin-top:12px}.stage{perspective:1100px;perspective-origin:50% 50%;mask-image:linear-gradient(to right,transparent,black 3%,black 97%,transparent)}.plaque{left:50%}.copy{left:52%;padding:15px 14px 15px 9px}.copy small{font-size:7px;letter-spacing:.05em;margin-bottom:7px}.copy h2{font-size:20px}.copy p{font-size:10px}.visual{width:54%!important}.enter{font-size:10px;padding:9px 11px;margin-top:17px;gap:7px}.controls{gap:10px}.positions{gap:5px}.positions button{width:19px}.gesture{margin-bottom:19px}.dock{gap:0;padding:0 13px}.dock button{font-size:10px;padding:7px 8px;min-height:42px}footer{margin-top:25px;padding:18px 22px;gap:15px;line-height:1.7}.result-demo{padding:10px}.result-demo strong{font-size:8px}.result-demo>small{font-size:6px}.result-row{font-size:6px;margin:9px 0;gap:3px}.result-row span{width:21px}.result-row i{height:5px}.phone-demo{border-width:4px;border-radius:12px;padding:14px 6px 7px}.phone-demo strong{font-size:7px}.phone-demo small{font-size:5px;margin:5px 0 7px}.phone-option{font-size:5px;padding:5px 3px;margin-bottom:5px;gap:3px}.phone-option:before{width:5px;height:5px}.phone-button{font-size:5px;padding:5px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.nav nav button{padding:0;border:0;background:transparent;color:inherit;font-size:13px;min-height:44px}.account{font-size:12px;white-space:nowrap;min-width:40px}.account a{display:block;max-width:100px;text-overflow:ellipsis;overflow:hidden;white-space:nowrap;padding:10px 0}.nav{gap:26px}.no-script{margin:40px auto;max-width:900px;padding:20px}.no-script a{display:inline-block;padding:15px;color:var(--red)}#all-tools{width:min(650px,calc(100% - 32px));padding:30px;border:1px solid #e5eaf0;border-radius:16px;background:#fff;color:var(--ink);box-shadow:0 30px 90px #26364b20;max-height:85dvh;overflow:auto;overscroll-behavior:contain}#all-tools::backdrop{background:#202c3a25;backdrop-filter:blur(8px)}.dialog-head{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:15px}.dialog-head h2{font-family:Douyin;font-size:24px;margin:0}.dialog-head .eyebrow{margin-bottom:10px}.dialog-head button{width:44px;height:44px;border:0;border-radius:8px;background:#f5f7f9;color:#697481;font-size:25px}.tool-row{display:grid;grid-template-columns:1fr 30px;padding:16px 0;border-bottom:1px solid #edf0f3;gap:4px 16px}.tool-row strong{font-size:15px}.tool-row>span:not(.row-arrow){font-size:12px;color:#8d97a2;grid-column:1}.row-arrow{grid-column:2;grid-row:1/3;color:var(--red);align-self:center}.tool-row:last-child{border-bottom:0}@media(max-width:900px){.nav{gap:18px}}@media(max-width:600px){.nav{gap:14px}.nav nav{gap:0}.account a{max-width:58px;font-size:11px}.nav nav button{font-size:11px}.nav nav{margin-left:auto;margin-right:0}#all-tools{padding:23px}.tool-row{padding:15px 0}.dialog-head h2{font-size:21px}}