/* Local, fixed-content interaction preview; it never sends a chat request. */
.home-grok-section .home-feature-row{grid-template-columns:minmax(0,1.6fr) minmax(0,.9fr);gap:44px}
.home-page .grok-preview{padding:24px 21px;border-radius:28px;min-width:0}
.grok-preview-hint{font-size:11px;line-height:1.7;color:#718266;text-align:center;margin:0 0 18px}
.grok-preview-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.85fr);align-items:stretch;gap:16px;min-width:0}
.grok-preview-grid[data-grok-collapsed=true]{grid-template-columns:minmax(0,1fr) 24px}
.grok-preview-feed{min-width:0;border:1px solid #dfe6d6;border-radius:14px;background:#ffffffdc;overflow:hidden}
.grok-preview-feed-head{display:flex;align-items:center;gap:10px;padding:14px 13px 12px;border-bottom:1px solid #e2e8db;color:#4f5c46;min-width:0}
.grok-preview-feed-head>span{font-size:21px;line-height:1}
.grok-preview-feed-head strong{font-size:11px;font-weight:600;white-space:nowrap}
.grok-preview-feed-head small{margin-left:auto;color:#859178;font-size:8px;line-height:1.4;text-align:right}
.grok-preview-post{padding:14px 13px 11px;border-bottom:1px solid #e4e9de;transition:background .16s}
.grok-preview-post:last-child{border-bottom:0}
.grok-preview-post.is-selected{background:#f4f8ed}
.grok-preview-person{display:flex;align-items:center;gap:7px;min-width:0}
.grok-preview-avatar{display:grid;place-items:center;flex:0 0 28px;height:28px;border-radius:50%;font-size:11px;font-weight:600;color:#8b7d8a;background:#ece3eb}
.grok-preview-avatar.green{color:#6f8565;background:#e2ead7}
.grok-preview-avatar.sand{color:#9b8e67;background:#eee6d4}
.grok-preview-person>div{display:flex;flex-direction:column;gap:2px;min-width:0}
.grok-preview-person strong{font-size:11px;line-height:1.3;font-weight:650}
.grok-preview-person small{font-size:8px;color:#8b9681;line-height:1.3;overflow-wrap:anywhere}
.grok-preview-post-button{margin-left:auto;display:grid;place-items:center;flex:0 0 28px;width:28px;height:28px;padding:5px;border-radius:50%;background:transparent;color:#76876a;transition:background .16s,color .16s}
.grok-preview-post-button svg{width:18px;height:18px}
.grok-preview-post-button:hover,.grok-preview-post-button[aria-pressed=true]{background:#e3edcf;color:#506b3c}
.grok-preview-post-copy{font-size:11px;line-height:1.75;color:#58624e;margin:10px 0 12px;overflow-wrap:anywhere}
.grok-preview-post-actions{display:flex;justify-content:space-between;gap:12px;color:#9ba88d;padding-right:9px}
.grok-preview-post-actions svg{width:12px;height:12px}
.grok-preview-panel{display:flex;flex-direction:column;gap:10px;min-width:0;padding-top:2px}
.grok-preview-panel-head{display:flex;align-items:center;gap:5px;min-height:28px;padding-right:27px;color:#62764f}
.grok-preview-panel-head svg{width:16px;height:16px}
.grok-preview-panel-head strong{font-size:12px}
.grok-preview-panel-head>span{margin-left:auto;font-size:8px;color:#91a081}
.grok-preview-messages{flex:1;min-width:0}
.grok-preview-context{padding:10px;border-left:2px solid #b6c69d;border-radius:0 8px 8px 0;background:#ffffff8c;color:#69785d;min-width:0}
.grok-preview-context>span{display:block;font-size:8px;color:#8c987c;margin-bottom:6px}
.grok-preview-context strong{display:block;font-size:10px;font-weight:600;line-height:1.5}
.grok-preview-context small{font-size:8px;color:#94a085;font-weight:400;overflow-wrap:anywhere}
.grok-preview-context p{font-size:9px;line-height:1.6;margin:6px 0 0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.grok-preview-question{font-size:10px;line-height:1.7;color:#637653;margin:13px 0 11px;padding:8px 10px;border-radius:12px 12px 2px 12px;background:#dfe9d0}
.grok-preview-answer>div{display:flex;align-items:center;gap:5px;color:#62764f}
.grok-preview-answer>div svg{width:15px;height:15px}
.grok-preview-answer strong{font-size:11px;font-weight:650}
.grok-preview-answer>div>span{font-size:8px;color:#91a081;margin-left:auto}
.grok-preview-answer p{font-size:10px;line-height:1.8;color:#66775a;margin:7px 0 16px;overflow-wrap:anywhere}
.grok-preview-composer{padding:11px 10px 9px;border:1px solid #d7e0c9;border-radius:16px;background:#fffffff0;color:#7b8a6d;box-shadow:0 5px 16px #64724c05}
.grok-preview-composer>span{display:block;font-size:10px;margin-bottom:16px}
.grok-preview-composer>div{display:flex;align-items:center;gap:8px}
.grok-preview-composer svg{width:14px;height:14px}
.grok-preview-mode{display:flex;align-items:center;gap:3px;font-size:9px;margin-left:auto}
.grok-preview-mode svg{width:11px;height:11px}
.grok-preview-voice{width:25px;height:25px;display:grid;place-items:center;border-radius:50%;background:#6f8259;color:white}
.grok-preview-tools{display:flex;justify-content:flex-end;align-items:center;gap:10px;min-height:28px;color:#869a70}
.grok-preview-tools svg{width:14px;height:14px}
.grok-preview-toggle{position:absolute;right:0;top:2px;display:grid;place-items:center;width:20px;height:28px;padding:2px;border:1px solid #cbd9b9;border-radius:6px;color:#7e9566;background:#edf3e5}
.grok-preview-toggle svg{width:13px;height:13px}
.grok-preview-toggle:hover{background:#dfeacd;color:#536c3d}
.grok-preview-toggle[aria-expanded=false] svg{transform:rotate(180deg)}
.grok-preview button:focus-visible{outline:2px solid #9aab70;outline-offset:3px}
@media(max-width:1150px){
 .home-grok-section .home-feature-row{grid-template-columns:minmax(0,1.5fr) minmax(0,.85fr);gap:28px}
 .home-page .grok-preview{padding:20px 14px}
 .grok-preview-grid{gap:12px}
 .grok-preview-feed-head{gap:7px;padding:12px 10px}
 .grok-preview-feed-head small{display:none}
 .grok-preview-post{padding:12px 10px 10px}
 .grok-preview-tools{gap:7px}
}
@media(max-width:900px){
 .home-grok-section .home-feature-row{display:flex;flex-direction:column;align-items:stretch;gap:28px}
 .home-grok-section .home-feature-copy{order:0;max-width:600px}
 .home-page .grok-preview{padding:26px;max-width:760px;width:100%;margin:0 auto}
 .grok-preview-grid{gap:20px}
 .grok-preview-feed-head small{display:block}
 .grok-preview-post-copy{font-size:12px}
 .grok-preview-context p,.grok-preview-answer p,.grok-preview-question{font-size:11px}
 .grok-preview-person strong{font-size:12px}
}
@media(max-width:500px){
 .home-page .grok-preview{padding:20px 10px;border-radius:20px}
 .grok-preview-hint{font-size:10px;line-height:1.7;margin-bottom:14px}
 .grok-preview-grid{grid-template-columns:minmax(0,1.2fr) minmax(0,.85fr);gap:9px}
 .grok-preview-feed{border-radius:10px}
 .grok-preview-feed-head{padding:11px 8px;gap:7px}
 .grok-preview-feed-head>span{font-size:18px}
 .grok-preview-feed-head strong{font-size:10px}
 .grok-preview-feed-head small{display:none}
 .grok-preview-post{padding:11px 8px 9px}
 .grok-preview-person{gap:5px}
 .grok-preview-avatar{flex-basis:22px;height:22px;font-size:9px}
 .grok-preview-person strong{font-size:10px}
 .grok-preview-person small{font-size:7px}
 .grok-preview-post-button{flex-basis:24px;width:24px;height:24px;padding:4px}
 .grok-preview-post-button svg{width:16px;height:16px}
 .grok-preview-post-copy{font-size:10px;line-height:1.75;margin:9px 0 10px}
 .grok-preview-post-actions{gap:7px;padding-right:0}
 .grok-preview-post-actions svg{width:10px;height:10px}
 .grok-preview-panel-head>span{display:none}
 .grok-preview-context{padding:8px 7px}
 .grok-preview-context strong{font-size:9px}
 .grok-preview-context small{display:block;font-size:7px}
 .grok-preview-context p{font-size:8px;line-height:1.7}
 .grok-preview-question{font-size:9px;padding:7px;margin:10px 0}
 .grok-preview-answer>div{gap:3px}
 .grok-preview-answer>div svg{width:12px;height:12px}
 .grok-preview-answer strong{font-size:10px}
 .grok-preview-answer p{font-size:9px;line-height:1.85}
 .grok-preview-composer{padding:9px 7px 7px;border-radius:12px}
 .grok-preview-composer>span{font-size:9px;margin-bottom:13px}
 .grok-preview-composer>div{gap:4px}
 .grok-preview-composer svg{width:12px;height:12px}
 .grok-preview-mode{font-size:8px;gap:1px}
 .grok-preview-mode svg{width:9px;height:9px}
 .grok-preview-voice{width:21px;height:21px}
 .grok-preview-tools{gap:6px}
 .grok-preview-tools svg{width:12px;height:12px}
 .grok-preview-toggle{width:18px}
}
@media(prefers-reduced-motion:reduce){.grok-preview-post,.grok-preview-post-button{transition:none}}