:root{--bg-deep: #0e0a06;--bg: #14100a;--surface: #1f1812;--surface-2: #2a2017;--surface-3: #3a2c1f;--surface-hover: #322519;--border: #4a3422;--border-strong: #6b4c30;--border-gold: rgba(224, 165, 51, .35);--text: #f4ead0;--text-strong: #fff6dc;--text-muted: #a89882;--text-faint: #7a6a55;--gold: #e0a533;--gold-bright: #ffc961;--gold-deep: #b8841e;--gold-soft: rgba(224, 165, 51, .15);--danger: #e0392c;--danger-bright: #ff5040;--danger-soft: rgba(224, 57, 44, .15);--success: #5cb85c;--success-bright: #7dd87d;--success-soft: rgba(92, 184, 92, .15);--info: #5ba9f0;--info-soft: rgba(91, 169, 240, .15);--tie: #c5a567;--tie-soft: rgba(197, 165, 103, .15);--shadow-card: 0 6px 18px rgba(0, 0, 0, .5), inset 0 1px 0 rgba(255, 200, 100, .04);--shadow-elevated: 0 14px 36px rgba(0, 0, 0, .55), inset 0 1px 0 rgba(255, 200, 100, .08);--shadow-button: 0 3px 0 rgba(0, 0, 0, .35), 0 4px 10px rgba(0, 0, 0, .45);--shadow-glow-gold: 0 0 24px rgba(224, 165, 51, .35)}*{box-sizing:border-box}html,body{height:100%}body{margin:0;color:var(--text);font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;font-size:14px;line-height:1.5;min-height:100vh;background-color:var(--bg-deep);background-image:radial-gradient(ellipse 1200px 800px at 20% -10%,rgba(80,52,28,.55),transparent 60%),radial-gradient(ellipse 1000px 600px at 100% 110%,rgba(60,38,20,.5),transparent 60%),radial-gradient(ellipse 600px 400px at 50% 50%,rgba(45,30,16,.25),transparent 60%);background-attachment:fixed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;opacity:.08;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.3  0 0 0 0 0.2  0 0 0 0 0.1  0 0 0 1 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");mix-blend-mode:overlay;z-index:0}#root{position:relative;z-index:1}h1,h2,h3,h4{font-family:Cinzel,Georgia,serif;font-weight:700;letter-spacing:.02em;color:var(--text-strong);margin:0 0 12px}h1{font-size:28px}h2{font-size:20px}h3{font-size:16px}a{color:var(--gold-bright);text-decoration:none;transition:filter .15s}a:hover{filter:brightness(1.15);text-shadow:0 0 8px rgba(255,201,97,.4)}.container{max-width:1180px;margin:0 auto;padding:28px 22px 60px}.nav{position:relative;display:flex;justify-content:space-between;align-items:center;padding:14px 28px;background:linear-gradient(180deg,#3c281699,#1e160ed9);border-bottom:1px solid var(--border);box-shadow:0 6px 18px #0006}.nav:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold) 30%,var(--gold-bright) 50%,var(--gold) 70%,transparent);opacity:.6}.nav .brand{font-family:Cinzel,Georgia,serif;font-weight:900;font-size:19px;letter-spacing:.04em}.nav .brand a{background:linear-gradient(180deg,var(--gold-bright),var(--gold) 50%,var(--gold-deep));-webkit-background-clip:text;background-clip:text;color:transparent;position:relative;display:inline-block;text-decoration:none;padding:2px 2px 6px;outline:none;transition:filter .2s ease,transform .2s ease}.nav .brand a:after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:linear-gradient(90deg,transparent 0%,var(--gold) 25%,var(--gold-bright) 50%,var(--gold) 75%,transparent 100%);transform:scaleX(0);transform-origin:center;transition:transform .28s cubic-bezier(.4,0,.2,1),opacity .2s;opacity:0;pointer-events:none}.nav .brand a:hover,.nav .brand a:focus-visible{text-decoration:none;text-shadow:none;filter:brightness(1.12);transform:translateY(-.5px)}.nav .brand a:hover:after,.nav .brand a:focus-visible:after{transform:scaleX(1);opacity:1}.nav .right{display:flex;gap:14px;align-items:center;font-size:13px;color:var(--text-muted)}.nav .right .user-tag{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:999px;color:var(--text-strong)}.card{position:relative;background:linear-gradient(180deg,#3c2a1880,#1c140c99),var(--surface);border:1px solid var(--border);border-radius:12px;padding:22px 24px;margin-bottom:20px;box-shadow:var(--shadow-card)}.card h2{margin-top:0}.card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:12px;pointer-events:none;background:linear-gradient(180deg,rgba(224,165,51,.2),transparent 12%)}.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:10px 18px;font-family:Inter,sans-serif;font-weight:700;font-size:14px;letter-spacing:.02em;border:1px solid rgba(0,0,0,.45);border-radius:8px;cursor:pointer;-webkit-user-select:none;user-select:none;background:linear-gradient(180deg,var(--gold-bright),var(--gold) 55%,var(--gold-deep));color:#2b1d08;text-shadow:0 1px 0 rgba(255,230,170,.5);box-shadow:inset 0 1px #fff0c8b3,inset 0 -2px #00000040,var(--shadow-button);transition:transform .08s ease,filter .15s ease,box-shadow .15s ease}.btn:hover{filter:brightness(1.08)}.btn:active{transform:translateY(1px);box-shadow:inset 0 1px #fff0c866,inset 0 -1px #00000040,0 1px #00000059}.btn:disabled{opacity:.55;cursor:not-allowed;filter:grayscale(.4)}.btn.secondary{background:linear-gradient(180deg,#4a3422,#36241a);color:var(--text);text-shadow:0 1px 0 rgba(0,0,0,.6);border-color:#00000073;box-shadow:inset 0 1px #ffc8641a,inset 0 -2px #00000059,var(--shadow-button)}.btn.danger{background:linear-gradient(180deg,#ff5040,var(--danger) 55%,#a8221a);color:#fff;text-shadow:0 1px 0 rgba(0,0,0,.4)}.btn.small{padding:6px 12px;font-size:12px;border-radius:7px}.btn.ghost{background:transparent;border:1px solid var(--border);color:var(--text);box-shadow:none;text-shadow:none}.btn.ghost:hover{background:var(--surface-2)}input,textarea,select{background:var(--surface-2);color:var(--text);border:1px solid var(--border);border-radius:8px;padding:11px 14px;font-family:inherit;font-size:14px;width:100%;transition:border-color .15s,box-shadow .15s}input:focus,textarea:focus,select:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px #e0a5332e}input::placeholder{color:var(--text-faint)}label{display:block;margin-bottom:6px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;color:var(--text-muted)}.field{margin-bottom:16px}table{width:100%;border-collapse:collapse;font-size:14px}th,td{text-align:left;padding:11px 14px;border-bottom:1px solid var(--border)}th{color:var(--gold);font-weight:600;font-size:11px;letter-spacing:.08em;text-transform:uppercase;background:#0000002e}tbody tr{transition:background .1s}tbody tr:hover td{background:var(--surface-2)}tbody tr:last-child td{border-bottom:0}td b{color:var(--text-strong)}.muted{color:var(--text-muted)}.error{background:var(--danger-soft);color:var(--danger-bright);border:1px solid rgba(248,81,73,.35);padding:11px 16px;border-radius:8px;margin-bottom:14px;font-size:14px}.success{background:var(--success-soft);color:var(--success-bright);border:1px solid rgba(46,160,67,.35);padding:11px 16px;border-radius:8px;margin-bottom:14px;font-size:14px}.row{display:flex;gap:12px;align-items:center}.row.between{justify-content:space-between}.spacer{flex:1}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;background:var(--surface-2);color:var(--text-muted);font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;border:1px solid var(--border)}.badge.win{background:var(--success-soft);color:var(--success-bright);border-color:#2ea04366}.badge.lose{background:var(--danger-soft);color:var(--danger-bright);border-color:#f8514966}.badge.tie{background:var(--tie-soft);color:var(--tie);border-color:#c5a56766}.badge.danger{background:var(--danger-soft);color:var(--danger-bright);border-color:#f8514966}.badge.gold{background:linear-gradient(180deg,var(--gold-bright),var(--gold));color:#2b1d08;border-color:var(--gold-deep);text-shadow:0 1px 0 rgba(255,230,170,.5)}.badge.info{background:var(--info-soft);color:var(--info);border-color:#5ba9f066}.tabs{display:flex;gap:2px;background:#00000040;border-radius:10px;padding:4px;margin-bottom:18px;border:1px solid var(--border)}.tabs .tab{flex:1;text-align:center;padding:9px 14px;cursor:pointer;color:var(--text-muted);font-weight:600;font-size:13px;letter-spacing:.02em;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;gap:6px;transition:background .15s,color .15s,transform .05s}.tabs .tab:hover{color:var(--text);background:var(--surface-2)}.tabs .tab.active{background:linear-gradient(180deg,#e0a53333,#b8841e1f);color:var(--gold-bright);border:1px solid var(--border-gold);box-shadow:inset 0 1px #ffc86426}.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}.kpi{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-bottom:18px}.kpi .item{position:relative;background:linear-gradient(180deg,var(--surface-2),rgba(20,14,8,.6));border:1px solid var(--border);border-radius:10px;padding:14px 16px;overflow:hidden}.kpi .item:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,var(--gold-bright),var(--gold-deep))}.kpi .item .label{color:var(--text-muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:600}.kpi .item .value{font-family:Cinzel,Georgia,serif;font-size:26px;font-weight:700;color:var(--text-strong);margin-top:6px;text-shadow:0 1px 0 rgba(0,0,0,.4)}.clan-grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}.clan-card{position:relative;display:flex;flex-direction:column;gap:16px;padding:22px;border-radius:14px;border:1px solid var(--border);background:radial-gradient(ellipse 220px 120px at 50% -10%,rgba(224,165,51,.12),transparent 70%),linear-gradient(180deg,var(--surface-2),rgba(20,14,8,.85));box-shadow:var(--shadow-card);cursor:pointer;transition:transform .12s ease,border-color .15s,box-shadow .15s;overflow:hidden}.clan-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:14px;pointer-events:none;background:linear-gradient(180deg,rgba(224,165,51,.25),transparent 8%)}.clan-card:hover{transform:translateY(-3px);border-color:var(--border-gold);box-shadow:var(--shadow-elevated)}.clan-card:hover .clan-card-name{color:var(--gold-bright)}.clan-card-header{display:flex;align-items:center;gap:14px}.clan-badge{width:64px;height:64px;flex-shrink:0;border-radius:12px;background:#00000059;box-shadow:0 0 0 1px #e0a53333,inset 0 0 0 2px #0000004d;object-fit:contain;padding:4px}.clan-badge-placeholder{width:64px;height:64px;flex-shrink:0;border-radius:12px;background:linear-gradient(180deg,var(--surface-3),rgba(0,0,0,.4));display:flex;align-items:center;justify-content:center;font-size:30px;color:var(--gold);border:1px solid var(--border)}.clan-card-name{flex:1;min-width:0;transition:color .15s}.clan-card-name h3{font-family:Cinzel,serif;font-size:18px;font-weight:700;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--text-strong);transition:color .15s}.clan-card-name .tag{font-size:12px;color:var(--text-muted);margin-top:2px;letter-spacing:.04em}.clan-card-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.clan-stat{background:#00000059;border:1px solid var(--border);border-radius:8px;padding:9px 10px;text-align:center;overflow:hidden}.clan-stat .value{font-family:Cinzel,serif;font-weight:700;font-size:15px;color:var(--text-strong);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.clan-stat .label{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--text-muted);margin-top:3px}.clan-card-remove{position:absolute;top:8px;right:8px;background:#00000080;color:var(--text-muted);border:1px solid var(--border);width:28px;height:28px;border-radius:999px;font-size:18px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;line-height:1;z-index:2;opacity:0;transition:opacity .15s,color .15s,background .15s,transform .1s}.clan-card:hover .clan-card-remove{opacity:1}.clan-card-remove:hover{color:var(--danger-bright);border-color:var(--danger);background:var(--danger-soft);transform:scale(1.08)}.clan-empty{text-align:center;padding:40px 20px;color:var(--text-muted)}.clan-empty .icon{font-size:48px;margin-bottom:12px;opacity:.5}.center{display:flex;align-items:center;justify-content:center;min-height:100vh;padding:24px}.center .card{width:100%;max-width:420px;padding:32px 30px}.center .card h2{text-align:center;font-size:24px}.center .brand-large{text-align:center;font-family:Cinzel,Georgia,serif;font-weight:900;font-size:26px;letter-spacing:.06em;background:linear-gradient(180deg,var(--gold-bright),var(--gold) 50%,var(--gold-deep));-webkit-background-clip:text;background-clip:text;color:transparent;margin-bottom:6px}.center .brand-tagline{text-align:center;color:var(--text-muted);font-size:13px;margin-bottom:24px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;padding:16px}.modal-backdrop .card{max-width:540px;width:100%;margin:0;box-shadow:var(--shadow-elevated)}.reasons{font-size:13px;color:var(--text-muted)}.reasons li{margin-bottom:3px}button.icon-x{background:transparent;border:0;color:var(--text-muted);font-size:22px;cursor:pointer;line-height:1;padding:4px 8px}button.icon-x:hover{color:var(--text)}.back-link{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;margin-bottom:14px;font-size:13px;color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);border-radius:999px;transition:color .15s,border-color .15s,background .15s;text-decoration:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.back-link:hover{color:var(--gold-bright);border-color:var(--border-gold);background:var(--surface-3);text-decoration:none;text-shadow:none}.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:0 -4px}.table-scroll>table{min-width:100%}@media (max-width: 900px){.container{padding:22px 16px 50px}.clan-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}.kpi{grid-template-columns:repeat(3,1fr)}}@media (max-width: 700px){body{font-size:13px}.container{padding:14px 10px 40px}.nav{padding:10px 12px;flex-wrap:wrap;gap:10px}.nav .brand{font-size:16px}.nav .right{gap:8px;font-size:12px}.nav .right .user-tag{padding:4px 9px;font-size:12px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}h1{font-size:20px}h2{font-size:17px}h3{font-size:15px}.card{padding:16px 14px;border-radius:10px}.kpi{grid-template-columns:repeat(2,1fr);gap:8px}.kpi .item{padding:10px 12px}.kpi .item .value{font-size:20px}.kpi .item .label{font-size:9px}.clan-grid{grid-template-columns:1fr;gap:14px}.clan-card{padding:16px}.clan-card-name h3{font-size:16px}.clan-card-stats{gap:8px}.clan-stat{padding:8px}.clan-stat .value{font-size:14px}.clan-stat .label{font-size:9px}.clan-badge,.clan-badge-placeholder{width:52px;height:52px;font-size:24px}.tabs{padding:3px;flex-wrap:wrap}.tabs .tab{padding:7px 9px;font-size:12px;flex:1 1 calc(50% - 4px);min-width:0}.table-scroll{margin:0;overflow:visible;-webkit-overflow-scrolling:auto}.card table,.card table tbody{display:block;width:100%}.card table thead{display:none}.card table tr{display:block;background:#00000038;border:1px solid var(--border);border-radius:10px;padding:10px 12px;margin-bottom:8px}.card table tr:last-child{margin-bottom:0}.card table tr:hover td{background:transparent}.card table td{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 0;border:none;white-space:normal;text-align:right;font-size:13px;min-height:24px}.card table td+td{border-top:1px dashed var(--border);padding-top:7px;margin-top:2px}.card table td:before{content:attr(data-label);flex-shrink:0;color:var(--text-muted);font-weight:600;font-size:10px;letter-spacing:.06em;text-transform:uppercase;text-align:left}.card table td:not([data-label]):before,.card table td[data-label=""]:before{display:none}.card table td:not([data-label]),.card table td[data-label=""]{justify-content:flex-end}.btn{padding:9px 14px;font-size:13px}.btn.small{padding:5px 10px;font-size:11px}.modal-backdrop{padding:10px}input,textarea,select{padding:10px 12px}.center{padding:12px}.center .brand-large{font-size:22px}}@media (max-width: 480px){.kpi{grid-template-columns:1fr 1fr}.clan-card-stats{grid-template-columns:repeat(2,1fr)}.clan-card-stats>:last-child{grid-column:1 / -1}.nav .right .user-tag .user-name{display:none}.clan-card-name h3{white-space:normal}}
