*{box-sizing:border-box}body{margin:0;height:100dvh;display:flex;flex-direction:column;background:#e9edf0;color:#14314c;font:14px system-ui,sans-serif}a{color:inherit}header{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:12px 20px;background:#fff;border-bottom:1px solid #dce1e5;flex:none}header>a{font-size:19px;font-weight:650;text-decoration:none}.badge{font-size:11px;color:#667a89}.modes{margin-left:auto;display:flex;gap:8px}button,select{font:inherit;padding:9px 12px;border:1px solid #ccd4dc;border-radius:9px;background:#fff;color:inherit;cursor:pointer;min-height:40px}button:hover{background:#f0f5f8}button:focus-visible,summary:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid #4c91b4;outline-offset:2px}button:disabled{opacity:.4;cursor:default}.primary{background:#173c56;color:#fff;border-color:#173c56}.primary:hover{background:#234e6b}[hidden]{display:none!important}#tools{background:#f7f9fa;flex:none;border-bottom:1px solid #dce1e5}summary{padding:10px 20px;cursor:pointer;font-size:12px;width:fit-content}.tools-body{padding:0 20px 10px}.shortcuts,.settings{display:flex;gap:6px;flex-wrap:wrap;align-items:center}.settings{margin-top:12px}.settings #reset{margin-left:auto;color:#8f4235}label{display:flex;align-items:center;gap:8px}.scope,#hint{font-size:12px;line-height:1.5;color:#617584;margin:8px 0 0}#guide{flex:none;background:#fff;padding:12px 22px 0;border-bottom:1px solid #dce1e5}.guide-top{display:flex;justify-content:space-between;align-items:center;gap:12px}#guide-count{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#536f83}#guide-toggle{padding:3px 8px;border:0;min-height:30px;font-size:12px}h1{font-size:21px;line-height:1.25;margin:5px 0 8px;font-weight:600}#guide-text{font-size:14px;line-height:1.55;margin:0;max-width:1050px}#guide-action{font-size:12px;color:#617584;line-height:1.45;margin:6px 0 10px}.guide-controls{display:flex;gap:8px;align-items:center;padding-bottom:12px}#return-step{font-size:12px;border-color:transparent}#next{margin-left:auto}progress{display:block;appearance:none;border:0;width:calc(100% + 44px);margin-left:-22px;height:3px;background:#e4edf1}progress::-webkit-progress-bar{background:#e4edf1}progress::-webkit-progress-value{background:#508baa}progress::-moz-progress-bar{background:#508baa}#stage{flex:1;min-height:260px;overflow:auto;display:flex;align-items:flex-start}iframe{display:block;flex:none;border:0;background:#fcfcfb;height:100%;width:100%;margin:0 auto;min-height:260px}@media(max-width:600px){header{padding:9px 12px;gap:8px}.modes{width:100%;margin:0}.modes button{flex:1;font-size:12px}summary{padding:8px 12px}.tools-body{padding:0 12px 10px}#guide{padding:10px 12px 0}h1{font-size:18px}#guide-text{font-size:13px}#guide-action{font-size:11px}.guide-controls{gap:4px;flex-wrap:wrap}.guide-controls button{font-size:12px;padding:8px}#return-step{order:3;width:100%;min-height:30px;padding:3px}progress{width:calc(100% + 24px);margin-left:-12px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
/* Device presentation stays outside the unchanged application viewport. */
#device-controls{flex:none;display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 20px;background:#f7f9fa;border-bottom:1px solid #dce1e5;font-size:12px}#device-controls select,#device-controls button{font-size:12px;min-height:34px;padding:6px 9px}#scale-label{margin-left:auto;color:#617584;font-size:11px}#orientation-tip{flex:none;margin:0;padding:8px 16px;background:#edf4f7;font-size:12px;line-height:1.4}#stage{position:relative}#stage.device-preview{padding:16px;background:radial-gradient(ellipse at 50% 20%,#f7fafc,#dfe6eb)}#viewport-canvas{position:relative;flex:none;overflow:hidden;width:100%;height:100%;margin:auto}#device{position:absolute;left:0;top:0;width:100%;height:100%;transform-origin:top left}#device iframe{margin:0;min-height:0}#device.phone,#device.tablet{background:linear-gradient(115deg,#727a83 0%,#191d23 3%,#080b10 48%,#424a55 98%,#8b9299);border-radius:48px;box-shadow:inset 0 0 0 2px #9ea6b1,inset 0 0 0 5px #272c34}#device.phone iframe{border-radius:32px;background:#fff}#device.phone:before{content:'';position:absolute;top:11px;left:calc(50% - 28px);width:56px;height:5px;border-radius:9px;background:#08090c;box-shadow:0 1px 1px #abb1ba55}#device.phone:after{content:'';position:absolute;bottom:6px;left:calc(50% - 42px);width:84px;height:3px;border-radius:9px;background:#b8bec766}#device.tablet{border-radius:30px}#device.tablet iframe{border-radius:15px}#device.tablet:before{content:'';position:absolute;top:6px;left:calc(50% - 3px);width:6px;height:6px;border-radius:50%;background:#08090c;border:1px solid #434b56}#stage:fullscreen{width:100vw;height:100dvh;min-height:0;background:#e9edf0;padding:48px 16px 16px}#exit-fullscreen{display:none}#stage:fullscreen #exit-fullscreen{display:block;position:fixed;top:8px;right:12px;z-index:2;padding:5px 10px;min-height:32px;font-size:12px}@media(max-width:600px){#device-controls{padding:7px 12px;gap:6px}#scale-label{width:100%;margin:0}#stage.device-preview{padding:16px}}

/* Review controls remain outside the original application. */
#experience-summary{margin:0 0 12px}@media(max-width:600px){#return-step{order:0;width:auto;min-height:40px;padding:8px}.guide-controls{flex-wrap:nowrap}#scale-label{width:auto;margin-left:auto}}
