*{box-sizing:border-box}
html{background:#008080}
body{margin:0;padding:18px;background:#008080;color:#000;font:12px "MS Sans Serif",Tahoma,Verdana,Arial,sans-serif;min-height:100vh}
.app{max-width:1050px;margin:auto;background:#c0c0c0;border:2px solid;border-color:#fff #000 #000 #fff;box-shadow:1px 1px 0 #404040}
.space-header{min-height:116px;padding:18px 20px;display:flex;align-items:flex-start;justify-content:space-between;color:#fff;background:radial-gradient(ellipse at 68% 150%,#5b91b7 0 13%,#173d5b 14%,#071a2b 33%,#02070d 62%,#000 100%);border:2px solid;border-color:#808080 #fff #fff #808080}
.logo{font:bold italic 38px Arial,sans-serif;letter-spacing:-2px;text-shadow:2px 2px #000}
.logo span{color:#70aee6}.logo small{font:16px Tahoma,sans-serif;letter-spacing:0}
.tagline{font:10px "Courier New",monospace;color:#b9d9f3;letter-spacing:1px;margin-top:5px}
.slogan{text-align:right;font:bold 11px/1.65 "Courier New",monospace;color:#fff;text-shadow:1px 1px #000}
.toolbar,.searchbar,.lower,footer{background:#c0c0c0}
.toolbar{display:flex;align-items:center;border-top:1px solid #fff;border-bottom:1px solid #808080;min-height:40px;padding:3px}
.toolbar button,.searchbar button,.dialog button,.download-button{font:12px "MS Sans Serif",Tahoma,sans-serif;color:#000;background:#c0c0c0;border:2px solid;border-color:#fff #404040 #404040 #fff;padding:5px 12px;min-height:29px;cursor:pointer;border-radius:0}
.toolbar button:active,.searchbar button:active,.dialog button:active,.download-button:active{border-color:#404040 #fff #fff #404040;padding:6px 11px 4px 13px}
.toolbar .tab{margin-right:2px}.toolbar .active{font-weight:bold;box-shadow:inset 1px 1px #808080}
.toolbar .join{margin-left:auto;font-weight:bold}
.searchbar{padding:8px;display:flex;align-items:center;gap:7px;border-bottom:1px solid #808080}
.searchbar input,.dialog input[type=email]{min-width:0;flex:1;background:#fff;border:2px solid;border-color:#404040 #fff #fff #404040;padding:5px;font:16px Tahoma,sans-serif;border-radius:0}
.content{display:grid;grid-template-columns:minmax(0,1fr) 300px;background:#fff;border:2px solid;border-color:#404040 #fff #fff #404040;margin:4px}
.files-panel{min-width:0;border-right:1px solid #808080}
.table-head,.file-row{display:grid;grid-template-columns:minmax(0,1fr) 65px 75px 116px;align-items:center}
.table-head{background:#c0c0c0;border-bottom:2px solid;border-color:#fff #808080 #808080 #fff;font-weight:bold}
.table-head span{border-right:1px solid #808080}
.table-head span,.file-row>*{padding:7px 7px;min-width:0}
.file-row{border-bottom:1px solid #dfdfdf;background:#fff}
.file-row:hover{background:#e8e8e8}
.file-row.selected{background:#000080;color:#fff}
.file-title{display:flex;align-items:center;gap:8px;border:0;background:transparent;text-align:left;cursor:pointer;font:12px Tahoma,sans-serif;color:inherit;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.file-row .status{font-size:11px}.file-row.corrupted:not(.selected) .status{color:#800000;font-weight:bold}
.rar-icon{position:relative;display:inline-flex;flex-direction:column;justify-content:center;width:20px;height:20px;min-width:20px;filter:drop-shadow(1px 1px 0 #777)}
.rar-icon i{display:block;width:17px;height:5px;border:1px solid #222;border-radius:1px;margin:-1px 0 0 1px}
.rar-icon i:nth-child(1){background:#7d2a83}.rar-icon i:nth-child(2){background:#31559d}.rar-icon i:nth-child(3){background:#438d45}
.rar-icon b{position:absolute;width:4px;height:18px;background:#b7923b;border:1px solid #57430e;left:9px;top:1px}
.details{padding:10px;background:#c0c0c0}
.detail-heading,.section-title{font-weight:bold;margin-bottom:7px}
.cover-wrap{aspect-ratio:1/1;border:2px solid;border-color:#404040 #fff #fff #404040;background:#000;overflow:hidden}
.cover-wrap img{width:100%;height:100%;object-fit:cover}
.cover-placeholder{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 115%,#6399b9 0 12%,#143d59 13%,#07131e 43%,#020509 72%);color:#fff}
.cover-placeholder strong{font:28px Georgia,serif}.cover-placeholder span{margin-top:18px;letter-spacing:5px;font-size:10px}
.details h2{font-size:12px;line-height:1.35;word-break:break-word}.details p{font-size:11px;line-height:1.4}
.details dl{display:grid;grid-template-columns:70px 1fr;gap:4px;margin:11px 0;font:11px "Courier New",monospace}.details dt{font-weight:bold}.details dd{margin:0}
.download-button{width:100%;font-weight:bold}
.download-button:disabled{color:#808080;text-shadow:1px 1px #fff;cursor:not-allowed}
.lower{display:grid;grid-template-columns:minmax(0,1fr) 300px;border-top:1px solid #808080}
.downloads,.users{padding:9px}.users{border-left:1px solid #808080}
.user-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px;font-size:11px}
.progress-shell{height:18px;border:2px solid;border-color:#404040 #fff #fff #404040;background:#fff;margin-top:6px;padding:2px}
.progress-shell div{width:0;height:100%;background:repeating-linear-gradient(90deg,#000080 0 10px,#fff 10px 12px);transition:width .12s linear}
.progress-meta{display:flex;justify-content:space-between;font:10px "Courier New",monospace;margin-top:3px}
footer{padding:6px 8px;border-top:2px solid #808080;display:flex;justify-content:space-between;gap:10px;font-size:10px}
.modal-backdrop{position:fixed;inset:0;background:#0007;z-index:20;display:flex;align-items:center;justify-content:center;padding:18px}
.modal-backdrop[hidden]{display:none}
.dialog{width:min(440px,100%);background:#c0c0c0;border:2px solid;border-color:#fff #000 #000 #fff;box-shadow:2px 2px #000}
.dialog-title{display:flex;justify-content:space-between;align-items:center;background:#000080;color:#fff;font-weight:bold;padding:3px 4px}
.dialog-title .x{min-height:21px;width:23px;padding:0;font-weight:bold}
.dialog-body{padding:14px}.dialog-body form{display:grid;gap:8px}
.check{display:flex;gap:7px;align-items:flex-start;font-size:11px;line-height:1.35}.check input{margin-top:2px}
.dialog-actions{display:flex;justify-content:flex-end;gap:6px;margin-top:10px}
.privacy{display:block;margin-top:13px;color:#444;line-height:1.35}
@media(max-width:700px){body{padding:0}.app{border-width:0}.space-header{min-height:100px;padding:15px}.slogan{display:none}.toolbar{overflow-x:auto}.toolbar .join{white-space:nowrap}.searchbar label{display:none}.content{grid-template-columns:1fr;margin:2px}.files-panel{border-right:0}.details{border-top:1px solid #808080}.lower{grid-template-columns:1fr}.users{border-left:0;border-top:1px solid #808080}.table-head,.file-row{grid-template-columns:minmax(0,1fr) 58px 90px}.table-head span:nth-child(3),.file-row .bitrate{display:none}.user-grid{grid-template-columns:1fr 1fr}footer{flex-direction:column}}

/* --- V3: late-90s Windows / early P2P polish --- */
.menubar{height:25px;display:flex;align-items:center;padding:1px 4px;background:#c0c0c0;border-top:1px solid #fff;border-bottom:1px solid #808080}
.menubar button{border:0;background:transparent;padding:3px 8px;font:12px "MS Sans Serif",Tahoma,sans-serif;color:#000;min-height:21px}
.menubar button:hover{text-decoration:underline}.network-light{margin-left:auto;padding-right:5px;font-size:11px;color:#333}.network-light i,.green-led{display:inline-block;width:8px;height:8px;border-radius:50%;background:#00a000;border:1px solid #004c00;box-shadow:inset 1px 1px #65ff65}
.toolbar{min-height:49px}.toolbar .tab,.toolbar .join{display:flex;align-items:center;gap:5px;min-height:41px}
.tool-icon{position:relative;display:inline-block;width:22px;height:22px;flex:0 0 22px}
.tool-icon.magnify:before{content:"";position:absolute;width:10px;height:10px;border:2px solid #001b78;border-radius:50%;left:2px;top:2px;background:#fff}
.tool-icon.magnify:after{content:"";position:absolute;width:9px;height:3px;background:#001b78;transform:rotate(45deg);left:12px;top:14px}
.tool-icon.arrow:before{content:"";position:absolute;left:8px;top:1px;width:6px;height:12px;background:#005a00;border:1px solid #003800}
.tool-icon.arrow:after{content:"";position:absolute;left:3px;top:11px;border-left:7px solid transparent;border-right:7px solid transparent;border-top:8px solid #008000}
.tool-icon.disc{border-radius:50%;background:radial-gradient(circle,#c0c0c0 0 2px,#fff 3px 6px,#7898b8 7px 10px,#ddd 11px);border:1px solid #555}
.tool-icon.info{border-radius:50%;background:#000080;color:#fff;border:1px solid #fff;box-shadow:1px 1px #555}
.tool-icon.info:after{content:"i";position:absolute;left:8px;top:1px;font:bold 17px Georgia,serif}
.tool-icon.antenna:before{content:"";position:absolute;width:3px;height:15px;background:#333;left:10px;top:5px}
.tool-icon.antenna:after{content:"";position:absolute;width:15px;height:15px;border:2px solid #000080;border-color:#000080 transparent transparent #000080;border-radius:50%;transform:rotate(45deg);left:3px;top:0}
.searchbar select{height:29px;background:#fff;border:2px solid;border-color:#404040 #fff #fff #404040;border-radius:0;font:12px Tahoma,sans-serif;padding:2px 22px 2px 5px}
.file-row{min-height:34px}.file-title{font-size:12px}
.mp3-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;min-width:20px;background:#fff;border:1px solid #555;color:#000080;font:bold 18px Georgia,serif;box-shadow:1px 1px #888}
.rar-icon{transform:scale(.95);transform-origin:center}
.details{border-left:1px solid #fff}.detail-heading{background:#000080;color:#fff;padding:4px 5px;margin:-3px -3px 8px}
.details h2{background:#fff;border:2px solid;border-color:#404040 #fff #fff #404040;padding:6px;margin:8px 0}
.section-title{border-bottom:1px solid #808080;padding-bottom:3px}
.statusbar{display:flex!important;padding:3px!important;gap:3px!important;border-top:1px solid #fff!important}
.status-cell{border:2px solid;border-color:#808080 #fff #fff #808080;padding:3px 7px;white-space:nowrap;min-height:23px}
.status-fill{flex:1}.green-led{margin-right:5px}
.dialog-title{min-height:24px}.dialog-body{font-size:12px}
@media(max-width:700px){.menubar{display:none}.toolbar .tab span:last-child,.toolbar .join span:last-child{display:none}.toolbar .tab,.toolbar .join{justify-content:center;min-width:45px}.searchbar select{display:none}.statusbar{flex-wrap:wrap}.status-fill{display:none}.status-cell{flex:1;text-align:center}.network-light{display:none}}

/* --- V4: restore the graphic identity of the original IJsWire sketch --- */
.space-header{
  position:relative;overflow:hidden;isolation:isolate;min-height:154px;
  background:linear-gradient(#01050a 0%,#041321 52%,#0a2e4a 74%,#2e6f99 100%);
}
.space-header:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:22px;z-index:-1;
  background:linear-gradient(to bottom,rgba(157,214,244,.2),rgba(1,8,14,.8));
  border-top:1px solid rgba(176,225,255,.28)
}
.header-copy,.slogan{position:relative;z-index:6}
.starfield{position:absolute;inset:0;z-index:-4;opacity:.95;
  background-image:
    radial-gradient(circle at 8% 20%,#fff 0 1px,transparent 1.4px),
    radial-gradient(circle at 17% 43%,#cbe7ff 0 1px,transparent 1.4px),
    radial-gradient(circle at 31% 13%,#fff 0 1px,transparent 1.4px),
    radial-gradient(circle at 43% 37%,#fff 0 1px,transparent 1.4px),
    radial-gradient(circle at 56% 17%,#9ecdf1 0 1px,transparent 1.5px),
    radial-gradient(circle at 67% 39%,#fff 0 1px,transparent 1.4px),
    radial-gradient(circle at 78% 14%,#fff 0 1px,transparent 1.4px),
    radial-gradient(circle at 89% 32%,#c9e7ff 0 1px,transparent 1.4px),
    radial-gradient(circle at 95% 9%,#fff 0 1px,transparent 1.4px)
}
.planet-horizon{
  position:absolute;z-index:-2;width:560px;height:210px;right:95px;bottom:-174px;
  border-radius:50% 50% 0 0;background:
    radial-gradient(ellipse at 45% 2%,rgba(177,225,250,.85) 0 1%,rgba(66,136,180,.8) 4%,rgba(21,66,96,.95) 24%,#071726 56%,#02070d 75%);
  border-top:2px solid rgba(202,237,255,.85);
  box-shadow:0 -3px 10px rgba(110,193,240,.55),0 -13px 38px rgba(36,127,185,.26);
}
.planet-glow{position:absolute;left:8%;right:8%;top:-7px;height:7px;border-radius:50%;box-shadow:0 -6px 16px rgba(119,202,247,.7)}
.orbit-line{position:absolute;z-index:-1;border:1px solid rgba(112,178,220,.28);border-radius:50%;transform:rotate(-12deg)}
.orbit-one{width:650px;height:95px;right:5px;bottom:3px}
.orbit-two{width:480px;height:62px;right:115px;bottom:24px;opacity:.45}
.satellite{position:absolute;z-index:1;right:35%;top:42px;width:42px;height:25px;transform:rotate(-12deg);opacity:.85}
.satellite i{position:absolute;left:14px;top:6px;width:14px;height:12px;background:#b9c2c9;border:1px solid #4b5964;box-shadow:inset 1px 1px #fff}
.satellite b,.satellite em{position:absolute;top:7px;width:13px;height:10px;background:repeating-linear-gradient(90deg,#244f7e 0 3px,#4c78a6 3px 5px);border:1px solid #748899}
.satellite b{left:0}.satellite em{right:0}.satellite:after{content:"";position:absolute;width:13px;height:1px;background:#b7c4cc;left:15px;top:2px;transform:rotate(-38deg)}
.logo{font-size:42px}.tagline{background:rgba(0,0,0,.42);display:inline-block;padding:3px 5px;margin-left:-5px}
.slogan{background:rgba(0,0,0,.38);padding:7px 9px;border-left:1px solid rgba(160,210,240,.28)}
.user-grid span{display:flex;align-items:center;gap:6px;white-space:nowrap}
.user-led{display:inline-block;width:9px;height:9px;min-width:9px;border-radius:50%;background:#00b400;border:1px solid #004800;box-shadow:inset 1px 1px #8cff8c,0 0 2px #008000}
@media(max-width:700px){
  .space-header{min-height:126px}
  .planet-horizon{right:-130px;width:500px}
  .satellite{right:22%;top:45px}
  .orbit-line{right:-160px}
}

/* --- V5: literal header from the original concept sketch --- */
.original-header{
  position:relative;
  min-height:0!important;
  padding:0!important;
  overflow:hidden;
  background:#020811!important;
  border:0!important;
  border-bottom:2px solid #808080!important;
  aspect-ratio:1536/176;
}
.original-header:after{display:none!important}
.original-header-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.original-slogan{
  position:absolute;
  z-index:5;
  right:2.25%;
  top:34%;
  width:15.5%;
  color:#82bfe9;
  font:clamp(7px, .82vw, 13px)/1.55 "Courier New",monospace;
  letter-spacing:.08em;
  text-align:left;
  text-shadow:1px 1px #000;
  white-space:nowrap;
}
@media(max-width:700px){
  .original-header{aspect-ratio:1536/210;min-height:88px!important}
  .original-header-art{object-fit:cover;object-position:left center}
  .original-slogan{display:none}
}

.connection-success{border:2px solid;border-color:#404040 #fff #fff #404040;background:#fff;padding:16px;text-align:center;font-family:"Courier New",monospace}
.connection-success strong{display:block;color:#000080;font-size:14px;margin-bottom:8px}
.connection-success span,.connection-success small{display:block;line-height:1.5}
.connection-success small{margin-top:8px;color:#555}

.input--hidden{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important}
.brevo-message{font:bold 12px "Courier New",monospace;padding:8px;margin:0 0 9px;border:2px solid}
.brevo-success{color:#004800;background:#d8ffd8;border-color:#fff #008000 #008000 #fff}
.brevo-error{color:#800000;background:#ffdede;border-color:#fff #800000 #800000 #fff}