@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800&family=Manrope:wght@400;500;600;700;800&display=swap');
#trnovany-web-concept { --tr-photo: url('/banner.jpeg'); width:100%; }
#trnovany-web-concept * { box-sizing:border-box; }
:root { color-scheme:dark; background:#141816; }
html, body { margin:0; min-width:320px; }
body { background:#141816; }
#trnovany-web-concept { max-width:1680px; margin:0 auto; }
#trnovany-web-concept [hidden] { display:none!important; }
#trnovany-web-concept .tr-page { --tr-bg:#141816; --tr-fg:#f2f3eb; --tr-muted:#adb5a8; --tr-line:#343d33; --tr-accent:#ebd955; --tr-cta-ink:#1c241b; color:var(--tr-fg); background:var(--tr-bg); font-family:Manrope,Arial,sans-serif; min-height:100svh; display:flex; flex-direction:column; position:relative; isolation:isolate; }
#trnovany-web-concept button, #trnovany-web-concept input { font:inherit; }
#trnovany-web-concept button { cursor:pointer; color:inherit; }
#trnovany-web-concept :is(button,input,a):focus-visible { outline:2px solid var(--tr-accent); outline-offset:5px; }
#trnovany-web-concept .tr-header { min-height:76px; display:flex; align-items:center; justify-content:space-between; gap:20px; padding:0 40px; position:relative; z-index:2; border-bottom:1px solid #ffffff0d; }
#trnovany-web-concept .tr-logo { display:flex; align-items:center; gap:10px; text-transform:uppercase; font-size:14px; letter-spacing:2.5px; font-weight:800; }
#trnovany-web-concept .tr-logomark { width:28px; height:31px; display:grid; place-items:center; color:var(--tr-cta-ink); background:var(--tr-accent); font-family:'Barlow Condensed',Impact,sans-serif; font-size:27px; font-weight:800; clip-path:polygon(0 0,100% 0,100% 75%,75% 100%,0 100%); letter-spacing:0; }
#trnovany-web-concept .tr-header-note { color:var(--tr-muted); font-size:11px; letter-spacing:1.8px; font-weight:700; margin-right:62px; }
#trnovany-web-concept .tr-hero { flex:1; display:grid; place-items:center; position:relative; padding:36px 24px 54px; }
#trnovany-web-concept .tr-scene { position:absolute; inset:0; z-index:-1; background-image:var(--tr-photo); background-position:center 42%; background-size:cover; }
#trnovany-web-concept .tr-scene:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,var(--tr-bg),#14181666 30%,#14181666 75%,var(--tr-bg)),linear-gradient(90deg,#14181688,#141816aa 50%,#14181666); }
#trnovany-web-concept .tr-copy { width:100%; max-width:720px; text-align:center; display:flex; flex-direction:column; align-items:center; }
#trnovany-web-concept .tr-versions { display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin:0 0 24px; }
#trnovany-web-concept .tr-badge { display:flex; align-items:center; gap:8px; padding:7px 11px; border:1px solid #ffffff26; border-radius:5px; background:#141816b3; font-size:10px; color:var(--tr-muted); }
#trnovany-web-concept .tr-badge strong { color:var(--tr-fg); font-weight:700; }
#trnovany-web-concept .tr-title { margin:0 0 26px; font-family:'Barlow Condensed',Impact,sans-serif; font-size:clamp(70px,9vw,112px); line-height:.86; letter-spacing:-1.5px; font-weight:800; }
#trnovany-web-concept .tr-title span { color:var(--tr-accent); }
#trnovany-web-concept .tr-title small { display:block; font:700 12px Manrope,Arial,sans-serif; letter-spacing:7px; margin-top:17px; padding-left:7px; color:var(--tr-muted); }
#trnovany-web-concept .tr-platforms { display:flex; gap:26px; margin-bottom:14px; }
#trnovany-web-concept .tr-platform { min-height:44px; border:0; border-bottom:2px solid transparent; padding:8px 0; background:transparent; font-size:11px; font-weight:600; color:var(--tr-muted); transition:color .2s,border-color .2s; }
#trnovany-web-concept .tr-platform[aria-pressed='true'] { color:var(--tr-fg); border-bottom-color:var(--tr-accent); }
#trnovany-web-concept .tr-download { position:relative; overflow:hidden; border:0; background:var(--tr-accent); color:var(--tr-cta-ink); display:flex; align-items:center; justify-content:space-between; gap:18px; font-weight:800; font-size:13px; padding:18px 20px; width:320px; max-width:100%; min-height:56px; clip-path:polygon(0 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%); transition:filter .2s,transform .2s; }
#trnovany-web-concept .tr-download:hover { filter:brightness(1.08); transform:translateY(-2px); }
#trnovany-web-concept .tr-download:active { transform:translateY(1px); }
#trnovany-web-concept .tr-download-icon { font-family:Arial,sans-serif; font-size:23px; line-height:1; font-weight:400; }
#trnovany-web-concept .tr-download:hover .tr-download-icon { animation:tr-download-nudge .7s ease-in-out; }
#trnovany-web-concept .tr-download.is-noticed { animation:tr-notice .35s ease; }
#trnovany-web-concept .tr-download-meta { color:var(--tr-muted); font-size:10px; margin:12px 0 25px; line-height:1.5; }
#trnovany-web-concept .tr-ip-block { border-top:1px solid #ffffff26; padding-top:21px; width:320px; max-width:100%; }
#trnovany-web-concept .tr-ip-label { font-size:9px; letter-spacing:1.8px; color:var(--tr-muted); font-weight:700; margin-bottom:8px; }
#trnovany-web-concept .tr-ip-row { display:flex; align-items:center; justify-content:center; gap:12px; }
#trnovany-web-concept .tr-ip { min-width:0; width:183px; padding:0; color:var(--tr-fg); background:transparent; border:0; font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:17px; letter-spacing:-.6px; }
#trnovany-web-concept .tr-copy-ip { display:grid; place-items:center; padding:8px; background:#14181680; border:1px solid #ffffff33; border-radius:5px; color:var(--tr-muted); min-width:44px; min-height:44px; transition:background .2s,border-color .2s,transform .2s; }
#trnovany-web-concept .tr-copy-ip:hover { border-color:var(--tr-accent); transform:translateY(-2px); }
#trnovany-web-concept .tr-copy-ip.is-copied { background:var(--tr-accent); border-color:var(--tr-accent); color:var(--tr-cta-ink); }
#trnovany-web-concept .tr-copy-icon { font-family:Arial,sans-serif; font-size:21px; line-height:1; }
#trnovany-web-concept .tr-footer { padding:18px 40px; border-top:1px solid #ffffff0d; font-size:10px; color:var(--tr-muted); text-align:center; }
#trnovany-web-concept .tr-footer a { color:inherit; text-decoration:none; }
#trnovany-web-concept .tr-footer a:hover { color:var(--tr-fg); }
#trnovany-web-concept .tr-feedback { min-height:32px; margin:12px 0 -44px; max-width:340px; font-size:11px; line-height:1.5; color:var(--tr-muted); }
@keyframes tr-download-nudge { 50% { transform:translateY(5px); } }
@keyframes tr-notice { 50% { filter:brightness(1.18); } }
@media(max-width:540px) {
  #trnovany-web-concept .tr-header { min-height:64px; padding:0 22px; }
  #trnovany-web-concept .tr-header-note { margin-right:0; font-size:9px; }
  #trnovany-web-concept .tr-hero { padding:28px 22px 48px; }
  #trnovany-web-concept .tr-scene { background-position:60% center; }
  #trnovany-web-concept .tr-title { font-size:clamp(62px,18vw,88px); }
  #trnovany-web-concept .tr-footer { padding:16px 22px; }
}
@media(max-height:700px) and (min-width:541px) {
  #trnovany-web-concept .tr-header { min-height:60px; }
  #trnovany-web-concept .tr-hero { padding-top:20px; padding-bottom:46px; }
  #trnovany-web-concept .tr-versions { margin-bottom:16px; }
  #trnovany-web-concept .tr-title { font-size:76px; margin-bottom:14px; }
  #trnovany-web-concept .tr-download-meta { margin-bottom:16px; }
  #trnovany-web-concept .tr-ip-block { padding-top:14px; }
  #trnovany-web-concept .tr-footer { padding:12px 22px; }
}
@media(prefers-reduced-motion:reduce) { #trnovany-web-concept *, #trnovany-web-concept *:before, #trnovany-web-concept *:after { transition:none!important; animation:none!important; } }
#trnovany-web-concept .tr-server-info { margin-bottom:24px; width:100%; }
#trnovany-web-concept .tr-server-info .tr-versions { margin:0; }
#trnovany-web-concept .tr-maintenance, #trnovany-web-concept .tr-data-note { font-size:11px; line-height:1.5; margin:10px auto 0; max-width:400px; overflow-wrap:anywhere; color:var(--tr-muted); }
#trnovany-web-concept .tr-maintenance { color:var(--tr-accent); }
#trnovany-web-concept .tr-server-status { font-size:12px; margin:10px 0 0; color:var(--tr-muted); }
#trnovany-web-concept .tr-server-status.is-online { color:#9bcb83; }
#trnovany-web-concept .tr-download:focus-visible { outline:0; box-shadow:inset 0 0 0 3px var(--tr-cta-ink); }
@media(max-height:700px) and (min-width:541px) { #trnovany-web-concept .tr-server-info { margin-bottom:16px; } }
