:root{--void:#130909;--void-2:#1b0f0f;--panel:#20130f;--panel-2:#271713;--line:#3d2822;--line-soft:#2a1b16;--crimson:#6e2020;--crimson-bright:#a53434;--gold:#c9a24a;--gold-bright:#e9cc85;--gold-dim:#8c723a;--cream:#f3e9d9;--muted:#b6a191;--muted-2:#84725f;--danger:#c25454;--success:#7fae6b;--radius:22px;--radius-sm:14px}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:radial-gradient(ellipse 900px 520px at 88% -8%,rgba(201,162,74,.12),transparent 60%),radial-gradient(ellipse 760px 640px at 6% 10%,rgba(110,32,32,.2),transparent 55%),radial-gradient(ellipse 700px 500px at 50% 100%,rgba(140,114,58,.08),transparent 60%),var(--void);color:var(--cream);font-family:Tajawal,sans-serif;line-height:1.7;min-height:100vh}body:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;opacity:.05;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}#app{position:relative;z-index:1}a{color:inherit;text-decoration:none}::selection{background:var(--gold);color:#1a0f0a}h1,h2,h3{font-family:El Messiri,Tajawal,sans-serif;font-weight:700;letter-spacing:.2px}.page{max-width:960px;margin:0 auto;padding:32px 20px 60px}.landing{position:relative;min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:20px;gap:24px}.landing .eyebrow{display:inline-flex;align-items:center;gap:9px;background:var(--panel);border:1px solid var(--line);color:var(--gold-bright);padding:9px 20px;border-radius:999px;font-size:.84rem;font-weight:600}.landing h1{font-size:2.4rem;color:var(--cream)}.landing p{color:var(--muted);max-width:440px;line-height:1.9}.error-text{color:var(--danger)}.btn{display:inline-flex;align-items:center;gap:10px;padding:13px 26px;border-radius:999px;background:linear-gradient(180deg,var(--gold-bright),var(--gold));color:#211105;font-weight:700;font-family:inherit;border:none;cursor:pointer;font-size:.95rem;box-shadow:0 6px 18px rgba(201,162,74,.25);transition:transform .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(201,162,74,.35)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}.btn-outline{background:var(--void-2);border:1px solid var(--line);color:var(--cream);box-shadow:none}.btn-outline:hover{background:var(--panel);box-shadow:none}.btn-danger{background:linear-gradient(180deg,#c86868,var(--crimson-bright));color:#2a0f0f;box-shadow:none}.topbar{justify-content:space-between;margin-bottom:28px;padding-bottom:18px;border-bottom:1px solid var(--line-soft)}.topbar,.topbar-user{display:flex;align-items:center}.topbar-user{gap:10px;color:var(--muted);font-size:.9rem}.topbar-user img{width:34px;height:34px;border-radius:50%;border:1px solid var(--line)}h2{font-size:1.3rem;margin:0 0 18px;color:var(--gold-bright)}.guild-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));grid-gap:14px;gap:14px}.guild-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-sm);padding:18px;display:flex;flex-direction:column;gap:12px}.guild-card-head{gap:12px}.guild-card-head,.guild-icon{display:flex;align-items:center}.guild-icon{width:44px;height:44px;border-radius:50%;background:var(--panel-2);border:1px solid var(--line);justify-content:center;font-weight:700;color:var(--gold-bright);flex-shrink:0;overflow:hidden}.guild-icon img{width:100%;height:100%;object-fit:cover}.guild-name{font-weight:700;color:var(--cream);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.badge{font-size:.72rem;padding:4px 12px;border-radius:999px;width:-moz-fit-content;width:fit-content;font-weight:600;border:1px solid transparent}.badge-in{background:rgba(127,174,107,.12);color:var(--success);border-color:rgba(127,174,107,.3)}.badge-out{background:rgba(194,84,84,.12);color:var(--danger);border-color:rgba(194,84,84,.3)}.panel{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:26px;margin-bottom:20px}.field{margin-bottom:18px}.field label{display:block;font-size:.85rem;color:var(--muted);margin-bottom:6px}.field input[type=text],.field select,.field textarea{width:100%;background:var(--void-2);border:1px solid var(--line);border-radius:10px;padding:10px 12px;color:var(--cream);font-family:inherit;font-size:.9rem}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold-dim)}.field textarea{resize:vertical;min-height:80px}.option-row{display:flex;gap:8px;margin-bottom:8px;align-items:center}.option-row input{flex:1 1}.empty-state,.loading{text-align:center;color:var(--muted);padding:60px 20px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:var(--panel);border:1px solid var(--gold-dim);color:var(--gold-bright);padding:12px 20px;border-radius:10px;font-size:.88rem}.lang-switch{display:flex;border:1px solid var(--line);border-radius:999px;padding:3px;background:var(--void-2);gap:2px;flex-shrink:0}.lang-switch button{background:none;border:none;color:var(--muted);cursor:pointer;font-family:JetBrains Mono,monospace;font-size:.74rem;font-weight:600;letter-spacing:.5px;padding:6px 12px;border-radius:999px;transition:background .2s,color .2s}.lang-switch button.active{background:linear-gradient(180deg,var(--gold-bright),var(--gold));color:#211105}.channel-select-wrap{position:relative}.channel-hint{font-size:.78rem;color:var(--muted-2);margin-top:4px}.upload-box{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.upload-preview{width:64px;height:64px;border-radius:10px;border:1px solid var(--line);object-fit:cover;background:var(--void-2)}.upload-actions{display:flex;gap:8px;flex-wrap:wrap}.panel-send-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}@media (max-width:640px){.page{padding:20px 14px 48px}.topbar{flex-wrap:wrap;gap:12px}.guild-grid{grid-template-columns:1fr}.panel{padding:18px;border-radius:var(--radius-sm)}.landing h1{font-size:1.9rem}.btn{padding:12px 20px;font-size:.9rem}.option-row{flex-wrap:wrap}.option-row input{min-width:90px}}@media (max-width:380px){.topbar-user span{display:none}}.scallop{height:20px;width:100%;background-image:radial-gradient(circle at 10px 0,transparent 10px,var(--void) 10.5px);background-size:20px 20px;background-position:top;background-repeat:repeat-x;opacity:.5}