.marketplace-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:22px;
}

.ampyan-car-visual{
position:relative;
min-height:170px;
border-radius:20px;
overflow:hidden;
border:1px solid rgba(255,255,255,0.1);
background:
radial-gradient(circle at 76% 18%,rgba(255,90,54,0.26),transparent 30%),
linear-gradient(145deg,#111722,#090b10);
box-shadow:0 18px 44px rgba(0,0,0,0.24);
margin-bottom:16px;
}

.ampyan-car-visual::after{
content:"";
position:absolute;
inset:0;
background:
linear-gradient(180deg,rgba(3,5,10,0.18),rgba(3,5,10,0.72)),
radial-gradient(circle at 72% 18%,rgba(255,90,54,0.18),transparent 28%);
pointer-events:none;
z-index:1;
}

.ampyan-car-visual.compact{
width:220px;
min-height:122px;
margin:0;
flex:0 0 220px;
}

.catalog-car-image{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
object-position:center;
filter:saturate(1.08) contrast(1.05);
transform:scale(1.02);
z-index:0;
}

.ampyan-car-visual.compact .catalog-car-image{
object-position:center 48%;
}

.car-visual-skyline{
position:absolute;
left:0;
right:0;
bottom:34px;
height:34px;
background:
linear-gradient(90deg,rgba(255,255,255,0.06) 12px,transparent 12px 26px,rgba(255,255,255,0.05) 26px 42px,transparent 42px 58px),
linear-gradient(180deg,transparent,rgba(255,255,255,0.04));
opacity:.8;
z-index:1;
}

.car-visual-body{
position:absolute;
left:50%;
bottom:34px;
width:min(76%,300px);
height:74px;
transform:translateX(-50%);
z-index:2;
}

.ampyan-car-visual.compact .car-visual-body{
height:54px;
bottom:26px;
}

.car-visual-roof{
position:absolute;
left:24%;
right:25%;
top:4px;
height:34px;
border-radius:50px 50px 8px 8px;
background:linear-gradient(135deg,#ff8a5b,#ff3f32);
transform:skewX(-12deg);
}

.car-visual-cabin{
position:absolute;
left:0;
right:0;
bottom:0;
height:42px;
border-radius:42px 54px 16px 16px;
background:linear-gradient(135deg,#ff5a36,#ffb15f);
box-shadow:inset 0 -8px 0 rgba(0,0,0,0.18);
}

.car-visual-wheel{
position:absolute;
bottom:-9px;
width:32px;
height:32px;
border-radius:50%;
background:#08090d;
border:7px solid #2d3440;
box-shadow:0 0 0 2px rgba(255,255,255,0.08);
}

.car-visual-wheel.left{
left:15%;
}

.car-visual-wheel.right{
right:15%;
}

.car-visual-meta{
position:absolute;
left:16px;
right:16px;
top:14px;
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:10px;
z-index:3;
}

.car-visual-meta span,
.car-visual-meta strong{
display:block;
color:#fff;
text-shadow:0 2px 10px rgba(0,0,0,0.38);
}

.car-visual-meta span{
font-size:12px;
font-weight:900;
letter-spacing:.14em;
text-transform:uppercase;
color:#ffccb8;
}

.car-visual-meta strong{
font-size:20px;
line-height:1.05;
text-align:right;
}

.garage-list-car-row{
display:flex;
gap:18px;
align-items:center;
margin-bottom:18px;
}

.marketplace-card{
display:grid;
gap:14px;
padding:22px;
border-radius:22px;
border:1px solid var(--border);
background:var(--card);
box-shadow:var(--shadow-md);
}

.marketplace-card h2{
margin:0;
font-size:22px;
line-height:1.25;
}

.marketplace-card p{
margin:0;
color:var(--text-secondary);
line-height:1.65;
}

.marketplace-owner-row{
display:flex;
gap:12px;
flex-wrap:wrap;
color:var(--text-secondary);
font-size:13px;
}

.marketplace-owner-row span{
display:inline-flex;
align-items:center;
gap:7px;
}

.marketplace-form-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:12px;
}

@media(max-width:768px){
.garage-list-car-row{
display:grid;
}

.ampyan-car-visual.compact{
width:100%;
}

.marketplace-form-grid{
grid-template-columns:1fr;
gap:0;
}
}

/* ================= SHARED PAGE SYSTEM ================= */

.tools-page{
padding:56px 0 80px;
max-width:1200px;
margin:auto;
}

.tools-title{
font-size:clamp(32px,4vw,44px);
font-weight:800;
margin-bottom:10px;
letter-spacing:0.02em;
}

.tools-subtitle{
color:var(--text-secondary);
margin-bottom:34px;
font-size:15px;
line-height:1.7;
max-width:760px;
}

.explore-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
gap:24px;
}

.explore-card{
background:var(--card);
border:1px solid var(--border);
border-radius:22px;
padding:24px;
transition:all 0.25s ease;
box-shadow:var(--shadow-md);
}

.explore-card:hover{
border-color:rgba(255,90,54,0.28);
transform:translateY(-4px);
box-shadow:0 24px 44px rgba(0,0,0,0.24);
}

.tool-icon{
font-size:26px;
margin-bottom:12px;
}

.explore-card h3{
font-size:18px;
margin-bottom:10px;
}

.explore-card p{
font-size:14px;
color:var(--text-secondary);
line-height:1.7;
}

.tool-button{
display:inline-block;
margin-top:14px;
padding:11px 16px;
font-size:13px;
background:linear-gradient(135deg,var(--accent),var(--accent-strong));
color:white;
border-radius:12px;
text-decoration:none;
font-weight:700;
}

.disabled{
opacity:0.55;
}

.coming{
display:inline-block;
margin-top:10px;
font-size:12px;
color:var(--text-secondary);
}

.login-reminder{
margin-top:30px;
background:var(--card);
border:1px solid var(--border);
padding:24px;
border-radius:22px;
text-align:center;
box-shadow:var(--shadow-md);
}

.login-reminder p{
color:var(--text-secondary);
margin-bottom:10px;
}

.form-label{
color:var(--text-secondary);
font-size:13px;
margin-top:10px;
display:block;
margin-bottom:6px;
}

.preset-buttons{
display:flex;
gap:8px;
margin-top:8px;
flex-wrap:wrap;
}

.preset-buttons button{
padding:8px 14px;
border-radius:999px;
background:rgba(255,255,255,0.05);
color:var(--text-soft);
border:1px solid var(--border);
cursor:pointer;
font-size:12px;
}

.preset-buttons button:hover{
background:var(--accent-soft);
border-color:rgba(255,90,54,0.35);
color:#fff;
}

.form-group{
margin-bottom:18px;
}

.health-circle{
position:relative;
width:120px;
height:120px;
margin:10px auto;
}

.health-number{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
font-size:22px;
font-weight:bold;
}

.component-grid{
display:grid;
grid-template-columns:1fr 1fr;
gap:12px;
margin-top:12px;
}

.component-card{
background:rgba(255,255,255,0.04);
padding:14px;
border-radius:16px;
font-size:13px;
border:1px solid var(--border);
}

.component-bar{
height:6px;
background:rgba(255,255,255,0.08);
border-radius:4px;
margin:6px 0;
}

.component-bar div{
height:6px;
background:linear-gradient(135deg,var(--accent),var(--accent-strong));
border-radius:4px;
}

.vehicle-dashboard{
margin-top:90px;
text-align:center;
}

.vehicle-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:20px;
margin-top:30px;
}

