/* Supplemental concept art for the animated placeholder showcases. */
.mock-stacked{background:#111b1b}
.mock-stacked .mock-graph .line{stroke:#a8d3a4}
.mock-stacked .mock-progress div{background:#a8d3a4}
.mock-phone{width:clamp(145px,25vw,228px);height:100%;max-height:390px;min-height:165px;border:3px solid #3f494e;border-radius:26px;background:#11151f;overflow:hidden;position:relative;box-shadow:0 20px 45px #0009;animation:float-window 9s ease-in-out infinite}
.phone-sensor{height:13px;width:61px;left:50%;transform:translateX(-50%);position:absolute;top:5px;background:#05070b;border-radius:9px}
.phone-content{padding:26px 12px 12px;display:flex;flex-direction:column;gap:10px;height:100%;overflow:hidden}
.phone-overline{color:#afa8e7;font:7px var(--mono);letter-spacing:.08em}
.phone-title{font:600 clamp(13px,1.6vw,20px) var(--display);letter-spacing:-.05em;color:#f0f0f5}
.phone-feature{min-height:87px;background:#25233b;border:1px solid #5b5682;padding:11px;display:flex;flex-direction:column;justify-content:space-between;animation:phone-glow 6s ease-in-out infinite}
.phone-feature small{font:7px var(--mono);color:#d1c4fa}
.phone-feature strong{font:600 clamp(11px,1.5vw,15px) var(--display);color:#f2eefe}
.phone-feature span{font:8px var(--body);color:#bbb5d4}
.phone-row{display:flex;justify-content:space-between;font:600 9px var(--display);margin-top:3px;color:#f3f1f9}
.phone-row span:last-child{font-size:8px;color:#a697e0}
.phone-card{background:#212333;border:1px solid #393b51;min-height:45px;display:flex;justify-content:center;flex-direction:column;gap:4px;padding:9px 11px}
.phone-card b{font:600 10px var(--display);color:#e8e5f3}
.phone-card small{font:8px var(--body);color:#9b9aaf}
.muted-card{opacity:.68}
.mock-terminal{background:#0d1210;border-color:#425244}
.mock-terminal .mock-top{background:#151a16}
.terminal-body{padding:clamp(15px,3vw,32px);display:flex;flex-direction:column;gap:14px;font:clamp(9px,1.2vw,13px)/1.4 var(--mono);color:#d1ddd0}
.terminal-prompt{color:#e9ce58}
.term-line{color:#b9c8b5;opacity:0;animation:log-reveal 8s infinite}
.term-line span{color:#93d09b;margin-right:8px}
.terminal-rule{height:1px;background:#354336;margin-top:4px}
.term-last{animation:log-reveal 8s 4.5s both infinite}
.cursor-block{animation:cursor-blink .8s steps(2) infinite}
.detail-placeholder{font:10px/1.8 var(--mono);color:#737c70;margin:32px 0 0}
@keyframes log-reveal{0%,3%{opacity:0;transform:translateY(5px)}16%,85%{opacity:1;transform:none}100%{opacity:0}}
@keyframes phone-glow{0%,100%{filter:brightness(.85)}50%{filter:brightness(1.16)}}
@keyframes cursor-blink{50%{opacity:0}}
@media(max-width:650px){
 .mock-phone{border-radius:18px;min-height:130px;max-height:230px;width:120px}
 .phone-content{padding:23px 7px 6px;gap:5px}.phone-feature{padding:6px;min-height:65px}
 .phone-title{font-size:12px}.phone-row{font-size:7px}
 .phone-card{min-height:32px;padding:5px}.phone-card b{font-size:8px}
 .terminal-body{font-size:7px;padding:10px;gap:8px}
}
