/* Movie.Guru — "a place for film friends"
   Classic 2006 MySpace look: Verdana 11px, #003399 links, #ff6600 headers,
   #b1d0f0 / #d5e8fb table cells, #6699cc right-column bars. */

body{margin:0;background:#fff;color:#000;font:11px Verdana,Arial,Helvetica,sans-serif}
a{color:#003399;text-decoration:none}
a:hover{text-decoration:underline}
img{border:0}
#wrap{width:100%;max-width:800px;margin:0 auto;background:#fff;box-sizing:border-box}

/* header */
#header{min-height:58px;flex-wrap:wrap;gap:6px;padding:6px 12px;box-sizing:border-box;background:#0b2a7c;background:linear-gradient(#3163c4,#0b2a7c);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 12px}
#header .logo{white-space:nowrap;font:bold 27px Arial,Helvetica,sans-serif;letter-spacing:-1px;color:#fff}
#header .logo small{font:12px Arial;color:#cfdcff;margin-left:8px;letter-spacing:0}
#header .logo a{color:#fff}
#header .search{display:flex;align-items:center;gap:4px;font-size:10px}
#header .search input[type=text]{width:140px;font:11px Verdana;padding:1px 2px}
#header .search select,#header .search button{font:10px Verdana}
#header .helplinks{font-size:10px}
#header .helplinks a{color:#fff}

/* nav */
#nav{background:#e7eefb;border-top:1px solid #6b8ed6;border-bottom:1px solid #6b8ed6;padding:5px 8px;text-align:center;font-size:10px;font-weight:bold;line-height:1.7}
#nav a{padding:0 3px;white-space:nowrap}
#nav span{color:#7f9ad6;font-weight:normal}

/* layout */
#page{display:flex;gap:12px;padding:12px 10px}
.leftcol{width:300px;flex:none}
.rightcol{flex:1;min-width:0}

/* text styles (real MySpace class names, kept for nostalgia) */
.nametext{font:bold 15px Arial,Helvetica,sans-serif;color:#000;margin:0 0 4px}
.orangetext15{color:#ff6600;font:bold 15px Arial,Helvetica,sans-serif}
.lightbluetext8{color:#ff6600;font:bold 10px Verdana,Arial,sans-serif}
.whitetext12{color:#fff;font:bold 12px Arial,Helvetica,sans-serif}
.blacktext10{color:#000;font-size:10px}
.blacktext12{color:#000;font:bold 12px Arial}
.btext{font-weight:bold}
.redbtext{color:#f00;font-weight:bold}
.text{font-size:11px}
.small{font-size:9px;color:#333}

/* left column tables */
table.box{width:100%;border-collapse:separate;border-spacing:0;margin:0 0 10px}
table.box td{padding:3px 4px;vertical-align:top;font-size:11px}
table.box td.hdr{background:#b1d0f0;padding:4px}
table.box td.lbl{background:#b1d0f0;width:85px;color:#ff6600;font-weight:bold;font-size:10px}
table.box td.val{background:#d5e8fb}
table.box td.val a{color:#003399}

/* right column bars */
.bluehdr{background:#6699cc;padding:4px 6px;margin:0}
.bluehdr .orangetext15{color:#ff6600}
.section{margin:0 0 12px}
.section .body{padding:6px 4px}
.extnet{border:2px solid #6699cc;padding:11px;text-align:center;font:bold 13px Arial,Helvetica,sans-serif;margin:0 0 12px}

/* profile pic + placeholders */
.profpic{width:180px}
.ph{background:#e3eaf5;border:1px solid #9db3d6;color:#4d5f80;display:flex;align-items:center;justify-content:center;text-align:center;font-size:10px;line-height:1.3;padding:4px;box-sizing:border-box}
.ph.poster{width:180px;height:267px;font:bold 13px Arial;color:#2c3e66}
.ph.thumb{width:90px;height:90px;margin:0 auto}
.ph.wide{width:100%;height:220px;font:bold 12px Arial;flex-direction:column;gap:6px}
.ph.tile{width:80px;height:110px;margin:0 auto;font-size:9px}

/* contacting box */
.contact{border:2px solid #6699cc;margin:10px 0}
.contact .chdr{background:#6699cc;color:#fff;font:bold 12px Arial;padding:3px 6px}
.contact table{width:100%;border-collapse:collapse}
.contact td{width:50%;padding:3px 6px;font-size:10px}
.contact .ico{display:inline-block;width:14px;height:14px;background:#6699cc;color:#fff;font-size:9px;line-height:14px;text-align:center;margin-right:4px;border-radius:2px;vertical-align:middle}

/* url box */
.urlbox{border:2px solid #6699cc;padding:4px 6px;margin:0 0 10px;font-size:10px}
.urlbox .t{font-weight:bold;color:#ff6600;display:block;font-size:11px}

/* friend space */
.friends{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px 6px;text-align:center;padding:6px 0}
.friends .f a{font-weight:bold;display:block;margin-bottom:3px}
.friends .f .role{color:#555;font-size:9px;display:block;margin-top:2px}

/* comments */
table.comments{width:100%;border-collapse:separate;border-spacing:0 6px}
table.comments td{vertical-align:top;padding:6px;font-size:11px}
table.comments td.who{background:#d5e8fb;width:110px;text-align:center}
table.comments td.who a{font-weight:bold;display:block;margin-bottom:4px}
table.comments td.who .ph{width:60px;height:60px;margin:0 auto}
table.comments td.what{background:#f3f7fc}
table.comments .date{color:#555;font-size:9px;display:block;margin-bottom:4px}

/* rating widgets */
.scale{width:100%;border-collapse:collapse;margin:4px 0 8px}
.scale td{padding:2px 4px;font-size:10px;vertical-align:middle}
.scale td.k{width:120px;font-weight:bold}
.scale .bar{height:10px;background:#ff6600;display:inline-block;vertical-align:middle}
.scale .bar.blue{background:#6699cc}
.scale .n{color:#555;font-size:9px;margin-left:4px}
.pick{background:#fff3e0;border:1px solid #ff6600;padding:4px 6px;font-weight:bold;color:#ff6600;display:inline-block}
.critics{display:flex;gap:8px;margin:6px 0}
.critics .c{flex:1;border:1px solid #9db3d6;background:#f3f7fc;padding:6px;text-align:center}
.critics .c b{display:block;font:bold 18px Arial;color:#003399}
.critics .c small{display:block;color:#555;font-size:9px}

/* cast table */
table.cast{width:100%;border-collapse:collapse}
table.cast td{padding:2px 4px;border-bottom:1px solid #e1e8f2;font-size:10px}
table.cast td.a{width:45%;font-weight:bold}
table.cast td.r{color:#333}

/* home page bits */
.login{border:1px solid #6699cc;margin:0 0 10px}
.login .chdr{background:#6699cc;color:#fff;font:bold 12px Arial;padding:3px 6px}
.login .body{padding:6px}
.login label{display:block;font-size:10px;margin:4px 0 2px}
.login input[type=text],.login input[type=password]{width:95%;font:11px Verdana;padding:1px 2px}
.btn{font:bold 10px Verdana;padding:2px 8px;background:#efefef;border:1px solid #888;border-top-color:#fff;border-left-color:#fff;cursor:pointer}
.btn.orange{background:#ff6600;color:#fff;border-color:#c24e00}
.banner{border:1px solid #9db3d6;background:#fff;padding:12px;text-align:center;margin:0 0 12px;background:linear-gradient(#fff,#eef3fb)}
.banner .big{font:bold 22px Arial;color:#003399;letter-spacing:-1px}
.banner .big em{color:#ff6600;font-style:normal}
.banner p{margin:6px 0 8px;font-size:11px}
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(90px,1fr));gap:8px;text-align:center}
.tiles .t a{font-weight:bold;display:block;margin-top:4px}
.tiles .t small{display:block;color:#555;font-size:9px}
.feature{display:flex;gap:10px;padding:6px 2px}
.feature .meta{flex:1}
.feature .meta p{margin:4px 0}
.chart{width:100%;border-collapse:collapse}
.chart td{padding:3px 4px;border-bottom:1px solid #e1e8f2;font-size:10px;vertical-align:top}
.chart td.rank{width:18px;font:bold 12px Arial;color:#ff6600}
.chart td.mv{color:#555;font-size:9px;width:40px;text-align:right}
ul.plain{list-style:none;margin:0;padding:0}
ul.plain li{padding:3px 0;border-bottom:1px solid #e1e8f2;font-size:10px}
ul.plain li b{display:block;font-size:11px}
ul.plain li .date{color:#555;font-size:9px}
.legend td{padding:2px 4px;font-size:10px}
.legend td.k{font-weight:bold;color:#ff6600;width:110px}

/* footer */
#footer{border-top:1px solid #6b8ed6;margin-top:10px;padding:8px 10px 20px;text-align:center;font-size:9px;color:#333}
#footer a{padding:0 4px}
#footer p{margin:4px 0}

/* small poster placeholder (featured card) */
.ph.poster.sm{width:120px;height:178px;font-size:11px}
/* profile pic sizing when the real poster is present */
.profpic{width:180px;height:auto;border:1px solid #9db3d6}
.feature > a > img{width:120px;border:1px solid #9db3d6}
/* narrow screens: stack columns like a 2006 phone would never have */
@media (max-width:640px){#page{flex-direction:column}.leftcol{width:auto}}

/* ===== legibility pass: no orange text on blue ===== */
:root{--navy:#0b2a7c;--bar:#4a78b5;--orange-dk:#b84a00}
.orangetext15{color:var(--navy)}
.lightbluetext8{color:var(--navy)}
table.box td.lbl{color:var(--navy)}
table.box td.hdr .orangetext15{color:var(--navy)}
.bluehdr{background:var(--bar)}
.bluehdr .orangetext15{color:#fff}
.contact .chdr,.login .chdr{background:var(--bar);color:#fff}
.contact,.login,.urlbox,.extnet{border-color:var(--bar)}
.contact .ico{background:var(--bar)}
.urlbox .t{color:var(--navy)}
.legend td.k{color:var(--navy)}
.pick{color:var(--orange-dk);border-color:var(--orange-dk);background:#fff7ee}
.chart td.rank{color:var(--orange-dk)}
.redbtext{color:#c00}
.banner .big em{color:#ff6600}

/* ===== TLDR headline: the personality slot, first and biggest ===== */
.tldr{margin:12px 10px 0;border:1px solid #9db3d6;border-left:6px solid #ff6600;background:#fff;padding:12px 14px}
.tldr h1{font:bold 22px Arial,Helvetica,sans-serif;margin:0 0 2px;letter-spacing:-.5px}
.tldr h1 small{font:11px Verdana;color:#555;letter-spacing:0;margin-left:6px}
.tldr .by{font:bold 10px Verdana;color:var(--orange-dk);text-transform:uppercase;letter-spacing:.5px;margin:0 0 6px}
.tldr .by span{color:#555;font-weight:normal;text-transform:none;letter-spacing:0;margin-left:6px}
.tldr p{font:16px/1.55 Verdana,Arial,sans-serif;margin:0 0 10px;color:#000}
.tldr .verdict{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.tldr .verdict .k{font:bold 10px Verdana;color:#555;margin-right:2px}
.tldr .pick{font-size:12px;padding:5px 8px}
.rightcol .section .body .blacktext12 a{color:var(--navy)}
.feature .meta .tldr-text{font:13px/1.5 Verdana,Arial,sans-serif}

/* ===== Guru Score (1-10, 5 is average) ===== */
.tldr .row{display:flex;gap:16px;align-items:flex-start}
.tldr .row .txt{flex:1;min-width:0}
.score{flex:none;width:170px;border:2px solid var(--navy);background:#f3f7fc;text-align:center;padding:8px 8px 10px;box-sizing:border-box}
.score .n{font:bold 44px/1 Arial,Helvetica,sans-serif;color:var(--navy);letter-spacing:-2px}
.score .n small{font:bold 14px Arial;color:#555;letter-spacing:0}
.score .band{display:inline-block;margin:6px 0 4px;font:bold 11px Verdana;color:#fff;background:var(--navy);padding:3px 8px;text-transform:uppercase;letter-spacing:.5px}
.score .band.hi{background:#b84a00}
.score .band.lo{background:#7a1f1f}
.score .why{font-size:9px;color:#555;margin:2px 0 6px}
.ruler{display:flex;gap:1px;margin:4px 0 2px}
.ruler span{flex:1;height:10px;background:#d5e8fb;border:1px solid #9db3d6}
.ruler span.on{background:var(--navy);border-color:var(--navy)}
.ruler span.avg{box-shadow:inset 0 0 0 2px #ff6600}
.ruler-k{display:flex;justify-content:space-between;font-size:8px;color:#555}
.score a{font-size:9px}
@media (max-width:560px){.tldr .row{flex-direction:column}.score{width:100%}}

/* ===== scale page ===== */
.psa{margin:12px 10px 0;border:1px solid #9db3d6;border-left:6px solid var(--navy);background:#fff;padding:14px 16px}
.psa .kicker{font:bold 10px Verdana;color:var(--orange-dk);text-transform:uppercase;letter-spacing:.5px;margin:0 0 6px}
.psa h1{font:bold 26px/1.15 Arial,Helvetica,sans-serif;margin:0 0 8px;letter-spacing:-.5px}
.psa h1 em{color:#ff6600;font-style:normal}
.psa p{font:13px/1.55 Verdana,Arial,sans-serif;margin:0 0 8px}
.three{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:0 10px}
.three .c{border:1px solid #9db3d6;background:#f3f7fc;padding:10px}
.three .c .num{font:bold 10px Verdana;color:var(--orange-dk);margin:0 0 2px}
.three .c b{display:block;font:bold 14px Arial;margin:0 0 4px}
.three .c p{margin:0;font-size:11px;line-height:1.5}
table.bands{width:100%;border-collapse:collapse}
table.bands td{padding:6px 8px;border-bottom:1px solid #e1e8f2;vertical-align:top;font-size:11px}
table.bands td.s{width:60px;font:bold 16px Arial;color:var(--navy);white-space:nowrap}
table.bands td.b{width:120px;font-weight:bold;text-transform:uppercase;font-size:10px;letter-spacing:.4px}
table.bands tr.mid td{background:#fff7ee}
table.bands tr.mid td.b{color:var(--orange-dk)}
table.bands td.t{font-size:9px;color:#555;width:130px}

/* ===== leaderboards ===== */
table.lb{width:100%;border-collapse:collapse}
table.lb td,table.lb th{padding:5px 6px;border-bottom:1px solid #e1e8f2;font-size:11px;vertical-align:top;text-align:left}
table.lb th{background:#d5e8fb;color:var(--navy);font-size:10px;text-transform:uppercase;letter-spacing:.4px}
table.lb td.rank{width:22px;font:bold 14px Arial;color:var(--orange-dk)}
table.lb td.sc{width:44px;font:bold 16px Arial;color:var(--navy);text-align:center}
table.lb td.sc small{display:block;font:9px Verdana;color:#555;text-transform:uppercase}
table.lb td .hook{display:block;color:#333;font-size:10px;font-style:italic}
table.lb tr.empty td{color:#888;font-style:italic}
.twocol{display:flex;gap:12px;flex-wrap:wrap}
.twocol > .section{flex:1 1 320px;min-width:0}

/* ===== profile page grid: TLDR first on desktop, poster first on mobile ===== */
#wrap.profile{display:grid;grid-template-columns:300px minmax(0,1fr);column-gap:12px;align-items:start}
#wrap.profile > #header,#wrap.profile > #nav,#wrap.profile > .tldr,#wrap.profile > #footer{grid-column:1/-1}
#wrap.profile > .tldr{order:1}
#wrap.profile > .profcard{order:2;grid-column:1;margin:12px 0 0 10px}
#wrap.profile > .rightcol{order:3;grid-column:2;grid-row:span 2;margin:12px 10px 0 0}
#wrap.profile > .leftcol{order:4;grid-column:1;margin:8px 0 0 10px}
#wrap.profile > #footer{order:9}
#wrap.profile > .profcard table{margin-bottom:6px}
@media (max-width:640px){
  #wrap.profile{grid-template-columns:minmax(0,1fr)}
  #wrap.profile > .profcard,#wrap.profile > .rightcol,#wrap.profile > .leftcol{grid-column:1;grid-row:auto;margin:12px 10px 0}
  #wrap.profile > .profcard{order:1}
  #wrap.profile > .tldr{order:2}
  #wrap.profile > .leftcol{order:3}
  #wrap.profile > .rightcol{order:4}
  #wrap.profile > .profcard table{width:100%}
  #wrap.profile > .leftcol{width:auto}
}

/* ===== TLDR spacing polish: tighter, proportional to the rest of the page ===== */
.tldr{padding:10px 12px 10px 14px;margin-top:10px}
.tldr h1{font-size:20px;margin:0 0 1px}
.tldr h1 small{font-size:10px;margin-left:5px}
.tldr .by{margin:0 0 5px;font-size:9px}
.tldr .by span{margin-left:5px}
.tldr .row{gap:14px;align-items:flex-start}
.tldr p{font-size:14px;line-height:1.4;margin:0 0 7px}
.tldr .verdict{gap:5px}
.tldr .verdict .k{font-size:9px;margin-right:1px}
.tldr .pick{font-size:11px;padding:3px 7px}
.tldr .verdict a{font-size:9px}
.score{width:150px;padding:6px 8px 7px}
.score .n{font-size:36px}
.score .n small{font-size:12px}
.score .band{margin:4px 0 3px;font-size:10px;padding:2px 7px}
.score .why{margin:0 0 4px;line-height:1.3}
.ruler{margin:2px 0 1px}
.ruler span{height:8px}
.score a{font-size:9px}
@media (max-width:560px){.score{width:100%}}

/* ===== performance charts ===== */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:8px;margin:0 0 10px}
.tile{border:1px solid #9db3d6;background:#f3f7fc;padding:8px 10px}
.tile .tl{font-size:9px;color:#52514e;text-transform:uppercase;letter-spacing:.4px}
.tile .tvl{font:600 22px/1.15 system-ui,-apple-system,"Segoe UI",Arial,sans-serif;color:#0b2a7c;margin:2px 0}
.tile .tn{font-size:9px;color:#52514e;line-height:1.3}
.chart{border:1px solid #e1e0d9;background:#fff;padding:10px 12px;margin:0 0 10px}
.chart .ct{font:bold 12px Arial,Helvetica,sans-serif;color:#0b0b0b}
.chart .cs{font-size:10px;color:#52514e;margin:2px 0 8px;line-height:1.4}
.chart .cb svg{display:block;font-family:Verdana,Arial,sans-serif}
.chart .src{font-size:9px;color:#898781;margin-top:6px}
.legend{display:flex;gap:14px;font-size:10px;color:#52514e;margin:4px 0 0}
.legend i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.tv{margin-top:6px;font-size:10px}
.tv summary{cursor:pointer;color:#003399}
.tvt{border-collapse:collapse;margin-top:4px;width:100%}
.tvt th,.tvt td{border-bottom:1px solid #e1e0d9;padding:2px 6px;text-align:left;font-size:10px;font-variant-numeric:tabular-nums}
.tvt th{color:#52514e;font-weight:bold}

/* ===== wikipedia-style edit history ===== */
ul.hist{list-style:none;margin:0;padding:0}
ul.hist li{padding:4px 0;border-bottom:1px solid #e1e8f2;font-size:10px;line-height:1.5}
ul.hist .hl{color:#555}
ul.hist .hd{color:#000}
ul.hist .hu{font-weight:bold}
ul.hist .hb{font-family:Menlo,Consolas,monospace;font-size:9px;padding:0 3px;border-radius:2px}
ul.hist .hb.pos{color:#006300;background:#eaf6ea}
ul.hist .hb.neg{color:#8b0000;background:#f9e8e8}
ul.hist .hs{color:#333;font-style:italic}

/* ===== trailer embeds ===== */
.vid{position:relative;width:100%;aspect-ratio:16/9;background:#000;border:1px solid #9db3d6;margin:0 0 4px}
.vid iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.vcap{font-size:10px;color:#52514e;margin:0 0 10px}

/* ===== TLDR hero, polished 2006 edition ===== */
.tldr{padding:0;margin:12px 10px 0;border:1px solid #8fa9d3;border-left:1px solid #8fa9d3;border-radius:6px;overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(11,42,124,.14)}
.tldr .thead{display:flex;align-items:baseline;justify-content:space-between;gap:8px 14px;flex-wrap:wrap;padding:9px 14px 8px;background:linear-gradient(#f6f9fe,#dbe8fa);border-bottom:1px solid #b1d0f0;box-shadow:inset 0 1px 0 #fff}
.tldr h1{margin:0;font:bold 21px/1.2 Arial,Helvetica,sans-serif;color:#0b2a7c;letter-spacing:-.4px}
.tldr h1 .yr{font:11px Verdana,Arial,sans-serif;color:#52514e;margin-left:4px;letter-spacing:0}
.tldr .meta{display:flex;flex-wrap:wrap;font-size:10px;color:#52514e;line-height:1.4}
.tldr .meta span{padding:0 8px;border-left:1px solid #b1d0f0}
.tldr .meta span:first-child{border-left:0;padding-left:0}
.tldr .row{padding:12px 14px 11px;gap:16px;align-items:stretch}
.tldr .txt{display:flex;flex-direction:column}
.tldr .tag{display:inline-flex;align-items:center;gap:6px;font:bold 9px Verdana,Arial,sans-serif;letter-spacing:.7px;text-transform:uppercase;color:#b84a00;margin:0 0 7px}
.tldr .tag .av{width:18px;height:18px;border-radius:3px;background:linear-gradient(#ff8a3d,#e05a00);color:#fff;font:bold 11px/18px Arial;text-align:center;box-shadow:inset 0 1px 0 rgba(255,255,255,.45),0 1px 1px rgba(0,0,0,.15)}
.tldr p{font:14px/1.45 Verdana,Arial,sans-serif;margin:0 0 10px;color:#111;flex:1}
.tldr .byline{font-size:9px;color:#52514e;border-top:1px solid #e6edf7;padding-top:7px;margin-top:auto}
.tldr .byline a{font-weight:bold}
.score{width:164px;padding:9px 10px 8px;border:1px solid #6b8ed6;border-radius:6px;background:linear-gradient(#ffffff 0%,#eaf2fc 100%);box-shadow:inset 0 1px 0 #fff,0 1px 2px rgba(11,42,124,.10);text-align:center}
.score .lbl{font:bold 8px Verdana,Arial,sans-serif;letter-spacing:.8px;text-transform:uppercase;color:#52514e}
.score .n{font:bold 40px/1 Arial,Helvetica,sans-serif;color:#0b2a7c;letter-spacing:-2px;margin:3px 0 5px}
.score .n small{font:bold 12px Arial;color:#52514e;letter-spacing:0;margin-left:1px}
.score .band{display:inline-block;margin:0;padding:3px 9px;border-radius:3px;background:linear-gradient(#2f57aa,#0b2a7c);color:#fff;font:bold 9px Verdana,Arial,sans-serif;letter-spacing:.6px;text-transform:uppercase;box-shadow:inset 0 1px 0 rgba(255,255,255,.28)}
.score .ruler{margin:9px 0 2px;gap:2px}
.score .ruler span{height:9px;border-radius:2px;border-color:#b1d0f0;background:#e6eef9}
.score .ruler span.on{background:linear-gradient(#3b63b5,#0b2a7c);border-color:#0b2a7c}
.score .ruler span.avg{box-shadow:inset 0 0 0 2px #ff6600;background:#fff3e8}
.score .ruler-k{font-size:8px;color:#52514e}
.score .links{margin-top:7px;padding-top:6px;border-top:1px solid #d5e2f3;font-size:9px}
@media (max-width:560px){.tldr .row{flex-direction:column}.score{width:100%}}
.section > .chart{border-top:0;margin:0}
.chart .cs{margin-top:0}
.chart{width:auto;box-sizing:border-box;min-width:0}
.chart .cb{min-width:0}
table.chart{width:100%}

/* ===== TLDR box: back to the square, orange-rule style (score card keeps the new look) ===== */
.tldr{border:1px solid #9db3d6;border-left:6px solid #ff6600;border-radius:0;box-shadow:none;background:#fff;padding:10px 12px 10px 14px;overflow:visible}
.tldr .thead{padding:0 0 6px;background:none;border-bottom:1px solid #e6edf7;box-shadow:none;margin:0 0 8px}
.tldr h1{font:bold 21px/1.2 Arial,Helvetica,sans-serif;color:#000;letter-spacing:-.4px}
.tldr h1 .yr{color:#555}
.tldr .meta{color:#555}
.tldr .meta span{border-left-color:#c9d6ea}
.tldr .row{padding:0;gap:16px}
.tldr .txt{padding-top:2px}
.tldr p{margin:0 0 10px}
.tldr .sig{margin-top:auto;font:italic 12px Georgia,"Times New Roman",serif;color:#333;text-align:right;padding-top:4px}
.tldr .sig span{color:#666;font-size:11px}
.score{border-radius:5px}
.tldr .sig{font:11px Verdana,Arial,sans-serif;font-style:normal;text-align:left;color:#333}
.tldr .sig span{font-size:11px;color:#666}
/* brand is always lowercase: no CSS uppercasing where the name appears */
.tldr .tag{text-transform:none;letter-spacing:.3px;font-size:10px}
.score .lbl{text-transform:none;letter-spacing:.3px;font-size:9px}
.tldr .sig b{color:#0b2a7c}
.tldr .sig span{color:#333}

/* profile grid: keep the poster row tight; the tall right column's extra height goes to the flexible row below */
#wrap.profile{grid-template-rows:auto auto auto auto minmax(0,1fr) auto}
@media (max-width:640px){#wrap.profile{grid-template-rows:none}}
/* a little more air between the profile column and the main column */
#wrap.profile{column-gap:22px}
#page{gap:22px}
#wrap.profile > .leftcol{width:auto}

/* ===== sticky left column (profile pages) ===== */
#wrap.profile{grid-template-rows:none}
#wrap.profile > .rightcol{grid-row:auto}
#wrap.profile > .leftcol{position:sticky;align-self:start;margin-top:12px}
#wrap.profile > .leftcol > .profcard{margin:0 0 8px}
@media (max-width:640px){
  #wrap.profile > .leftcol{position:static;align-self:auto;margin-top:12px}
}
/* place the left column before the right one so both land in the same grid row (sticky needs that) */
#wrap.profile > .leftcol{order:3}
#wrap.profile > .rightcol{order:4}

/* facts beside the poster */
.facts div{margin:0 0 6px;font-size:10px;line-height:1.35;color:#000}
.facts b{display:block;font-size:9px;color:#0b2a7c;text-transform:uppercase;letter-spacing:.4px}
.tldr .thead{justify-content:flex-start}

/* footer outside the profile grid so the sticky column can never travel over it */
#wrap-foot{width:100%;max-width:800px;margin:0 auto;background:#fff;box-sizing:border-box}
#wrap.profile{padding-bottom:12px}

/* ===== de-polish: flat 2006 treatment for the TLDR block and score box ===== */
.tldr .thead{border-bottom:0;padding:0;margin:0 0 6px}
.tldr h1{font-size:20px}
.tldr .tag{font:bold 10px Verdana,Arial,sans-serif;letter-spacing:0;text-transform:none;color:#b84a00;margin:0 0 4px}
.tldr .sig{padding-top:2px}
.score{width:160px;padding:8px;border:1px solid #6b8ed6;border-radius:0;background:#d5e8fb;box-shadow:none}
.score .lbl{font:bold 9px Verdana,Arial,sans-serif;letter-spacing:0;text-transform:none;color:#0b2a7c}
.score .n{font:bold 34px/1 Arial,Helvetica,sans-serif;letter-spacing:-1px;margin:3px 0 4px;color:#0b2a7c}
.score .n small{font:bold 11px Arial;color:#333}
.score .band{border-radius:0;background:#0b2a7c;box-shadow:none;letter-spacing:0;font:bold 9px Verdana,Arial,sans-serif;text-transform:uppercase;padding:2px 7px}
.score .ruler{margin:8px 0 2px;gap:1px}
.score .ruler span{height:8px;border-radius:0;background:#fff;border:1px solid #9db3d6}
.score .ruler span.on{background:#0b2a7c;border-color:#0b2a7c}
.score .ruler span.avg{background:#fff;box-shadow:inset 0 0 0 2px #ff6600;border-color:#ff6600}
.score .ruler-k{font-size:8px;color:#333}
.score .links{margin-top:6px;padding-top:5px;border-top:1px solid #b1d0f0;font-size:9px}

/* tighter vertical rhythm in the TLDR block */
.tldr{padding:8px 12px 8px 14px}
.tldr .thead{margin:0 0 4px}
.tldr .row{align-items:flex-start;gap:14px}
.tldr .txt{display:block;padding-top:0}
.tldr .tag{margin:0 0 3px}
.tldr p{margin:0 0 6px;line-height:1.4}
.tldr .sig{margin-top:0;padding-top:0}
.score{padding:6px 8px 7px}
.score .n{margin:2px 0 3px}
.score .ruler{margin:6px 0 1px}
.score .links{margin-top:5px;padding-top:4px}

/* TLDR block: score box top-aligned with the title, byline anchored to the bottom */
.tldr{display:flex;gap:14px;align-items:stretch}
.tldr .tmain{flex:1;min-width:0;display:flex;flex-direction:column}
.tldr .txt{flex:1;display:flex;flex-direction:column}
.tldr .sig{margin-top:auto;padding-top:6px}
.tldr > .score{flex:none;align-self:flex-start}
@media (max-width:560px){.tldr{flex-direction:column}.tldr > .score{width:100%}}

/* image credits */
.credit{display:block;font-size:8px;line-height:1.3;color:#666;margin-top:3px;text-align:left}
.friends .f a.credit{font-weight:normal;color:#666;margin:2px 0 0;font-size:8px}
.profcard .credit{max-width:180px}
/* cast thumbnails: crop to square instead of stretching */
.friends .f img{width:90px;height:90px;object-fit:cover;object-position:50% 20%;border:1px solid #9db3d6;display:block;margin:0 auto}
.profpic{display:block}

/* ===== score strip: full width under the TLDR, one slim row ===== */
.tldr{flex-direction:column;gap:8px}
.tldr .txt{display:block}
.tldr .sig{margin-top:0;padding-top:6px}
.tldr > .score{align-self:stretch;width:auto;display:grid;grid-template-columns:auto auto auto minmax(140px,1fr) auto;grid-template-areas:"lbl n band ruler links" "lbl n band rk links";align-items:center;column-gap:14px;row-gap:2px;padding:6px 10px;text-align:left}
.score .lbl{grid-area:lbl;font:bold 9px/1.25 Verdana,Arial,sans-serif;color:#0b2a7c;width:52px;text-transform:none}
.score .n{grid-area:n;font:bold 26px/1 Arial,Helvetica,sans-serif;margin:0;letter-spacing:-1px}
.score .n small{font-size:10px}
.score .band{grid-area:band;margin:0;white-space:nowrap}
.score .ruler{grid-area:ruler;margin:0;align-self:end}
.score .ruler-k{grid-area:rk;align-self:start}
.score .links{grid-area:links;margin:0;padding:0 0 0 14px;border-top:0;border-left:1px solid #9db3d6;white-space:nowrap;line-height:1.6}
@media (max-width:560px){
  .tldr > .score{grid-template-columns:auto auto 1fr;grid-template-areas:"lbl n band" "ruler ruler ruler" "rk rk rk" "links links links";row-gap:4px}
  .score .links{border-left:0;padding:4px 0 0;border-top:1px solid #b1d0f0;white-space:normal}
}
.score .lbl{width:64px}
.psa .creditline{font-size:10px;color:#52514e;margin:0;padding-top:6px;border-top:1px solid #e1e8f2}

/* main nav: flex row with fixed spacing so markup whitespace never changes it */
#nav{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px 0;padding:5px 8px}
#nav a{padding:0 7px;white-space:nowrap;line-height:1.7}
#nav span{padding:0;color:#7f9ad6;font-weight:normal}