.vehicle-card{
background:var(--card);
padding:25px;
border-radius:22px;
border:1px solid var(--border);
transition:0.25s;
box-shadow:var(--shadow-md);
}

.vehicle-card:hover{
transform:translateY(-3px);
border-color:rgba(255,90,54,0.24);
}

.health-score{
font-size:38px;
font-weight:800;
color:var(--accent);
}

.post-card{
background:var(--card);
border:1px solid var(--border);
padding:20px;
border-radius:20px;
margin-bottom:16px;
transition:0.3s;
box-shadow:var(--shadow-md);
}

.post-card:hover{
border-color:rgba(255,90,54,0.24);
transform:translateY(-3px);
}

.post-header{
display:flex;
align-items:center;
}

.page-shell{
padding:56px 0 86px;
}

.page-header{
display:flex;
justify-content:space-between;
align-items:flex-end;
gap:20px;
flex-wrap:wrap;
margin-bottom:34px;
}

.page-header-copy{
max-width:760px;
}

.page-kicker{
margin:0 0 12px;
font-size:12px;
letter-spacing:0.2em;
text-transform:uppercase;
color:#ffad96;
font-weight:700;
}

.page-title{
margin:0;
font-size:clamp(34px,4.5vw,52px);
line-height:1.06;
letter-spacing:0.02em;
}

