/* User-requested review shell, inspired by the supplied iPhone reference. */
.ld-screen-preview{position:relative;min-height:100dvh;padding:20px 16px 28px;display:flex;flex-direction:column;align-items:center;gap:16px;background:#efefef}
.ld-preview-state{order:2;display:flex;justify-content:center;flex-wrap:wrap;gap:8px;max-width:100%;font:14px/1.4 var(--ld-font)}
.ld-preview-state select{appearance:auto;min-height:40px;max-width:100%;padding:8px 12px;border:1px solid #d8d8d8;border-radius:12px;background:white;color:#555;font:inherit}
.ld-device-frame{position:relative;flex:none;width:417px;max-width:100%;padding:12px;background:#1c1c1a;border-radius:60px;box-shadow:0 0 0 2px #343432,0 18px 42px #0003}
.ld-device-frame>.ld-phone{width:100%;height:852px;margin:0;border-radius:48px;--ld-safe-bottom:20px}
/* Desktop scales the complete 417×876 frame, never just the screen height. */
@media(min-width:441px){
 .ld-device-frame{zoom:min(1,calc((100dvh - 48px) / 876px))}
}
/* Keep the phone centered; preview controls use the adjacent desktop gutter.
   On narrow windows they follow the phone without changing its dimensions. */
@media(min-width:800px){
 .ld-preview-state{position:absolute;top:20px;--frame-half:min(208.5px,calc((100dvh - 48px)*.238013699));left:calc(50% + var(--frame-half) + 24px);max-width:calc(50% - var(--frame-half) - 40px);justify-content:flex-start}
}
.ld-device-frame::before{content:'';position:absolute;z-index:30;top:23px;left:50%;transform:translateX(-50%);width:112px;height:32px;border-radius:22px;background:#000;pointer-events:none}
.ld-device-frame::after{content:'';position:absolute;z-index:30;bottom:19px;left:50%;transform:translateX(-50%);width:112px;height:5px;border-radius:4px;background:#111;pointer-events:none}
.ld-device-frame .ld-time{left:22px;width:58px}
.ld-device-frame .ld-status>img{right:24px}
@media(max-width:440px){
 .ld-screen-preview{padding:8px 4px 12px;gap:8px}
 .ld-preview-state select{min-height:36px;padding:6px 10px;font-size:12px}
 .ld-device-frame{padding:4px;border-radius:40px;box-shadow:0 0 0 1px #343432}
 .ld-device-frame>.ld-phone{height:calc(100dvh - 28px);border-radius:36px}
 .ld-device-frame::before{top:15px;width:96px;height:30px}
 .ld-device-frame::after{bottom:11px;width:96px}
 .ld-device-frame .ld-time{left:16px;width:48px}
 .ld-device-frame .ld-status>img{right:16px}
}
.ld-preview-state{font-family:'Lucid Preview Montreal',sans-serif}
.ld-device-frame>.ld-phone{container-type:inline-size}
@media(max-width:440px){.ld-device-frame{width:401px}}
/* Adapt to the screen inside the bezel, rather than the browser width. */
@container(max-width:374px){
 .ld-invest .ld-list-card{padding:17px}
 .lucid .ld-security-row{gap:8px}
 .ld-security-row .ld-tile{width:40px;height:40px}
 .ld-holding-copy,.ld-holding-primary,.ld-holding-secondary{gap:4px}
 .ld-security-name,.ld-security-value{font-size:14px}
 .ld-security-price,.ld-security-performance{font-size:12px}
}
@container(max-width:330px){
 .ld-invest .ld-list-card{padding:13px}
 .ld-security-row .ld-tile{width:32px;height:32px}
}
