.nt{position:relative; padding:130px 0 90px; min-height:100vh; overflow:hidden}
.nt::before{content:''; position:absolute; inset:-20% -10% auto; height:780px; background:radial-gradient(40% 50% at 22% 35%, rgba(122,140,255,.22), transparent 70%), radial-gradient(35% 45% at 78% 30%, rgba(255,122,217,.18), transparent 70%); pointer-events:none}
.nt-wrap{position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,520px); gap:56px; align-items:center; max-width:1160px}
.nt-kicker{display:inline-flex; align-items:center; gap:8px; padding:7px 14px; border-radius:999px; background:rgba(255,255,255,.07); color:#E9E2FF; font-weight:800; font-size:.82rem; letter-spacing:.04em}
.nt-kicker i{width:8px; height:8px; border-radius:50%; background:#4DF0A5; box-shadow:0 0 0 4px rgba(77,240,165,.18)}
.nt-intro h1{margin:18px 0 14px; font-family:Fredoka, Nunito, sans-serif; font-size:clamp(2.6rem, 5.4vw, 4.2rem); line-height:1.02; letter-spacing:-.01em}
.nt-intro h1 span{background:linear-gradient(120deg,#FFD66B,#FF7AD9 45%,#7A8CFF); -webkit-background-clip:text; background-clip:text; color:transparent}
.nt-intro > p{max-width:470px; color:#CFC7EE; font-size:1.08rem; line-height:1.6; margin:0 0 26px}
.nt-points{list-style:none; padding:0; margin:0; display:grid; gap:12px; max-width:470px}
.nt-points li{display:grid; gap:2px; padding:14px 18px; border-radius:18px; background:rgba(28,20,70,.7); border:1px solid rgba(255,255,255,.06)}
.nt-points b{font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.02rem; color:#fff}
.nt-points span{color:#B9B0D9; font-size:.92rem; font-weight:600}

.nt-card{position:relative; padding:26px; border-radius:30px; background:linear-gradient(180deg,#221857,#1A1244); border:1px solid rgba(255,255,255,.08); box-shadow:0 30px 80px rgba(6,3,20,.55), inset 0 1px 0 rgba(255,255,255,.06); min-height:320px}
.nt-head{display:grid; gap:2px; margin-bottom:16px}
.nt-head b{font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.35rem; color:#fff; overflow-wrap:anywhere}
.nt-head small{color:#B9B0D9; font-weight:700; font-size:.88rem; overflow-wrap:anywhere}

.nt-drop{display:flex; align-items:center; gap:16px; padding:22px; border-radius:22px; border:2px dashed rgba(255,155,227,.35); background:rgba(10,6,30,.35); cursor:pointer; transition:border-color .2s, background .2s, transform .3s cubic-bezier(.34,1.56,.64,1)}
.nt-drop:hover, .nt-drop.over{border-color:#FF9BE3; background:rgba(255,122,217,.08)}
.nt-drop.over{transform:scale(1.015)}
.nt-drop.has{padding:14px 18px}
.nt-plus{flex:none; width:58px; height:58px; display:grid; place-items:center; border-radius:50%; background:linear-gradient(135deg,#FFD66B,#FF7AD9); color:#22114A; box-shadow:0 10px 24px rgba(255,122,217,.35)}
.nt-drop.has .nt-plus{width:42px; height:42px}
.nt-droptext{display:grid; gap:2px}
.nt-droptext b{font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.08rem; color:#fff}
.nt-droptext small{color:#B9B0D9; font-weight:700}

.nt-files{list-style:none; margin:12px 0 0; padding:4px; max-height:220px; overflow-y:auto; border-radius:16px; background:rgba(10,6,30,.35)}
.nt-files.dl{max-height:300px; margin:14px 0}
.nt-files li{display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:12px}
.nt-files li:hover{background:rgba(255,255,255,.04)}
.nt-fic{flex:none; width:32px; height:32px; display:grid; place-items:center; border-radius:10px; background:rgba(122,140,255,.16); color:#C6CEFF}
.nt-fname{flex:1; min-width:0; display:grid}
.nt-fname b{font-size:.9rem; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.nt-fname small{color:#A195CF; font-weight:700; font-size:.76rem}
.nt-x, .nt-dlbtn{flex:none; width:30px; height:30px; display:grid; place-items:center; border:0; border-radius:10px; background:rgba(255,255,255,.06); color:#D2C8F0; cursor:pointer; text-decoration:none}
.nt-x:hover{background:rgba(255,77,109,.2); color:#FF8FA2}
.nt-dlbtn{background:rgba(77,240,165,.14); color:#9DF7CC}
.nt-dlbtn:hover{background:rgba(77,240,165,.25)}
.nt-more{justify-content:center; color:#A195CF; font-weight:700; font-size:.82rem}
.nt-meter{display:grid; gap:6px; margin-top:10px}
.nt-track{height:8px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden}
.nt-track i{display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#7A8CFF,#FF7AD9)}
.nt-meter.over .nt-track i{background:#FF4D6D}
.nt-meter small{color:#B9B0D9; font-weight:700; font-size:.8rem}
.nt-meter.over small{color:#FF8FA2}

.nt-tabs{display:grid; grid-template-columns:1fr 1fr; gap:6px; margin:18px 0 6px; padding:5px; border-radius:16px; background:rgba(10,6,30,.45)}
.nt-tabs button{display:flex; align-items:center; justify-content:center; gap:8px; padding:10px; border:0; border-radius:12px; background:transparent; color:#B9B0D9; font:inherit; font-weight:800; font-size:.9rem; cursor:pointer}
.nt-tabs button.on{background:#2E2270; color:#fff; box-shadow:0 6px 16px rgba(0,0,0,.25)}
.nt-form{display:grid; gap:12px; margin-top:12px}
.nt-field{display:grid; gap:6px}
.nt-field > span{font-size:.74rem; font-weight:900; letter-spacing:.06em; text-transform:uppercase; color:#FF9BE3}
.nt-field input, .nt-field textarea, .nt-unlock input, .nt-linkbox input{width:100%; box-sizing:border-box; padding:12px 14px; border:0; border-radius:14px; background:#0D0826; color:#fff; font:inherit; outline:none; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.nt-field textarea{resize:vertical; min-height:72px}
.nt-field input:focus, .nt-field textarea:focus, .nt-unlock input:focus{box-shadow:inset 0 0 0 2px rgba(255,122,217,.6)}
.nt-field input[readonly]{color:#C6CEFF}
.nt-hint{color:#9DF7CC; font-weight:700; font-size:.78rem}
.nt-chips{display:flex; flex-wrap:wrap; gap:6px; padding:8px; border-radius:14px; background:#0D0826; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.nt-chips input{flex:1; min-width:160px; padding:4px 6px !important; background:transparent !important; box-shadow:none !important}
.nt-chips input.bad{color:#FF8FA2}
.nt-chip{display:inline-flex; align-items:center; gap:6px; padding:5px 6px 5px 11px; border-radius:999px; background:rgba(122,140,255,.2); color:#E3E7FF; font-weight:700; font-size:.82rem}
.nt-chip button{display:grid; place-items:center; width:20px; height:20px; border:0; border-radius:50%; background:rgba(255,255,255,.1); color:#fff; cursor:pointer}
.nt-opts{border-radius:16px; background:rgba(10,6,30,.35)}
.nt-opts summary{display:flex; justify-content:space-between; align-items:center; gap:10px; padding:12px 14px; cursor:pointer; list-style:none; font-weight:800; color:#fff}
.nt-opts summary::-webkit-details-marker{display:none}
.nt-opts summary small{color:#A195CF; font-weight:700; font-size:.78rem; text-align:right}
.nt-optbody{display:grid; gap:12px; padding:0 14px 14px}
.nt-pills{display:flex; flex-wrap:wrap; gap:6px}
.nt-pills button{padding:7px 13px; border:0; border-radius:999px; background:rgba(255,255,255,.07); color:#D2C8F0; font:inherit; font-weight:800; font-size:.82rem; cursor:pointer}
.nt-pills button.on{background:linear-gradient(135deg,#FFD66B,#FF7AD9); color:#22114A}
.nt-toggle{display:flex; align-items:center; gap:10px; color:#D2C8F0; font-weight:700; font-size:.88rem; cursor:pointer}
.nt-toggle input{width:18px; height:18px; accent-color:#FF7AD9}

.nt-go{display:flex; align-items:center; justify-content:center; gap:8px; width:100%; margin-top:16px; padding:15px 20px; border:0; border-radius:18px; background:linear-gradient(135deg,#FFD66B,#FF7AD9); color:#22114A; font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.08rem; text-decoration:none; cursor:pointer; box-shadow:0 14px 30px rgba(255,122,217,.3), inset 0 -4px 0 rgba(0,0,0,.12); transition:transform .3s cubic-bezier(.34,1.56,.64,1), filter .2s}
.nt-go:hover:not(:disabled){transform:translateY(-2px); filter:brightness(1.05)}
.nt-go:disabled{opacity:.45; cursor:not-allowed; box-shadow:none}
.nt-go.small{width:auto; margin-top:0; padding:11px 18px; font-size:.95rem}
.nt-ghost{display:inline-flex; align-items:center; gap:6px; padding:11px 16px; border:0; border-radius:14px; background:rgba(255,255,255,.07); color:#fff; font:inherit; font-weight:800; font-size:.9rem; text-decoration:none; cursor:pointer}
.nt-ghost:hover{background:rgba(255,255,255,.13)}
.nt-ghost.danger{color:#FF8FA2}
.nt-link{display:inline-flex; align-items:center; gap:6px; margin-top:10px; padding:0; border:0; background:none; color:#FF9BE3; font:inherit; font-weight:800; font-size:.86rem; cursor:pointer}
.nt-link:disabled{color:#9DF7CC; cursor:default}
.nt-row{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:10px; margin-top:16px}
.nt-legal{margin:12px 0 0; color:#8E86B8; font-size:.78rem; font-weight:600; line-height:1.5}
.nt-legal a{color:#FF9BE3}
.nt-error{margin:12px 0 0; padding:10px 14px; border-radius:12px; background:rgba(255,77,109,.12); color:#FFB3C0; font-weight:700; font-size:.88rem}
.nt-error:empty{display:none}
.nt-message{margin:0 0 14px; padding:12px 14px; border-radius:14px; background:rgba(10,6,30,.4); color:#E2DCF8; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.55}
.nt-metarow{display:flex; flex-wrap:wrap; gap:8px}
.nt-metarow span{display:inline-flex; align-items:center; gap:4px; padding:6px 11px; border-radius:999px; background:rgba(255,255,255,.07); color:#D2C8F0; font-weight:800; font-size:.78rem}
.nt-unlock{display:flex; gap:8px; margin-top:16px}
.nt-loading{display:grid; place-items:center; min-height:260px; color:#B9B0D9; font-weight:700}

.nt-code{display:grid; grid-template-columns:repeat(6,1fr); gap:8px; margin:10px 0}
.nt-code input{width:100%; aspect-ratio:1/1.15; box-sizing:border-box; border:0; border-radius:14px; background:#0D0826; color:#fff; font-family:Fredoka, Nunito, sans-serif; font-size:1.6rem; text-align:center; outline:none; box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.nt-code input:focus{box-shadow:inset 0 0 0 2px #FF7AD9}

.nt-progress{display:grid; justify-items:center; gap:14px; padding:12px 0; text-align:center}
.nt-ringwrap{position:relative; width:190px; height:190px}
.nt-ring{width:100%; height:100%; transform:rotate(-90deg)}
.nt-ring circle{fill:none; stroke-width:9}
.nt-ring .bg{stroke:rgba(255,255,255,.08)}
.nt-ring .fg{stroke:url(#ntg); stroke-linecap:round; stroke-dasharray:327; stroke-dashoffset:327; transition:stroke-dashoffset .4s ease}
.nt-progress.scanning .nt-ring{animation:ntscan 1.4s linear infinite}
.nt-progress.scanning .nt-ring .fg{stroke-dasharray:90 237; transition:none}
@keyframes ntscan{from{transform:rotate(-90deg)}to{transform:rotate(270deg)}}
.nt-pct{position:absolute; inset:0; display:grid; place-items:center; font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:2.4rem; color:#fff}
.nt-pinfo{display:grid; gap:4px}
.nt-pinfo b{font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.2rem; color:#fff}
.nt-pinfo small{color:#B9B0D9; font-weight:700}
.nt-pfile{max-width:380px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}

.nt-done{display:grid; justify-items:center; gap:6px; padding:8px 0 4px; text-align:center}
.nt-done b{font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.5rem; color:#fff}
.nt-done small{color:#B9B0D9; font-weight:700; max-width:380px; line-height:1.5}
.nt-okbadge{width:72px; height:72px; display:grid; place-items:center; margin-bottom:8px; border-radius:50%; background:linear-gradient(135deg,#4DF0A5,#7AF0FF); color:#06281A; box-shadow:0 14px 34px rgba(77,240,165,.35); animation:nt-pop .6s cubic-bezier(.34,1.56,.64,1)}
.nt-okbadge.off{background:rgba(255,255,255,.08); color:#D2C8F0; box-shadow:none}
@keyframes nt-pop{from{transform:scale(.3); opacity:0}}
.nt-linkbox{display:flex; gap:8px; margin:18px 0 12px}
.nt-linkbox input{font-family:'Cascadia Code', ui-monospace, monospace; font-size:.86rem; color:#FFE3A3}
.nt-copy{flex:none; display:inline-flex; align-items:center; gap:6px; padding:0 16px; border:0; border-radius:14px; background:#2E2270; color:#fff; font:inherit; font-weight:800; cursor:pointer}
.nt-copy.done{background:rgba(77,240,165,.25); color:#BFFFE2}

.transferpage .nt-tab{display:none}
@media (max-width:980px){
  .nt{padding-top:110px}
  .nt-wrap{grid-template-columns:1fr; gap:30px}
  .nt-intro h1{font-size:2.6rem}
}
@media (max-width:520px){
  .nt-card{padding:18px; border-radius:24px}
  .nt-tabs button{font-size:.8rem}
  .nt-linkbox{flex-direction:column}
  .nt-copy{padding:12px}
}
@media (prefers-reduced-motion: reduce){.nt-okbadge{animation:none} .nt-ring .fg{transition:none} .nt-progress.scanning .nt-ring{animation-duration:4s}}

/* Eigenständige Seite ohne NITE-Navigation */
.transferpage{min-height:100vh; display:flex; flex-direction:column}
.transferpage .nt{flex:1; padding:64px 0 48px; min-height:0; display:flex; align-items:center}
.transferpage .nt-wrap{width:100%}
.nt-brand{display:inline-flex; align-items:center; gap:12px; color:#fff; text-decoration:none}
.nt-brand img{width:40px; height:40px; border-radius:12px; filter:drop-shadow(0 6px 16px rgba(122,140,255,.35))}
.nt-brand span{font-family:Fredoka, Nunito, sans-serif; font-weight:700; font-size:1.25rem; letter-spacing:.14em}
.nt-foot{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; width:min(1160px, calc(100% - 48px)); margin:0 auto; padding:18px 0 24px; border-top:1px solid rgba(255,255,255,.07); color:#8E86B8; font-size:.82rem; font-weight:700}
.nt-foot nav{display:flex; gap:18px}
.nt-foot a{color:#B9B0D9; text-decoration:none}
.nt-foot a:hover{color:#fff}
@media (max-width:980px){.transferpage .nt{padding-top:36px; align-items:flex-start}}
@media (max-width:980px){.transferpage .nt-points{display:none} .transferpage .nt-intro > p{margin-bottom:0} .transferpage .nt-wrap{gap:22px}}

/* ── Schritt 1: nur Dateien ziehen ── */
.nt-badges{display:flex; flex-wrap:wrap; gap:8px; margin:-4px 0 18px}
.nt-badges span{display:inline-flex; align-items:center; gap:7px; padding:8px 14px; border-radius:999px; font-weight:900; font-size:.9rem}
.nt-badges .free{background:rgba(77,240,165,.14); color:#8FF5C6; box-shadow:inset 0 0 0 1px rgba(77,240,165,.3)}
.nt-badges .safe{background:rgba(122,140,255,.16); color:#C6CEFF; box-shadow:inset 0 0 0 1px rgba(122,140,255,.32)}
.nt-bigdrop{display:grid; justify-items:center; align-content:center; gap:8px; min-height:300px; padding:30px 20px; border-radius:24px; border:2px dashed rgba(255,155,227,.35); background:rgba(10,6,30,.35); text-align:center; cursor:pointer; outline:none; transition:border-color .2s, background .2s, transform .35s cubic-bezier(.34,1.56,.64,1)}
.nt-bigdrop:hover, .nt-bigdrop:focus-visible, .nt-dragging .nt-bigdrop{border-color:#FF9BE3; background:rgba(255,122,217,.08)}
.nt-dragging .nt-bigdrop{transform:scale(1.02)}
.nt-bigdrop b{margin-top:10px; font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.4rem; color:#fff}
.nt-bigdrop small{color:#B9B0D9; font-weight:700}
.nt-plus{display:grid; place-items:center; flex:none; border:0; border-radius:50%; background:linear-gradient(135deg,#FFD66B,#FF7AD9); color:#22114A; cursor:pointer; box-shadow:0 12px 28px rgba(255,122,217,.35)}
.nt-plus.big{width:88px; height:88px; animation:nt-breathe 2.8s ease-in-out infinite}
.nt-plus.small{width:44px; height:44px; border-radius:14px}
@keyframes nt-breathe{50%{transform:scale(1.06); box-shadow:0 16px 36px rgba(255,122,217,.5)}}
.nt-plain{padding:0; border:0; background:none; color:#fff; font:inherit; font-weight:800; text-align:left; cursor:pointer}
.nt-plain.sub{color:#A195CF; font-size:.8rem; font-weight:700}
.nt-plain.sub:hover{color:#FF9BE3}
.nt-plain.center{display:block; margin:14px auto 0; color:#FF9BE3; font-size:.9rem}
.nt-trustline{display:flex; flex-wrap:wrap; justify-content:center; gap:16px; margin-top:16px; color:#A195CF; font-weight:800; font-size:.8rem}
.nt-trustline span{display:inline-flex; align-items:center; gap:6px}
.nt-trustline span:first-child{color:#8FF5C6}

/* ── Schritt 2: wie SwissTransfer, zweispaltig ── */
.nt-wrap.wide{grid-template-columns:1fr; justify-items:center; gap:20px}
.nt-wrap.wide .nt-intro{text-align:center}
.nt-wrap.wide .nt-intro > :not(.nt-brand){display:none}
.nt-card.wide{width:min(900px, 100%); padding:0; overflow:hidden}
.nt-compose{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); min-height:470px}
.nt-left{display:flex; flex-direction:column; gap:10px; padding:22px; border-right:1px solid rgba(255,255,255,.07)}
.nt-lhead{display:flex; justify-content:space-between; align-items:baseline; gap:10px}
.nt-lhead b{color:#fff; font-weight:900}
.nt-lhead small{color:#A195CF; font-weight:800; font-size:.8rem}
.nt-lhead small.over{color:#FF8FA2}
.nt-left .nt-files{flex:1; margin:0; max-height:none; min-height:180px; background:rgba(10,6,30,.4)}
.nt-left .nt-meter{margin:0}
.nt-addmore{display:flex; align-items:center; gap:12px; padding-top:6px}
.nt-addmore span{display:grid; gap:1px}
.nt-right{display:flex; flex-direction:column; padding:22px}
.nt-right .nt-tabs{margin:0 0 12px}
.nt-right .nt-form{margin:0; gap:10px}
.nt-in{width:100%; box-sizing:border-box; padding:13px 15px; border:0; border-radius:14px; background:#0D0826; color:#fff; font:inherit; outline:none; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.nt-in::placeholder, .nt-chips input::placeholder{color:#7D74A6}
.nt-in:focus{box-shadow:inset 0 0 0 2px rgba(255,122,217,.6)}
textarea.nt-in{resize:vertical; min-height:96px}
.nt-in[readonly]{color:#C6CEFF}
.nt-bottom{margin-top:auto; padding-top:16px}
.nt-setrow{display:flex; gap:8px}
.nt-valid{position:relative; flex:1; min-width:0}
.nt-validbtn{display:flex; align-items:center; gap:8px; width:100%; height:46px; padding:0 14px; border:0; border-radius:14px; background:#0D0826; color:#E2DCF8; font:inherit; font-weight:800; font-size:.88rem; cursor:pointer; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.nt-validbtn > span{flex:1; text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.nt-validbtn:hover{box-shadow:inset 0 0 0 1px rgba(255,155,227,.4)}
.nt-leaf{color:#4DF0A5; fill:rgba(77,240,165,.25); flex:none}
.nt-validmenu{position:absolute; left:0; right:0; bottom:calc(100% + 8px); z-index:5; display:grid; gap:4px; padding:8px; border-radius:16px; background:#2A1F63; box-shadow:0 18px 40px rgba(6,3,20,.6), inset 0 0 0 1px rgba(255,255,255,.08)}
.nt-validmenu[hidden]{display:none}
.nt-validmenu button{display:flex; align-items:center; justify-content:space-between; gap:10px; padding:10px 12px; border:0; border-radius:11px; background:transparent; color:#fff; font:inherit; font-weight:800; font-size:.9rem; cursor:pointer}
.nt-validmenu button:hover{background:rgba(255,255,255,.07)}
.nt-validmenu button.on{background:rgba(255,122,217,.16)}
.nt-eco{display:inline-flex; align-items:center; gap:5px; padding:3px 9px; border-radius:999px; background:rgba(77,240,165,.14); color:#8FF5C6; font-size:.72rem; font-weight:900}
.nt-ecotip{display:flex; align-items:center; gap:6px; margin:4px 4px 2px; color:#A195CF; font-size:.74rem; font-weight:700}
.nt-setbtn{flex:none; height:46px; padding:0 16px; border:0; border-radius:14px; background:#0D0826; color:#FF9BE3; font:inherit; font-weight:900; font-size:.88rem; cursor:pointer; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.nt-setbtn:hover, .nt-setbtn.on{box-shadow:inset 0 0 0 1px rgba(255,155,227,.5)}
.nt-setbtn.on::after{content:''; display:inline-block; width:7px; height:7px; margin-left:8px; border-radius:50%; background:#4DF0A5; vertical-align:2px}
.nt-right .nt-go{margin-top:10px}
.nt-sheetback{position:absolute; inset:0; z-index:10; display:grid; place-items:center; padding:20px; background:rgba(8,4,24,.6); animation:nt-fade .2s ease}
.nt-sheet{display:grid; gap:14px; width:min(420px,100%); padding:22px; border-radius:22px; background:#2A1F63; box-shadow:0 24px 60px rgba(6,3,20,.6); animation:nt-up .35s cubic-bezier(.34,1.56,.64,1)}
.nt-sheethead{display:flex; justify-content:space-between; align-items:center}
.nt-sheethead b{font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.2rem; color:#fff}
.nt-sheet .nt-go{margin-top:2px}
@keyframes nt-fade{from{opacity:0}}
@keyframes nt-up{from{opacity:0; transform:translateY(14px) scale(.97)}}
@media (max-width:820px){
  .nt-compose{grid-template-columns:1fr}
  .nt-left{border-right:0; border-bottom:1px solid rgba(255,255,255,.07)}
  .nt-left .nt-files{min-height:0; max-height:220px}
}
@media (prefers-reduced-motion: reduce){.nt-plus.big{animation:none}}

/* Feinschliff: Hinzufügen-Zeile, Empfängerfeld, Autofill */
.nt-addmore{display:flex; align-items:stretch; gap:8px}
.nt-addbtn{flex:1; display:flex; align-items:center; gap:12px; min-width:0; padding:10px 14px 10px 10px; border:0; border-radius:18px; background:rgba(10,6,30,.4); color:#fff; font:inherit; text-align:left; cursor:pointer; transition:background .2s}
.nt-addbtn:hover{background:rgba(255,122,217,.1)}
.nt-addbtn .nt-plus.small{width:42px; height:42px; border-radius:13px; box-shadow:0 8px 18px rgba(255,122,217,.3)}
.nt-addtext{display:flex; flex-direction:column; justify-content:center; gap:2px; min-width:0; line-height:1.25}
.nt-addtext b{font-weight:900; font-size:.92rem; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.nt-addtext small{font-weight:700; font-size:.76rem; color:#A195CF}
.nt-foldbtn{flex:none; width:62px; display:grid; place-items:center; border:0; border-radius:18px; background:rgba(10,6,30,.4); color:#C6CEFF; cursor:pointer; transition:background .2s, color .2s}
.nt-foldbtn:hover{background:rgba(122,140,255,.18); color:#fff}

.nt-chips{display:flex; flex-wrap:wrap; align-items:center; gap:6px; min-height:48px; padding:6px 8px; box-sizing:border-box; border-radius:14px; background:#0D0826; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); cursor:text; transition:box-shadow .15s}
.nt-chips:focus-within{box-shadow:inset 0 0 0 2px rgba(255,122,217,.6)}
.nt-chips .nt-chipin{flex:1; min-width:150px; height:34px; margin:0; padding:0 7px !important; border:0 !important; outline:0 !important; border-radius:0; background:transparent !important; box-shadow:none !important; color:#fff; font:inherit; -webkit-appearance:none; appearance:none}
.nt-chips .nt-chipin.bad{color:#FF8FA2}
.nt-chip{height:32px; box-sizing:border-box}
.nt-in, .nt-chipin, .nt-field input, .nt-unlock input{-webkit-appearance:none; appearance:none; border:0; outline:0}
.nt-in:-webkit-autofill, .nt-in:-webkit-autofill:hover, .nt-in:-webkit-autofill:focus, .nt-chipin:-webkit-autofill, .nt-field input:-webkit-autofill{-webkit-text-fill-color:#fff; caret-color:#fff; -webkit-box-shadow:0 0 0 100px #0D0826 inset, inset 0 0 0 1px rgba(255,255,255,.08); transition:background-color 9999s}

/* Bestätigungsfenster im NITE-Design */
.nt-modal{position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px; background:rgba(8,4,24,.68); animation:nt-fade .18s ease}
.nt-modal.out{opacity:0; transition:opacity .16s ease}
.nt-modalbox{display:grid; justify-items:center; gap:8px; width:min(420px,100%); padding:28px 24px 22px; border-radius:26px; background:linear-gradient(180deg,#2A1F63,#211852); box-shadow:0 30px 70px rgba(6,3,20,.6), inset 0 1px 0 rgba(255,255,255,.07); text-align:center; animation:nt-up .38s cubic-bezier(.34,1.56,.64,1)}
.nt-modalic{display:grid; place-items:center; width:64px; height:64px; margin-bottom:6px; border-radius:22px; background:rgba(255,77,109,.16); color:#FF8FA2}
.nt-modalbox.warn .nt-modalic{background:rgba(255,214,107,.16); color:#FFD66B}
.nt-modalbox > b{font-family:Fredoka, Nunito, sans-serif; font-weight:600; font-size:1.35rem; color:#fff}
.nt-modalbox > p{margin:0; color:#C9C0EA; font-weight:600; font-size:.92rem; line-height:1.55}
.nt-modalbox .nt-in{margin-top:6px; text-align:left}
.nt-modalbox .nt-error{width:100%; box-sizing:border-box; margin:4px 0 0}
.nt-modalbtns{display:grid; grid-template-columns:1fr 1fr; gap:8px; width:100%; margin-top:12px}
.nt-modalbtns .nt-ghost{justify-content:center}
.nt-modalok{padding:12px 16px; border:0; border-radius:14px; background:linear-gradient(135deg,#FF6B8B,#FF4D6D); color:#fff; font:inherit; font-weight:900; cursor:pointer; box-shadow:0 10px 24px rgba(255,77,109,.35); transition:transform .3s cubic-bezier(.34,1.56,.64,1), filter .2s}
.nt-modalbox.warn .nt-modalok{background:linear-gradient(135deg,#FFD66B,#FF7AD9); color:#22114A; box-shadow:0 10px 24px rgba(255,122,217,.3)}
.nt-modalok:hover:not(:disabled){transform:translateY(-1px); filter:brightness(1.06)}
.nt-modalok:disabled{opacity:.6; cursor:default}

/* Ordner-Knopf und ruhige Hover-Zustände */
.nt-foldbtn{width:78px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:#C6CEFF; font:inherit; font-weight:900; font-size:.72rem; letter-spacing:.02em}
.nt-foldbtn svg{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
.nt-foldbtn:hover{background:rgba(122,140,255,.16); color:#fff}
.nt-foldbtn:hover svg{transform:translateY(-2px) scale(1.06)}
.nt-validbtn:hover, .nt-setbtn:hover, .nt-setbtn.on{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); background:#150E35}
.nt-validbtn:focus-visible, .nt-setbtn:focus-visible{outline:2px solid rgba(255,255,255,.35); outline-offset:2px}

.nt-okbadge.bad{background:rgba(255,77,141,.16); color:#FF9BB5; box-shadow:inset 0 0 0 1px rgba(255,77,141,.4)}
.nt-prog{font-style:normal; margin-left:6px; padding:1px 7px; border-radius:999px; font-size:.68rem; font-weight:700; color:#FFD66B; background:rgba(255,214,107,.12)}
.nt-progwarn{margin:0 0 12px; padding:10px 12px; border-radius:12px; font-size:.8rem; font-weight:600; line-height:1.45; color:#FFE3A3; background:rgba(255,214,107,.1); box-shadow:inset 0 0 0 1px rgba(255,214,107,.22)}
.nt-plushint{margin:10px 0 0; padding:10px 12px; border-radius:12px; background:linear-gradient(135deg,rgba(124,92,255,.18),rgba(240,90,200,.1)); box-shadow:inset 0 0 0 1px rgba(196,181,253,.25); color:#E6DEFF; font-size:.85rem; line-height:1.45}
.nt-plushint b{color:#fff}
.nt-plushint.on{background:rgba(52,211,153,.1); box-shadow:inset 0 0 0 1px rgba(52,211,153,.3); color:#BFF5DC; font-weight:700}
.nt-langsw{display:inline-flex; gap:2px; padding:3px; border-radius:10px; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.07)}
.nt-langsw button{padding:4px 10px; border:0; border-radius:8px; background:none; color:#B9B0D9; font:inherit; font-size:.76rem; font-weight:800; letter-spacing:.04em; cursor:pointer}
.nt-langsw button:hover{color:#fff}
.nt-langsw button.on{background:rgba(255,255,255,.12); color:#fff}