.page-subtitle{
margin:14px 0 0;
color:var(--text-secondary);
line-height:1.75;
font-size:15px;
}

.ui-card{
background:var(--card);
border:1px solid var(--border);
border-radius:24px;
padding:26px;
backdrop-filter:blur(18px);
box-shadow:var(--shadow-md);
}

.ui-grid{
display:grid;
gap:24px;
}

.ui-grid-2{
grid-template-columns:repeat(2,minmax(0,1fr));
}

.ui-grid-3{
grid-template-columns:repeat(3,minmax(0,1fr));
}

.ui-grid-4{
grid-template-columns:repeat(4,minmax(0,1fr));
}

.section-heading{
margin:0 0 18px;
font-size:26px;
letter-spacing:0.02em;
}

.section-copy{
color:var(--text-secondary);
line-height:1.7;
}

.empty-state{
padding:32px;
border:1px dashed rgba(255,255,255,0.16);
border-radius:22px;
text-align:center;
color:var(--text-secondary);
background:rgba(255,255,255,0.03);
}

.ui-pill-row{
display:flex;
gap:10px;
flex-wrap:wrap;
}

.ui-pill{
display:inline-flex;
align-items:center;
padding:8px 12px;
border-radius:999px;
background:rgba(255,255,255,0.05);
border:1px solid var(--border);
font-size:13px;
color:var(--text-secondary);
}

.ui-button-row{
display:flex;
gap:12px;
flex-wrap:wrap;
}

.story-download-form{
display:inline-flex;
margin:0 12px 12px 0;
}

.ui-button-secondary,
.ui-button-danger{
display:inline-flex;
align-items:center;
justify-content:center;
padding:13px 18px;
border-radius:14px;
text-decoration:none;
font-weight:700;
min-width:120px;
transition:transform .2s, border-color .2s, background .2s;
}

.ui-button-secondary{
background:rgba(255,255,255,0.04);
border:1px solid var(--border);
color:var(--text);
}

.ui-button-secondary:hover{
transform:translateY(-1px);
border-color:rgba(255,90,54,0.26);
}

.ui-button-danger{
background:rgba(220,38,38,0.14);
border:1px solid rgba(220,38,38,0.28);
color:#ffd7d7;
}

.ui-button-danger:hover{
transform:translateY(-1px);
background:rgba(220,38,38,0.20);
}

.ui-meta-list{
display:grid;
gap:12px;
margin-top:16px;
}

.ui-meta-item{
display:flex;
justify-content:space-between;
gap:16px;
padding-bottom:12px;
border-bottom:1px solid rgba(255,255,255,0.06);
}

.ui-meta-item:last-child{
border-bottom:none;
padding-bottom:0;
}

.ui-meta-label{
color:var(--text-secondary);
font-size:14px;
}

.ui-meta-value{
text-align:right;
font-weight:700;
}

.ui-list{
margin:0;
padding-left:18px;
color:var(--text-secondary);
line-height:1.75;
}

.ui-list li + li{
margin-top:6px;
}

.ui-tag-good{
color:var(--success);
}

.ui-tag-warn{
color:var(--warn);
}

.ui-tag-danger{
color:var(--danger);
}

.file-input{
width:100%;
padding:12px;
border-radius:14px;
border:1px solid var(--border);
background:rgba(255,255,255,0.03);
color:var(--text-secondary);
}

.news-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:24px;
}

.news-card-ui{
overflow:hidden;
padding:0;
}

