/* 1025DEX Community v0.31.35 · css/trade.css · ausgelagert aus index.html */
/* v0.27.2 · Tauschbörse: Reiter als klare Leiste */
.swap-tabs{display:flex;gap:4px;margin:12px 0 12px;padding:4px;border:1px solid var(--line);border-radius:14px;background:var(--panel);overflow-x:auto;scrollbar-width:none}
.swap-tabs::-webkit-scrollbar{display:none}
.swap-tab{appearance:none;flex:1 1 auto;min-height:38px;padding:8px 6px;letter-spacing:-.01em;border:0;border-radius:10px;background:transparent;color:var(--ink-soft);font:inherit;font-size:11.5px;font-weight:800;white-space:nowrap;cursor:pointer}
.swap-tab.on{background:var(--red);color:#fff;box-shadow:0 3px 10px color-mix(in srgb,var(--red) 35%,transparent)}
.swap-tab:not(.on):active{background:var(--panel-2)}
/* v0.27.3 · Tauschbörse */
.tb-head .onb-title{margin-bottom:2px}
.tb-sub{margin:0 0 12px;font-size:12.5px;line-height:1.45;color:var(--ink-soft)}
.tb-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.tb-stats button{appearance:none;display:grid;gap:2px;justify-items:start;padding:10px 11px;border:1px solid var(--line);border-radius:14px;background:var(--panel);color:var(--ink);font:inherit;text-align:left;cursor:pointer;min-width:0}
.tb-stats b{font-size:22px;font-weight:900;line-height:1}
.tb-stats span{font-size:10.5px;font-weight:700;color:var(--ink-soft);line-height:1.2}
.tb-stats button:active{transform:scale(.97)}
.swap-tab{position:relative}
.tb-dot{position:absolute;top:6px;right:5px;width:7px;height:7px;border-radius:99px;background:var(--red);box-shadow:0 0 0 2px var(--panel)}
.swap-tab.on .tb-dot{background:#fff;box-shadow:none}
.tb-cards{display:grid;gap:10px}
.tb-card{border:1px solid var(--line);border-radius:18px;background:var(--panel);overflow:hidden}
.tb-card>.wl-row{border-top:0}
.tb-chips{display:flex;flex-wrap:wrap;gap:5px;padding:0 12px 10px 70px}
.tb-note{margin:0 12px 10px;padding:8px 10px;border-radius:10px;background:var(--panel-2);font-size:12.5px;line-height:1.4;color:var(--ink);white-space:pre-line;overflow-wrap:anywhere}
.tb-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 12px;border-top:1px solid var(--line-soft)}
.tb-person{appearance:none;display:flex;align-items:center;gap:8px;min-width:0;padding:0;border:0;background:none;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
.tb-person>span{min-width:0;font-size:13px;font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tb-person b{display:block;font-size:14px;overflow:hidden;text-overflow:ellipsis}
.tb-person small{display:block;font-size:11px;font-weight:600;color:var(--ink-soft)}
.tb-card-top{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px 6px}
.tb-status{flex:0 0 auto;font-size:10.5px;font-weight:800;padding:4px 9px;border-radius:99px;background:var(--panel-2);color:var(--ink-soft)}
.tb-status.s-open{background:color-mix(in srgb,#e0a100 18%,transparent);color:#c28a00}
.tb-status.s-accepted{background:color-mix(in srgb,#2f6fd0 16%,transparent);color:#3d7fe0}
.tb-status.s-completed{background:color-mix(in srgb,#22b35e 16%,transparent);color:#1b9a4f}
.tb-status.s-declined,.tb-status.s-cancelled{background:color-mix(in srgb,var(--red) 12%,transparent);color:var(--red)}
.tb-trade{display:grid;gap:2px;padding:0 0 4px}
.tb-trade-line .wl-row{border-top:0;padding-top:4px}
.tb-trade-label{display:block;padding:6px 12px 0;font-size:10.5px;font-weight:900;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-soft)}
.tb-open{margin:4px 12px 6px;padding:10px;border:1px dashed var(--line);border-radius:10px;font-size:12px;color:var(--ink-soft)}
.tb-actions{display:flex;flex-wrap:wrap;gap:7px;padding:10px 12px 12px;border-top:1px solid var(--line-soft)}
.tb-actions .wl-btn{flex:1 1 auto}
.wl-btn.ghost{background:transparent;color:var(--ink-soft)}
.tb-group{margin-bottom:16px}
.tb-count{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:4px;padding:0 5px;border-radius:99px;background:var(--panel-2);color:var(--ink);font-size:10px;letter-spacing:0}
details.tb-group summary{list-style:none;cursor:pointer;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);font-size:13px;font-weight:800;display:flex;justify-content:space-between;margin-bottom:10px}
details.tb-group summary::-webkit-details-marker{display:none}
details.tb-group summary span{color:var(--ink-soft)}
.tb-paused{opacity:.6}
.wl-empty .wl-btn{justify-self:center;margin-top:8px}
.tb-loading{display:flex;justify-content:center;gap:6px;padding:28px}
.tb-loading i{width:8px;height:8px;border-radius:99px;background:var(--ink-soft);opacity:.4;animation:tbDot 1s ease-in-out infinite}
.tb-loading i:nth-child(2){animation-delay:.15s}.tb-loading i:nth-child(3){animation-delay:.3s}
@keyframes tbDot{50%{opacity:1;transform:translateY(-3px)}}
/* v0.27.1 · Wunschliste */
.wl-stat{position:relative;cursor:pointer;transition:transform .15s ease,background .15s ease}
.wl-stat:active{transform:scale(.96)}
.wl-stat:focus-visible{outline:2px solid var(--red);outline-offset:2px}
.wl-stat-chev{position:absolute;right:6px;top:50%;transform:translateY(-50%);display:grid;opacity:.6}
.wl-stat-chev svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.wl-intro{margin-bottom:12px}
.wl-hint{margin:0 0 10px;padding:9px 12px;border-radius:12px;background:var(--panel-2);font-size:12.5px;font-weight:700;color:var(--ink-soft)}
.wl-hint.good{background:color-mix(in srgb,#22b35e 13%,transparent);color:color-mix(in srgb,#22b35e 70%,var(--ink))}
.wl-list{display:grid;border:1px solid var(--line);border-radius:18px;background:var(--panel);overflow:hidden}
.wl-row{display:flex;align-items:center;gap:12px;padding:10px 12px;border-top:1px solid var(--line-soft);min-width:0}
.wl-row:first-child{border-top:0}
.wl-row.hit{background:color-mix(in srgb,#22b35e 6%,transparent)}
.wl-img{flex:0 0 46px;width:46px;height:64px;object-fit:cover;border-radius:6px;background:var(--panel-2);box-shadow:0 2px 8px rgba(0,0,0,.18)}
.wl-img.sm{flex-basis:40px;width:40px;height:56px}
.wl-noimg{display:grid;place-items:center;color:var(--ink-soft);font-weight:800}
.wl-txt{flex:1;min-width:0}
.wl-txt b{display:block;font-size:14px;font-weight:800;line-height:1.25;color:var(--ink)}
.wl-txt small{display:block;margin-top:2px;font-size:12px;line-height:1.3;color:var(--ink-soft)}
.wl-side{display:flex;flex-direction:column;align-items:flex-end;gap:6px;flex:0 0 auto}
.wl-chip{font-size:10.5px;font-weight:800;padding:3px 8px;border-radius:99px;background:var(--panel-2);color:var(--ink-soft);white-space:nowrap}
.wl-chip.good{background:color-mix(in srgb,#22b35e 16%,transparent);color:#1b9a4f}
.wl-state{flex:0 0 auto;font-size:11.5px;color:var(--ink-soft);white-space:nowrap}
.wl-btn{appearance:none;flex:0 0 auto;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:11px;padding:7px 12px;font:inherit;font-size:12.5px;font-weight:800;cursor:pointer;white-space:nowrap}
.wl-btn.primary{background:var(--red);border-color:var(--red);color:#fff}
.wl-btn:active{transform:scale(.96)}
.wl-empty{display:grid;gap:4px;padding:22px 16px;text-align:center;border:1px dashed var(--line);border-radius:16px}
.wl-empty b{font-size:15px}.wl-empty span{font-size:12.5px;line-height:1.45;color:var(--ink-soft)}
.wl-foot{margin:10px 4px 0;font-size:12px;line-height:1.4;color:var(--ink-soft);text-align:center}
.wl-target{border:1px solid var(--line);border-radius:16px;background:var(--panel);margin:0 0 14px}
.wl-label{font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin:0 4px 8px}
.wl-choices{display:grid;gap:8px;margin-bottom:12px}
.wl-choice{display:flex;align-items:center;gap:12px;padding:9px 12px;border:1px solid var(--line);border-radius:14px;background:var(--panel);cursor:pointer}
.wl-choice input{accent-color:var(--red);width:18px;height:18px;flex:0 0 auto;margin:0}
.wl-choice:has(input:checked){border-color:var(--red);box-shadow:0 0 0 1px var(--red) inset}
.wl-safe{margin:8px 2px 4px}
.btn.wl-send{margin-top:6px;min-height:50px;border:0;border-radius:15px;background:var(--red);color:#fff;font-size:15px;font-weight:800}
/* v0.27.0 · Push-Frage */
.pa-wrap{display:grid;gap:12px;padding:4px 2px 2px}
.pa-bell{display:grid;place-items:center;width:62px;height:62px;border-radius:20px;margin:2px auto 2px;color:#fff;background:var(--red);box-shadow:0 10px 26px color-mix(in srgb,var(--red) 40%,transparent)}
.pa-bell svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;animation:paRing 1.6s ease-in-out .4s 2}
@keyframes paRing{0%,100%{transform:rotate(0)}15%{transform:rotate(14deg)}30%{transform:rotate(-12deg)}45%{transform:rotate(8deg)}60%{transform:rotate(-5deg)}75%{transform:rotate(0)}}
.pa-title{text-align:center;font-size:22px;font-weight:900;line-height:1.15;color:var(--ink)}
.pa-copy{margin:0;text-align:center;font-size:13.5px;line-height:1.45;color:var(--ink-soft)}
.pa-list{display:grid;border:1px solid var(--line);border-radius:18px;background:var(--panel);overflow:hidden;margin-top:4px}
.pa-item{display:flex;align-items:center;gap:12px;padding:11px 14px;border-top:1px solid var(--line-soft)}
.pa-item:first-child{border-top:0}
.pa-item b{display:block;font-size:14px;font-weight:800;color:var(--ink)}
.pa-item small{display:block;margin-top:2px;font-size:12px;line-height:1.3;color:var(--ink-soft)}
.pa-ico{display:grid;place-items:center;flex:0 0 36px;width:36px;height:36px;border-radius:12px;color:var(--red);background:color-mix(in srgb,var(--red) 12%,transparent)}
.pa-ico svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.pa-note{margin:0;text-align:center;font-size:12px;line-height:1.45;color:var(--ink-soft)}
.btn.pa-yes{margin:4px 0 0;min-height:50px;border:0;border-radius:15px;background:var(--red);color:#fff;font-size:15px;font-weight:800}
.pa-later{appearance:none;border:0;background:none;padding:10px;font:inherit;font-size:14px;font-weight:700;color:var(--ink-soft);cursor:pointer}
@media (prefers-reduced-motion:reduce){.pa-bell svg{animation:none}}
.pm-avatar-edit{cursor:pointer;position:relative;transition:transform .15s ease}
.pm-avatar-edit:active{transform:scale(.95)}
.pm-avatar-edit:focus-visible{outline:2px solid var(--red);outline-offset:3px}
.pm-avatar-edit .ta-crown{display:none}
.pm-avatar-cam{position:absolute;right:7%;bottom:7%;z-index:7;display:grid;place-items:center;width:30%;height:30%;min-width:22px;min-height:22px;border-radius:99px;background:var(--red);color:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.85),0 3px 8px rgba(0,0,0,.35)}
.pm-avatar-cam svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2.1;stroke-linejoin:round}
.modal .pm-backbtn{position:absolute;top:10px;left:12px;display:flex;align-items:center;gap:3px;padding:3px 10px 3px 6px;z-index:2}
.modal.side .pm-backbtn{top:calc(12px + env(safe-area-inset-top))}
.pm-backbtn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pm-backbtn span{font-size:12px;font-weight:800}
.modal.side .sheetbox:has(.pm-backbtn) .grab{height:34px}
.pm-note{margin:-10px 6px 0;font-size:12px;line-height:1.45;color:var(--ink-soft)}
.pm-applang{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.pm-applang b{font-size:13px}
.pm-seg{display:flex;padding:3px;border-radius:11px;background:var(--panel-2)}
.pm-seg button{appearance:none;border:0;background:none;padding:7px 12px;border-radius:9px;font:inherit;font-size:12px;font-weight:800;color:var(--ink-soft);cursor:pointer}
.pm-seg button.on{background:var(--panel);color:var(--ink);box-shadow:0 1px 4px rgba(0,0,0,.12)}
@media (max-width:360px){.pm-quick{gap:7px}.pm-tile{padding:11px 8px}.pm-tile b{font-size:11px;letter-spacing:-.03em}}

@keyframes cardZoomIn{from{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:scale(1)}}
@keyframes cardZoomOut{from{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.94) translateY(8px)}}
@keyframes toastIn{from{opacity:0;transform:translate(-50%,18px) scale(.94)}to{opacity:1;transform:translate(-50%,0) scale(1)}}
@keyframes toastOut{from{opacity:1;transform:translate(-50%,0) scale(1)}to{opacity:0;transform:translate(-50%,8px) scale(.97)}}
@keyframes countGlow{0%{transform:scale(.94);color:var(--owned)}55%{transform:scale(1.08);color:var(--owned)}100%{transform:scale(1);color:var(--ink)}}
@keyframes navCatch{0%,100%{transform:none}45%{transform:translateY(-4px) scale(1.18);color:var(--owned)}}

