:root{
  --page:#e8eaec;
  --paper:#fff;
  --soft:#f5f6f7;
  --soft2:#eceeef;
  --text:#34383c;
  --muted:#697077;
  --dark:#24282b;
  --dark2:#30353a;
  --line:#c9cdd1;
  --line-dark:#8e9499;
  --gold:#b89e57;
  --gold-light:#e6dbb6;
  --gold-dark:#826d35;
  --max:1040px;
  --radius:6px;
  --shadow:0 8px 22px rgba(28,32,35,.07);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(#f1f2f3 0,#e8eaec 190px,#e8eaec 100%);color:var(--text);font:14px/1.62 "Segoe UI",Tahoma,Arial,sans-serif}
a{color:#3c5365;text-decoration:none}a:hover{color:#1d3548;text-decoration:underline}
img{max-width:100%;height:auto}

.site-header{max-width:var(--max);margin:18px auto 0;background:var(--paper);border:1px solid var(--line-dark);border-bottom:0;box-shadow:var(--shadow)}
.nav-wrap{min-height:126px;padding:10px 22px;display:flex;align-items:center;gap:28px;background:linear-gradient(#fff,#fafafa)}
.brand{display:block;flex:0 0 215px;text-align:center}.brand:hover{text-decoration:none}.brand-logo{width:205px;height:auto;display:block;margin:auto}
.header-copy{min-width:0;flex:1;border-left:1px solid #ddd;padding-left:26px}.header-copy strong{display:block;font:600 17px/1.3 "Segoe UI",Arial,sans-serif;color:#303438;margin-bottom:6px}.header-copy p{margin:0 0 13px;color:#7a8086;font-size:12px}.codec-badges{display:flex;align-items:center;gap:14px;min-height:28px;flex-wrap:wrap}.codec-badges img{display:block;object-fit:contain;max-height:20px;width:auto;opacity:.88}
.nav{display:flex;justify-content:flex-start;align-items:center;gap:0;min-height:42px;padding:0 16px;background:var(--dark);border-top:3px solid var(--gold);border-bottom:1px solid #171a1d}
.nav a{color:#e4e7e9;padding:12px 15px;font:600 12px/1.2 "Segoe UI",Arial,sans-serif;border-right:1px solid rgba(255,255,255,.08)}
.nav a:first-child{border-left:1px solid rgba(255,255,255,.08)}
.nav a:hover,.nav a[aria-current="page"]{text-decoration:none;color:#fff;background:var(--dark2);box-shadow:inset 0 -3px var(--gold)}

.hero,.page-hero{max-width:var(--max);margin:0 auto;background:var(--paper);border-left:1px solid var(--line-dark);border-right:1px solid var(--line-dark)}
.hero-inner{padding:38px 34px 34px;display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:34px;align-items:center;border-bottom:1px solid var(--line)}
.page-hero-inner{padding:30px 34px 26px;border-bottom:1px solid var(--line)}
.eyebrow{font:700 10px/1.3 "Segoe UI",Arial,sans-serif;letter-spacing:.11em;text-transform:uppercase;color:var(--gold-dark)}
.eyebrow:before{content:"";display:inline-block;width:24px;height:2px;background:var(--gold);vertical-align:middle;margin-right:8px}
h1{margin:8px 0 12px;font:650 32px/1.14 "Segoe UI",Arial,sans-serif;color:#292d31;letter-spacing:-.018em}.hero h1{font-size:39px}.hero p,.page-hero p{margin:0 0 18px;color:#60666c;font-size:15px;max-width:690px}.hero-actions{display:flex;flex-wrap:wrap;gap:9px}.breadcrumbs{font-size:11px;color:#81878c;margin-bottom:9px}.breadcrumbs a{color:#626970}
.legacy-card{border:1px solid var(--line);border-top:3px solid var(--gold);border-radius:var(--radius);background:var(--soft);padding:17px 18px}.legacy-card .label{display:block;margin-bottom:8px;font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#777047}.legacy-card strong{display:block;color:#2e3236;font:650 16px "Segoe UI",Arial,sans-serif;margin-bottom:6px}.legacy-card p{font-size:12px;margin:0;color:#70767c}

main{max-width:var(--max);margin:0 auto;padding:32px 34px 44px;background:#fff;border-left:1px solid var(--line-dark);border-right:1px solid var(--line-dark);min-height:380px}
.section-head{display:flex;justify-content:space-between;gap:20px;align-items:flex-end;margin:0 0 16px;padding:0 0 9px;border-bottom:1px solid var(--line)}
main > .section-head:not(:first-child){margin-top:30px}.seo-history{margin-top:30px}.section-head h2{font:650 21px "Segoe UI",Arial,sans-serif;color:#2d3135;margin:0}.section-head p{margin:0;color:#70767c;font-size:12px;max-width:640px}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.grid>.card{display:flex;flex-direction:column}.grid>.card .btn{align-self:flex-start;margin-top:auto}.card,.prose,.side-card,.calc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 2px 6px rgba(25,30,34,.035)}.card{padding:20px 20px 21px}.card.featured{border-top:3px solid var(--gold)}.card h3{font:650 19px "Segoe UI",Arial,sans-serif;margin:7px 0 8px;color:#303438}.card p{color:#666d73;margin:0 0 15px;font-size:13px}.meta{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:10px}.pill{display:inline-block;padding:3px 7px;border:1px solid #d3d6d8;border-radius:12px;background:#f3f4f5;color:#686e74;font-size:10px;font-weight:700}.pill.current{background:#f5efdc;border-color:#dbc994;color:#695824}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:35px;padding:8px 14px;border:1px solid #a7adb2;border-radius:4px;background:linear-gradient(#fff,#eceeef);color:#303438;text-decoration:none;font:650 12px "Segoe UI",Arial,sans-serif;box-shadow:inset 0 1px #fff;transition:.12s ease}.btn:hover{text-decoration:none;background:#f8f9f9;color:#181b1d;border-color:#898f94}.btn-gold{background:linear-gradient(#efe6c8,#cbb773);border-color:#9d874b;color:#403719}.btn-gold:hover{background:linear-gradient(#f8f2df,#d5c184);color:#30280f}.btn-dark{background:linear-gradient(#3a3f43,#272b2e);color:#fff;border-color:#202427;text-shadow:0 1px #111}.btn-dark:hover{background:#353a3e;color:#fff}.btn-light{background:linear-gradient(#fff,#eceeef)}
.notice,.legacy-warning{background:#fffaf0;border:1px solid #dfcf9f;color:#5b5134;border-radius:var(--radius);padding:13px 15px;margin:18px 0;font-size:12px}.notice strong,.legacy-warning strong{color:#39321f}.legacy-warning p{margin:4px 0 0;color:#6d6346}
.archive-strip strong{font:650 14px "Segoe UI",Arial,sans-serif;color:#303438}
.related-sites{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:0}.related-site{display:block;border:1px solid var(--line);border-radius:var(--radius);padding:17px 18px;background:linear-gradient(#fff,#fafafa);color:inherit}.related-site:hover{text-decoration:none;border-color:#aeb4b8;box-shadow:0 5px 15px rgba(30,35,39,.06)}.related-site strong{display:block;color:#303438;font-size:15px;margin-bottom:3px}.related-site span{display:block;color:#70767c;font-size:12px}.related-site em{display:block;margin-top:9px;color:var(--gold-dark);font-style:normal;font-size:11px;font-weight:700}

.content-grid{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;align-items:start}.prose{padding:22px 23px 24px}.prose h2{font:650 19px "Segoe UI",Arial,sans-serif;color:#303438;margin:28px 0 10px;padding:0 0 6px;border-bottom:1px solid #e2e4e6}.prose h2:first-child{margin-top:0}.prose h3{font:650 15px "Segoe UI",Arial,sans-serif;color:#303438;margin:21px 0 7px}.prose p,.prose li{color:#555d63;font-size:13px}.prose ul{padding-left:21px}.prose .lead{font-size:14px;color:#41474c}.side-card{padding:17px;position:sticky;top:12px;background:#fafafa}.side-card h2{margin:-17px -17px 12px;padding:10px 12px;background:#eff0f1;border-bottom:1px solid var(--line);font:650 15px "Segoe UI",Arial,sans-serif;color:#303438;border-radius:var(--radius) var(--radius) 0 0}.side-card p{font-size:12px;color:#6d7378;margin:0 0 12px}.side-card .btn{width:100%;margin-bottom:7px}.kv{display:grid;grid-template-columns:1fr auto;gap:6px 10px;padding:11px 0 0;border-top:1px dotted #b8bdc1;font-size:10px}.kv span:nth-child(odd){color:#777e84}.kv span:nth-child(even){font-weight:700;text-align:right;color:#444a4f}

.calculator-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:18px;align-items:start}.calc-card{padding:22px 22px 24px}.calc-card h2{font:650 19px "Segoe UI",Arial,sans-serif;color:#303438;margin:0 0 6px;padding-bottom:7px;border-bottom:1px solid var(--line)}.calc-card>p{margin:0 0 16px;color:#666d73;font-size:12px}.calc-section{border:0;padding:0;margin:0 0 16px}.calc-section legend{font-size:10px;text-transform:uppercase;font-weight:700;letter-spacing:.06em;color:#756941;margin-bottom:8px}.calc-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.calc-fields.two{grid-template-columns:repeat(2,1fr)}.field label{display:block;font-size:10px;font-weight:700;margin-bottom:4px;color:#555c62}.field input{width:100%;border:1px solid #aeb3b7;border-radius:3px;padding:7px 8px;font:12px "Segoe UI",Arial,sans-serif;background:#fff;color:#333;box-shadow:inset 0 1px 2px rgba(0,0,0,.05)}.field input:focus{outline:2px solid #e3d7ad;border-color:#947d3f}.calc-actions{display:flex;gap:7px;flex-wrap:wrap}.calc-actions button{cursor:pointer}.results{display:grid;gap:6px;margin-top:14px}.result{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#f5f6f7;border:1px solid #d5d8da;border-radius:4px;padding:8px 9px}.result span{color:#6d747a;font-size:10px}.result output{font:700 15px "Segoe UI",Arial,sans-serif;color:#303438}.result output:after{content:" kbps";font:400 10px "Segoe UI",Arial,sans-serif;color:#777e83}.result output[data-text="true"]:after{content:""}.calc-note{font-size:10px;color:#777e83;margin-top:11px}.utility-intro{margin-bottom:0}.formula{font:11px Consolas,"Courier New",monospace;background:#f5f6f7;border:1px solid #d2d5d7;border-radius:3px;padding:9px 10px;overflow:auto}

.footer{max-width:var(--max);margin:0 auto 28px;background:#e9ebed;color:#666c71;border:1px solid var(--line-dark);border-top:0;box-shadow:0 8px 22px rgba(28,32,35,.05)}.footer-inner{padding:15px 20px;display:flex;justify-content:space-between;gap:20px;align-items:center;border-top:1px solid #c4c8cb}.footer strong{font:650 12px "Segoe UI",Arial,sans-serif;color:#444a4f}.footer small{font-size:10px;color:#7c8287}.footer-links{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-end}.footer a{font-size:10px;color:#555d63}.footer a:hover{color:#1c303f}

@media(max-width:820px){
 body{background:#e8eaec}.site-header{margin-top:0}.site-header,.hero,.page-hero,main,.footer{max-width:100%;border-left:0;border-right:0}.nav-wrap{min-height:auto;padding:10px 16px;gap:16px}.brand{flex-basis:185px}.brand-logo{width:180px}.header-copy{padding-left:16px}.codec-badges{gap:9px}.nav{overflow-x:auto;padding:0 7px}.nav a{flex:0 0 auto}.hero-inner{grid-template-columns:1fr;padding:28px 22px}.grid,.content-grid,.calculator-layout,.related-sites{grid-template-columns:1fr}.side-card{position:static}.section-head{display:block}.section-head p{margin-top:4px}main,.page-hero-inner{padding-left:20px;padding-right:20px}.card,.prose,.calc-card{padding-left:18px;padding-right:18px}.footer-inner{align-items:flex-start;flex-direction:column}.footer-links{justify-content:flex-start}
}
@media(max-width:540px){
 .nav-wrap{display:block;text-align:center}.brand{margin:auto}.header-copy{border-left:0;border-top:1px solid #e0e2e4;padding:10px 0 0;margin-top:7px}.header-copy p{display:none}.codec-badges{justify-content:center}.nav{justify-content:flex-start}.nav a{font-size:11px;padding:11px 10px}.hero h1{font-size:31px}.calc-fields,.calc-fields.two{grid-template-columns:1fr}.hero-actions{display:block}.hero-actions .btn{margin:0 0 7px;width:100%}
}