.news-card-body{
padding:22px;
}

.news-card-image{
width:100%;
height:210px;
object-fit:cover;
}

.news-card-title{
margin:0 0 10px;
font-size:22px;
}

.news-card-date{
font-size:13px;
color:var(--text-secondary);
}

.news-card-actions{
display:flex;
gap:10px;
padding:0 22px 22px;
}

.simple-list{
display:grid;
gap:18px;
list-style:none;
padding:0;
margin:0;
}

.simple-list-card{
padding:24px;
border-radius:22px;
border:1px solid var(--border);
background:rgba(255,255,255,0.03);
box-shadow:var(--shadow-md);
}

.card-spacer{
margin-bottom:24px;
}

.narrow-card{
max-width:860px;
margin:0 auto 28px;
}

.narrow-card:last-child{
margin-bottom:0;
}

.body-copy-lg{
font-size:16px;
line-height:1.8;
color:var(--text-secondary);
}

.story-grid{
display:grid;
grid-template-columns:1.2fr 0.8fr;
gap:24px;
align-items:stretch;
}

.story-stack{
display:grid;
gap:18px;
}

.story-block{
padding:28px;
border-radius:24px;
background:var(--card);
border:1px solid var(--border);
box-shadow:var(--shadow-md);
}

.story-block h2,
.story-block h3{
margin:0 0 12px;
letter-spacing:0.02em;
}

.story-block p{
margin:0;
color:var(--text-secondary);
line-height:1.8;
}

.feature-checklist{
display:grid;
gap:12px;
margin:0;
padding:0;
list-style:none;
}

.feature-checklist li{
padding:14px 16px;
border-radius:16px;
border:1px solid var(--border);
background:rgba(255,255,255,0.03);
color:var(--text-soft);
}

.feature-checklist strong{
display:block;
margin-bottom:4px;
color:var(--text);
}

.metric-panel{
display:grid;
gap:14px;
}

.metric-chip{
display:flex;
justify-content:space-between;
align-items:center;
gap:14px;
padding:16px 18px;
border-radius:18px;
background:rgba(255,255,255,0.04);
border:1px solid var(--border);
}

.metric-chip span{
color:var(--text-secondary);
font-size:13px;
text-transform:uppercase;
letter-spacing:0.12em;
}

.metric-chip strong{
font-size:20px;
}

.platform-flow{
display:grid;
gap:16px;
margin-top:12px;
}

.platform-node{
padding:22px;
border-radius:22px;
background:rgba(255,255,255,0.04);
border:1px solid var(--border);
text-align:center;
}

.platform-node strong{
display:block;
font-size:20px;
margin-bottom:6px;
}

.contact-panel{
display:grid;
grid-template-columns:1fr 1fr;
gap:24px;
}

.contact-card{
padding:26px;
border-radius:24px;
background:var(--card);
border:1px solid var(--border);
box-shadow:var(--shadow-md);
}

.contact-label{
font-size:12px;
letter-spacing:0.14em;
text-transform:uppercase;
color:#ffb199;
margin-bottom:10px;
}

.contact-value{
font-size:22px;
font-weight:700;
letter-spacing:0.01em;
}

.contact-copy{
margin-top:10px;
color:var(--text-secondary);
line-height:1.8;
}

.help-message-stack{
display:grid;
gap:10px;
margin-bottom:18px;
}

.help-message{
padding:14px 16px;
border-radius:16px;
background:rgba(93,211,158,0.10);
border:1px solid rgba(93,211,158,0.24);
color:#c8ffe4;
}

.help-layout{
display:grid;
grid-template-columns:minmax(0,1fr) minmax(300px,0.75fr);
gap:24px;
align-items:start;
}

.help-form-card,
.help-info-card{
padding:26px;
border-radius:24px;
background:var(--card);
border:1px solid var(--border);
box-shadow:var(--shadow-md);
}

.help-form-card .auth-input{
margin-bottom:14px;
}

.help-textarea{
min-height:150px;
resize:vertical;
}

.help-submit{
width:100%;
margin-top:6px;
}

