@import url("../style.css?v=1.2.1");

:root{--blue:#166f79}main{max-width:1080px;margin:auto}.intro,.phone-stage,.shortcuts,.shortcuts button{min-width:0}.experience{align-items:start}.phone-stage{overflow:hidden;overflow:clip}.handset{width:160%;max-width:none;flex:none}.glass{left:30.44%;top:26.2%;width:39.23%;height:13.27%;border-radius:3px;background:#9fb46f}.glass #lcd{width:100%;height:100%;aspect-ratio:96/65;opacity:1}.phone-caption{flex-wrap:wrap;justify-content:center}.phone-caption span{color:var(--muted);font-size:10px;letter-spacing:.03em}.easy-keys{flex-wrap:wrap;justify-content:center;gap:5px;padding:0 5px}.easy-keys button{min-width:40px;padding:10px;font-size:12px}.footnote{margin:18px 26px 0;padding-bottom:20px}.shortcuts button{width:100%}.status-line #status{min-width:0}.volume{margin-bottom:14px}.model-switch select{max-width:100%}
@media(max-width:720px){.shortcuts{grid-template-columns:repeat(2,minmax(0,1fr))}.handset{width:160%}.experience{width:100%}.phone-stage{max-width:540px;width:100%;margin:auto}.footnote{margin:0 18px}.roller-arrow{height:32px;width:44px}}
.roller-arrow{position:absolute;left:50%;transform:translate(-50%,-50%);width:42px;height:28px;padding:0;background:transparent;display:grid;place-items:center;z-index:3;border-radius:9px;line-height:1;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.roller-up{top:44.25%}.roller-down{top:52.25%}.roller-arrow span{display:grid;place-items:center;width:25px;height:17px;border-radius:7px;background:#09251ebd;border:1px solid #e5f4e36b;color:#eff8e9;font-size:11px;box-shadow:0 1px 3px #0005}.roller-arrow:hover:not(:disabled) span,.roller-arrow:active span{background:#b6dfb5;color:#10281d}.roller-arrow:disabled{opacity:.55}