/* Resolution-independent product concepts: smooth frames, no image clipping. */
.device-showcase{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:start;min-width:0;padding:22px 0;background:radial-gradient(ellipse at center,#d9a62b14,transparent 70%)}
.device{padding:5px;border-radius:36px;background:linear-gradient(125deg,#151515 0%,#c2c1b8 5%,#383838 9%,#080808 30%,#b7a76b 51%,#222 54%,#777 85%,#111 97%);box-shadow:0 0 0 1px #7778,inset 0 0 0 1px #ddd8,0 22px 40px #0009;min-width:0}
.device-screen{position:relative;border:3px solid #050505;border-radius:31px;padding:14px 12px 24px;background:linear-gradient(135deg,#1d1d1f,#080808 65%,#111);min-height:540px}
.device-servers{margin-top:36px}
.device-status{display:flex;justify-content:space-between;align-items:center;gap:5px;font-size:10px;font-weight:650;line-height:20px;margin-bottom:23px}
.device-status i{width:65px;height:19px;background:#000;border-radius:20px}
.device-brand{display:flex;align-items:center;gap:6px;font-size:17px;letter-spacing:-.5px}
.device-brand img{object-fit:contain}.device-brand b span{color:#f4d22d}.gear{margin-left:auto;font-size:19px;color:#a9a9a9}
.device-timer{text-align:center;font:14px/1.5 monospace;color:#a5a5a5;margin:28px 0 22px}
.device-ring{width:146px;height:146px;max-width:100%;margin:auto;display:grid;place-items:center;border:2px solid #ffe58a;border-radius:50%;background:radial-gradient(circle,#322600,#060606 72%);box-shadow:0 0 8px #ffd544,inset 0 0 12px #d49e2344,0 0 35px #e4b32955,0 0 0 14px #dba92308}
.device-ring img{width:80%;height:auto;object-fit:contain}
.device-connected{display:flex;align-items:center;justify-content:center;gap:8px;margin:26px 0;font-size:14px}
.device-connected>span{width:8px;height:8px;background:#12e567;border-radius:50%;box-shadow:0 0 10px #1e5}
.device-location{display:flex;align-items:center;gap:9px;background:linear-gradient(120deg,#242424,#151515);padding:14px 10px;border-radius:14px;border-top:1px solid #ffffff0c;font-size:13px}
.device-location small{display:block;color:#aaa;font-size:10px}.device-location>span:last-child{margin-left:auto;color:#aaa;font-size:24px}
.flag{font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:25px;line-height:1.2;flex-shrink:0}
.device-tabs{display:flex;justify-content:space-around;gap:4px;border-top:1px solid #ffffff10;margin-top:35px;padding-top:14px;text-align:center;font-size:20px;color:#8f8f8f}
.device-tabs b{font-weight:400;color:#ffda35}.device-tabs small{display:block;font-size:9px}
.device-tabs{border:1px solid #ffffff12;border-bottom:0;border-radius:20px 20px 12px 12px;background:linear-gradient(120deg,#25231b99,#171819aa);padding:14px 4px 10px}
.device-tabs>span,.device-tabs>b{display:flex;flex:1;min-width:0;flex-direction:column;align-items:center;gap:6px;position:relative}
.device-tabs svg{display:block;width:24px;height:24px;flex-shrink:0}
.device-tabs>b:after{content:"";width:17px;height:2px;border-radius:2px;background:currentColor;margin-top:1px}
.home-indicator{position:absolute;bottom:9px;left:32%;width:36%;height:3px;border-radius:4px;background:#eee}
.device-title{font-size:24px;font-weight:750;letter-spacing:-.8px;margin:17px 0 12px}
.device-search{padding:9px 10px;background:#222;border-radius:10px;color:#929292;font-size:11px;margin-bottom:14px}
.device-list{display:grid;gap:7px}
.device-row{display:flex;align-items:center;gap:8px;padding:10px 8px;min-height:43px;border:1px solid transparent;border-radius:11px;background:linear-gradient(110deg,#242424,#191919);font-size:11px;line-height:1.3}
.device-row .flag{font-size:23px}.device-row .selection{margin-left:auto;font-size:19px;color:#777}
.device-row.selected{border-color:#e8c441;background:linear-gradient(120deg,#3a3319,#1d1d17);box-shadow:0 0 15px #e8bc2814}
.device-row.selected .selection{background:#f1d34b;color:#141414;width:20px;height:20px;border-radius:50%;font-size:14px;display:grid;place-items:center;flex-shrink:0}
.device-showcase .caption{grid-column:1/-1;margin:0;font-size:11px;line-height:1.5}
.device-connect .device-screen{--screen-inset:12px;display:flex;flex-direction:column;padding-bottom:0;overflow:hidden}
.device-connect .device-ring{flex-shrink:0}
.device-bottom-panel{position:relative;flex-shrink:0;margin:35px calc(-1 * var(--screen-inset)) 0;padding:0 8px 27px;border-radius:24px 24px 0 0;border-top:1px solid #ffffff18;background:radial-gradient(ellipse at 15% 0%,#75602026,transparent 65%),linear-gradient(120deg,#202121,#131414);box-shadow:inset 0 1px 0 #ffffff04}
.device-bottom-panel .device-tabs{margin:0;border:0;border-radius:0;background:none;padding:10px 0 0;box-shadow:none}
.device-bottom-panel{padding-bottom:21px}
.device-bottom-panel .device-tabs svg{width:19px;height:19px}
.device-bottom-panel .device-tabs small{font-size:8px;line-height:1.3}
.device-bottom-panel .device-tabs>span,.device-bottom-panel .device-tabs>b{gap:4px}
.device-bottom-panel .device-tabs>b:after{width:14px;height:2px;margin-top:0}
.device-bottom-panel .home-indicator{bottom:8px}
@media(min-width:761px) and (max-width:1000px){.device-showcase{max-width:580px;margin:auto;width:100%}}
@media(max-width:760px){.device-showcase{max-width:540px;margin:auto;width:100%;gap:14px}.device-screen{padding:12px 9px 23px}.device-brand{font-size:15px}.device-ring{width:130px;height:130px}.device-row{font-size:10px;padding:9px 6px;gap:6px}.device-row .flag{font-size:21px}}
@media(max-width:430px){.device-showcase{grid-template-columns:1fr;max-width:280px;gap:24px}.device-servers{margin-top:0}.device-screen{padding:16px 16px 28px}.device-row{font-size:13px;padding:11px}.device-brand{font-size:20px}.device-ring{width:160px;height:160px}.device-showcase .caption{font-size:11px}}
@media(max-width:760px){.device-connect .device-screen{--screen-inset:9px}}
@media(max-width:430px){.device-connect .device-screen{--screen-inset:16px}}