.help-info-card{
background:
radial-gradient(circle at top right,rgba(255,90,54,0.16),transparent 34%),
var(--card);
}

.help-info-icon{
width:56px;
height:56px;
display:flex;
align-items:center;
justify-content:center;
border-radius:18px;
background:rgba(255,90,54,0.14);
border:1px solid rgba(255,90,54,0.24);
color:#ffb199;
font-size:24px;
margin-bottom:18px;
}

.help-info-card h2{
margin:0 0 16px;
font-size:26px;
}

.help-info-list{
display:grid;
gap:12px;
margin-bottom:18px;
}

.help-info-list div{
display:flex;
gap:10px;
align-items:flex-start;
padding:14px;
border-radius:16px;
background:rgba(255,255,255,0.04);
border:1px solid rgba(255,255,255,0.06);
}

.help-info-list i{
color:#ffb199;
margin-top:3px;
}

.help-info-list span,
.help-info-card p{
color:var(--text-secondary);
line-height:1.7;
}

@media(max-width:820px){
.help-layout{
grid-template-columns:1fr;
}
}

.legal-layout{
display:grid;
gap:24px;
}

.legal-card-shell{
padding:30px;
border-radius:24px;
background:var(--card);
border:1px solid var(--border);
box-shadow:var(--shadow-md);
}

.legal-updated,
.updated{
margin:0 0 14px;
color:var(--text-secondary);
font-size:14px;
}

.legal-list{
margin:0;
padding-left:18px;
color:var(--text-secondary);
line-height:1.8;
}

.video-grid{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:24px;
}

.video-alert-stack{
display:grid;
gap:10px;
margin:0 0 18px;
}

.video-alert{
padding:14px 16px;
border-radius:16px;
border:1px solid var(--border);
background:rgba(255,255,255,0.04);
color:var(--text-soft);
font-size:14px;
}

.video-alert.success{
border-color:rgba(93,211,158,0.32);
background:rgba(93,211,158,0.10);
}

.video-alert.error{
border-color:rgba(255,123,123,0.32);
background:rgba(255,123,123,0.10);
}

.video-add-form{
padding:24px;
margin:0 0 28px;
border-radius:24px;
background:var(--card);
border:1px solid var(--border);
box-shadow:var(--shadow-md);
}

.video-form-grid{
display:grid;
grid-template-columns:1fr 1.3fr;
gap:18px;
align-items:end;
}

.video-submit-btn{
margin-top:18px;
}

.video-card{
padding:20px;
border-radius:24px;
background:var(--card);
border:1px solid var(--border);
box-shadow:var(--shadow-md);
}

.video-frame{
width:100%;
aspect-ratio:16/9;
border:none;
border-radius:18px;
overflow:hidden;
background:rgba(255,255,255,0.04);
}

.video-card h3{
margin:16px 0 8px;
font-size:20px;
}

.video-card p{
margin:0;
color:var(--text-secondary);
line-height:1.7;
}

@media(max-width:720px){
.video-form-grid{
grid-template-columns:1fr;
}
}

.news-detail-image{
width:100%;
max-height:460px;
object-fit:cover;
border-radius:22px;
margin:18px 0 22px;
}

.feedback-card{
text-align:center;
}

.feedback-actions{
display:flex;
justify-content:center;
gap:12px;
flex-wrap:wrap;
}

.diagnosis-cta{
display:inline-flex;
align-items:center;
justify-content:center;
padding:14px 20px;
border-radius:14px;
background:linear-gradient(135deg,var(--accent),var(--accent-strong));
color:#fff;
font-weight:700;
box-shadow:0 16px 30px rgba(255,90,54,0.22);
}

.admin-priority-grid{
display:grid;
grid-template-columns:1.1fr 1fr 1fr;
gap:24px;
}

.admin-alert-stack,
.admin-mini-stats,
.admin-compact-list{
display:grid;
gap:12px;
}

.admin-alert-row,
.admin-mini-stats div,
.admin-compact-row{
display:flex;
justify-content:space-between;
align-items:center;
gap:14px;
padding:16px 18px;
border-radius:18px;
background:rgba(255,255,255,0.03);
border:1px solid var(--border);
}

