:root{--accent:#fbff00}.media-shell{display:grid;gap:20px}.media-grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);gap:18px}.media-card{background:#0a0a0a;border:1px solid #353535;border-radius:12px;padding:18px}.media-card h2,.media-card h3{margin-top:0}.dropzone{display:grid;place-items:center;min-height:170px;padding:24px;border:2px dashed #5b5b5b;border-radius:12px;text-align:center;background:#0d0d0d}.dropzone.is-over{border-color:var(--accent);background:#171800}.dropzone input{max-width:100%}.media-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.media-fields .wide{grid-column:1/-1}.media-label{display:grid;gap:6px;color:#d7d7d2}.media-help,.media-meta{color:#aaa;font-size:14px}.media-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}.media-actions button:disabled{opacity:.45;cursor:not-allowed}.media-status{min-height:24px;margin:12px 0 0;color:#bbb}.media-status[data-tone=error]{color:#ff8585}.media-status[data-tone=success]{color:#83e4a2}.media-progress{width:100%;height:10px;margin-top:12px;accent-color:var(--accent);background-color:#202020;border-radius:6px;border:none;overflow:hidden;display:block}.media-progress::-webkit-progress-bar{background-color:#202020;border-radius:6px}.media-progress::-webkit-progress-value{background-color:var(--accent);border-radius:6px;transition:width .2s ease}.media-progress::-moz-progress-bar{background-color:var(--accent);border-radius:6px}.media-preview{display:grid;place-items:center;min-height:180px;background:#050505;border:1px solid #292929;border-radius:10px;overflow:hidden}.media-preview img,.media-preview video{display:block;max-height:420px}.media-result{display:grid;gap:12px}.media-result a{justify-self:start}.media-table{width:100%;border-collapse:collapse}.media-table th,.media-table td{text-align:left;padding:10px;border-bottom:1px solid #303030}.support-note{border-left:3px solid var(--accent);padding:10px 14px;background:#151500}.output-list{display:grid;gap:10px}.output-item{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid #333;border-radius:8px;padding:10px}.age-value{font-size:clamp(28px,5vw,48px);font-weight:900;line-height:1.1}.matrix{overflow:auto}.matrix table{min-width:560px}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@media(max-width:760px){.media-grid,.media-fields{grid-template-columns:1fr}.media-fields .wide{grid-column:auto}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}/* Age Calculator: inputs on top, live card grid below. */
.age-app{display:grid;gap:16px}
.age-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.age-opt{color:#8d8d8d;font-weight:400;font-size:12px}
.age-out{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.age-card{background:#0d0d0d;border:1px solid #2f2f2f;border-radius:14px;padding:16px 18px;min-width:0}
.age-card h3{margin:0 0 12px;font-size:16px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.age-wide{grid-column:1/-1}
.age-hero{border-color:#4a4512;background:linear-gradient(135deg,#1b1a08,#0d0d0d 70%)}
.age-k{margin:0 0 6px;font-size:11px;font-weight:750;letter-spacing:.05em;text-transform:uppercase;color:var(--y,#facc15)}
.age-sub{margin:8px 0 0;color:#bdbdb6;font-size:14px}
.age-hero .age-value{color:#fff}
.age-count{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.age-count>div{text-align:center;padding:10px 4px;border-radius:10px;background:#161616;border:1px solid #2c2c2c}
.age-count b{display:block;font-size:clamp(22px,3.2vw,34px);font-weight:850;color:var(--y,#facc15);font-variant-numeric:tabular-nums;line-height:1.1}
.age-count small{font-size:11px;color:#9a9a9a;text-transform:uppercase;letter-spacing:.04em}
.age-bday{grid-column:1/-1;font-size:28px;color:var(--y,#facc15)}
.age-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px}
.age-tile{padding:11px 13px;border-radius:10px;background:#141414;border:1px solid #2a2a2a;min-width:0}
.age-tile small{display:block;font-size:11.5px;color:#9f9f9a;font-weight:650}
.age-tile b{display:block;margin-top:3px;font-size:18px;font-weight:800;color:#f4f4ee;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.age-tile span{display:block;margin-top:3px;font-size:11.5px;color:#8f8f8a}
.age-live{font-size:11px;font-weight:700;color:#4ade80;letter-spacing:.03em}
.age-approx{font-size:11px;font-weight:700;padding:2px 8px;border-radius:999px;border:1px solid #6b5f12;color:var(--y,#facc15);text-transform:uppercase;letter-spacing:.04em}
.age-list{display:grid;gap:2px}
.age-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;align-items:baseline;padding:8px 2px;border-bottom:1px solid #242424;font-size:14px}
.age-row b{color:#f4f4ee;font-variant-numeric:tabular-nums}
.age-row em{font-style:normal;font-size:12px;color:var(--y,#facc15);min-width:84px;text-align:right}
.age-row.is-past em{color:#4ade80}.age-row.is-past span{color:#9a9a9a}
@media(max-width:760px){.age-fields,.age-out{grid-template-columns:1fr}.age-wide{grid-column:auto}.age-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.age-row{grid-template-columns:minmax(0,1fr) auto}.age-row em{grid-column:1/-1;text-align:left}}
@media(min-width:1100px){.age-grid.age-g7{grid-template-columns:repeat(7,minmax(0,1fr))}.age-grid.age-g4{grid-template-columns:repeat(4,minmax(0,1fr))}}
