.story-explorer{border-top:1px solid #d5dfe5;padding-block:60px 76px}.story-explorer>h2{max-width:800px;font-size:clamp(30px,3.6vw,48px);line-height:1.15}.story-screen-tabs{border-bottom:1px solid #d5dfe5;flex-wrap:wrap;gap:0 28px;margin-block:30px;display:flex}.story-screen-tabs button{color:#52616d;background:0 0;border:0;border-bottom:2px solid #0000;min-height:48px;padding:10px 0 14px;font-size:15px;transition:color .2s,border-color .2s}.story-screen-tabs button[aria-selected=true]{color:#202c36;border-bottom-color:#506f81;font-weight:500}.story-screen-panel{grid-template-columns:minmax(0,1.85fr) minmax(240px,1fr);align-items:center;gap:48px;display:grid}.story-screen-preview{aspect-ratio:1.44;cursor:zoom-in;background:#edf0f3;border:1px solid #d5dfe5;border-radius:8px;place-items:center;width:100%;min-width:0;padding:0;display:grid;position:relative;overflow:hidden}.story-screen-preview>img{object-fit:contain;width:100%;height:100%;display:block;position:absolute;inset:0}.story-screen-phone{background:#e9eff2;padding:22px}.story-screen-phone>img{width:auto;max-width:calc(100% - 44px);height:calc(100% - 44px);max-height:500px;margin:auto;inset:22px 0;box-shadow:0 7px 24px #22344016}.story-screen-enlarge{color:#253744;background:#fff;border:1px solid #c4d1d9;border-radius:4px;place-items:center;width:40px;height:40px;display:grid;position:absolute;bottom:12px;right:12px}.story-screen-enlarge svg{width:24px;height:24px}.story-screen-note h3{max-width:370px;font-size:clamp(25px,2.3vw,34px);line-height:1.2}.story-screen-note p{max-width:430px;margin-top:20px;font-size:16px;line-height:1.85}.story-screen-tabs button:focus-visible,.story-screen-preview:focus-visible{outline-offset:5px;outline:2px solid #506f81}.story-screen-viewer{color:#fff;overscroll-behavior:contain;background:#202c36;border:1px solid #ffffff30;border-radius:12px;width:min(1500px,100vw - 40px);max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:20px;position:fixed;inset:0;overflow:auto}.story-screen-viewer::backdrop{background:#101820df}.story-screen-viewer>header{justify-content:space-between;align-items:center;gap:20px;margin-bottom:16px;display:flex}.story-screen-viewer h2{font-size:23px;line-height:1.3}.story-screen-viewer>header button{color:#fff;background:0 0;border:1px solid #ffffff40;border-radius:50%;flex:none;place-items:center;width:44px;height:44px;font-size:29px;display:grid}.story-screen-original{overscroll-behavior:contain;background:#e9eff2;max-height:calc(100dvh - 190px);display:flex;overflow:auto}.story-screen-original img{object-fit:contain;flex:none;align-self:flex-start;width:auto;max-width:none;height:auto;margin-inline:auto;display:block}.story-screen-viewer>a{color:#fff;text-underline-offset:4px;align-items:center;gap:16px;min-height:44px;margin-top:12px;font-size:13px;text-decoration:underline;display:inline-flex}.story-screen-viewer button:focus-visible,.story-screen-viewer a:focus-visible{outline-offset:3px;outline:2px solid #d1e4ee}.project-story-page .detail-body{padding-bottom:60px}@media (width<=1000px){.story-screen-panel{grid-template-columns:minmax(0,1.5fr) minmax(210px,1fr);gap:30px}.story-screen-note p{font-size:15px}}@media (width<=760px){.story-explorer{padding-block:38px 44px}.story-screen-tabs{gap:0 22px;margin-block:22px}.story-screen-tabs button{font-size:13px}.story-screen-panel{grid-template-columns:1fr;gap:25px}.story-screen-note h3{font-size:26px}.story-screen-note p{margin-top:13px;font-size:15px}.story-screen-phone{aspect-ratio:.7;padding:18px}.story-screen-viewer{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);padding:14px}.project-story-page .detail-body{padding-bottom:38px}}@media (prefers-reduced-motion:reduce){.story-screen-tabs button{transition:none}}.story-screen-original:focus-visible{outline-offset:3px;outline:2px solid #d1e4ee}body:has(.story-screen-viewer[open]){overflow:hidden}