.admin-alert-row strong,
.admin-mini-stats strong{
font-size:22px;
}

.admin-mini-stats span{
color:var(--text-secondary);
font-size:13px;
text-transform:uppercase;
letter-spacing:0.10em;
}

.admin-section-head,
.admin-user-top{
display:flex;
justify-content:space-between;
align-items:flex-start;
gap:16px;
flex-wrap:wrap;
margin-bottom:18px;
}

.admin-queue-card{
border-color:rgba(255,90,54,0.18);
}

.admin-studio-nav{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
gap:12px;
}

.admin-studio-nav a{
display:flex;
align-items:center;
gap:10px;
padding:14px 16px;
border-radius:16px;
border:1px solid var(--border);
background:rgba(255,255,255,0.03);
color:var(--text-primary);
font-weight:700;
transition:0.25s;
}

.admin-studio-nav a:hover,
.admin-studio-nav a.active{
border-color:rgba(255,90,54,0.55);
background:rgba(255,90,54,0.10);
transform:translateY(-1px);
}

.admin-studio-nav i{
color:var(--accent);
}

.admin-compact-row h3,
.admin-user-card h3{
margin:0 0 4px;
font-size:18px;
}

.admin-compact-row .section-copy,
.admin-user-card .section-copy{
margin:0;
}

.admin-vehicle-stats{
grid-template-columns:repeat(6,minmax(0,1fr));
margin-bottom:18px;
}

.admin-car-grid{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:16px;
}

.admin-car-card{
display:grid;
gap:16px;
}

.admin-car-meta{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:10px;
}

.admin-car-meta div{
padding:12px;
border-radius:14px;
background:rgba(255,255,255,0.03);
border:1px solid var(--border);
}

.admin-car-meta span{
display:block;
margin-bottom:5px;
font-size:11px;
letter-spacing:0.10em;
text-transform:uppercase;
color:var(--text-secondary);
}

.admin-car-meta strong{
font-size:14px;
color:var(--text-primary);
}

.admin-analytics-grid{
display:grid;
grid-template-columns:repeat(3,minmax(0,1fr));
gap:16px;
}

.admin-analytics-panel{
padding:18px;
border-radius:18px;
border:1px solid var(--border);
background:rgba(255,255,255,0.03);
min-width:0;
}

.admin-wide-panel{
grid-column:1 / -1;
}

.admin-analytics-panel h3{
margin:0 0 14px;
font-size:17px;
}

.admin-bar-list{
display:grid;
gap:10px;
}

.admin-bar-row{
display:grid;
grid-template-columns:90px minmax(80px,1fr) 34px;
align-items:center;
gap:10px;
font-size:12px;
color:var(--text-secondary);
}

.admin-bar-row div{
height:8px;
border-radius:999px;
background:rgba(255,255,255,0.06);
overflow:hidden;
}

.admin-bar-row i{
display:block;
height:100%;
min-width:4px;
border-radius:999px;
background:linear-gradient(90deg,var(--accent),#4aa3ff);
}

.admin-table-wrap{
overflow-x:auto;
}

.admin-analytics-table{
width:100%;
border-collapse:collapse;
min-width:760px;
}

.admin-analytics-table th,
.admin-analytics-table td{
padding:12px;
border-bottom:1px solid var(--border);
text-align:left;
font-size:13px;
}

.admin-analytics-table th{
color:var(--text-secondary);
text-transform:uppercase;
letter-spacing:0.08em;
font-size:11px;
}

.admin-alert-row small{
display:block;
margin-top:4px;
color:var(--text-secondary);
line-height:1.5;
}

@media(max-width:900px){
.page-shell{
padding:42px 0 72px;
}

.story-grid,
.contact-panel,
.admin-priority-grid,
.ui-grid-2,
.ui-grid-3,
.ui-grid-4,
.component-grid{
grid-template-columns:1fr;
}

.page-title{
font-size:34px;
}

.ui-card,
.simple-list-card{
padding:22px;
}

.admin-vehicle-stats,
.admin-car-grid,
.admin-car-meta,
.admin-analytics-grid{
grid-template-columns:1fr;
}
}