.try-layout{display:grid;grid-template-columns:minmax(0,460px) minmax(0,1fr);gap:40px;align-items:start;padding:28px 24px 32px;max-width:1200px;margin:0 auto}.stage{position:relative;display:flex;justify-content:center;padding:8px 40px}.device{position:relative;width:392px;height:820px;border-radius:54px;background:var(--ink-2);border:1px solid var(--line);box-shadow:0 0 0 10px #0b0b0a,0 30px 80px #0000008c;transform-origin:50% 70%}.speaker{position:absolute;top:18px;left:calc(50% - 40px);width:80px;height:7px;border-radius:4px;background:var(--line)}.screen{position:absolute;top:40px;right:12px;bottom:16px;left:12px;border-radius:36px;overflow:hidden;background:var(--ink)}.screen iframe{width:100%;height:100%;border:0;display:block;background:var(--ink)}.motion{position:absolute;top:38%;display:grid;gap:14px;opacity:0}.motion i{display:block;width:4px;height:46px;border-radius:2px;background:var(--orange)}.motion i:nth-child(2){height:72px}.motion-l{left:6px}.motion-r{right:6px}@media (prefers-reduced-motion: no-preference){.shaking .device{animation:phone-shake .9s cubic-bezier(.36,.07,.19,.97) both}.shaking .motion{animation:motion-flash .9s linear both}}.shaking .motion{opacity:1}@keyframes phone-shake{0%{transform:translate(0) rotate(0)}10%{transform:translate(-26px) rotate(-5deg)}22%{transform:translate(24px) rotate(5deg)}34%{transform:translate(-20px) rotate(-4deg)}46%{transform:translate(16px) rotate(3deg)}58%{transform:translate(-10px) rotate(-2deg)}70%{transform:translate(6px) rotate(1deg)}85%{transform:translate(-2px) rotate(0)}to{transform:translate(0) rotate(0)}}@keyframes motion-flash{0%,to{opacity:0}10%,30%,50%{opacity:1}20%,40%,60%{opacity:.25}}.guide .steps{list-style:none;margin:0;padding:0;display:grid;gap:18px}.guide .steps>li{display:grid;grid-template-columns:40px 1fr;gap:14px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--radius);background:var(--ink-2)}.guide .num{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--orange-soft);color:var(--orange);font-weight:600}.guide h2{margin:2px 0 4px;font-size:19px;font-weight:700}.guide p{margin:0 0 8px;color:var(--cream)}.guide em{color:var(--orange);font-style:normal}.bugs{list-style:none;margin:6px 0 0;padding:0;display:grid;gap:6px}.bug{width:100%;text-align:left;font:500 14px/1.35 var(--sans);color:var(--cream);background:var(--ink-3);border:1px solid var(--line);border-radius:8px;padding:8px 10px;cursor:pointer}.bug:hover,.bug:focus-visible{border-color:var(--orange);outline:none}.shake-btn{margin-top:4px;font:700 18px/1 var(--sans);padding:14px 22px;border-radius:12px;border:0;background:var(--orange);color:var(--ink);cursor:pointer}.shake-btn:hover{filter:brightness(1.08)}.shake-btn:focus-visible{outline:2px solid var(--cream);outline-offset:3px}.link{color:var(--orange);font-weight:600}.try .mode-btn{text-decoration:none;display:inline-block}@media (max-width: 900px){.try-layout{grid-template-columns:minmax(0,1fr);gap:24px;padding:16px}.stage{padding:8px 0}.device{width:min(340px,calc(100vw - 72px));height:calc(min(340px,calc(100vw - 72px))*2.09)}.motion{display:none}}
