:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;color:#102334;background:#eef5f7}
*{box-sizing:border-box}
body{margin:0}
.shell{max-width:1180px;margin:auto;padding:20px 12px 60px}
header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px;background:#082b32;border-bottom:5px solid #42d6a5;border-radius:7px;color:#fff}
header span{font-size:11px;font-weight:900;color:#66f1bf}
h1{margin:4px 0;font-size:36px}
header p{margin:0}
header a{flex-shrink:0;color:#082b32;background:#cffff0;padding:10px;border-radius:5px;font-weight:800;text-decoration:none}
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin:18px 0 8px}
.toolbar button,.remove{border:1px solid #14846a;background:#fff;color:#075d4b;padding:9px 12px;border-radius:5px;font-weight:800;cursor:pointer}
#status{min-height:22px;color:#526b78}
#items{display:grid;gap:9px}
.row{display:grid;grid-template-columns:40px minmax(145px,1.5fr) repeat(4,minmax(90px,1fr)) 90px;gap:10px;align-items:center;padding:12px;background:#fff;border:1px solid #bdd0d9;border-left:4px solid #14846a;border-radius:6px}
.rank{font-size:20px;font-weight:900;color:#087c60}
.identity,.cell{min-width:0}
.identity strong,.identity small,.cell small,.cell strong{display:block;overflow-wrap:anywhere}
.identity a{color:#075d4b}
.identity a+a{margin-left:12px}
.cell small{font-size:11px;text-transform:uppercase;font-weight:800;color:#607687}
.cell small.gain{color:#08704e}
.cell small.loss{color:#b3233e}
.cell strong{font-size:15px;margin-top:3px}
.gain{color:#08704e}
.loss{color:#b3233e}
.unavailable{color:#607687}
.remove{border-color:#c66070;color:#912638}
.note{font-size:12px;color:#526b78}
.empty{padding:24px;background:#fff;border:1px solid #bdd0d9;border-radius:6px}
@media(max-width:850px){
  .row{position:relative;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-items:stretch}
  .rank{position:absolute;top:12px;right:12px}
  .identity{grid-column:1/-1;padding-right:35px}
  .cell{padding:8px;border:1px solid #d5e0e5;border-radius:5px;background:#f8fbfc}
  .row .remove{grid-column:1/-1;width:100%}
}
@media(max-width:500px){
  header{align-items:stretch;flex-direction:column;padding:18px}
  h1{font-size:30px}
  .cell strong{font-size:14px}
}
