/* Infernum Project: közös stíluslap. Betűk: Bitter és Barlow (SIL OFL), a /static/fonts mappából. */ @font-face{font-family:"Bitter";font-style:normal;font-weight:100 900;font-display:swap;src:url(/static/fonts/bitter-var.woff2) format("woff2")} @font-face{font-family:"Bitter";font-style:italic;font-weight:100 900;font-display:swap;src:url(/static/fonts/bitter-italic-var.woff2) format("woff2")} @font-face{font-family:"Barlow";font-style:normal;font-weight:400;font-display:swap;src:url(/static/fonts/barlow-regular.woff2) format("woff2")} @font-face{font-family:"Barlow";font-style:normal;font-weight:500;font-display:swap;src:url(/static/fonts/barlow-medium.woff2) format("woff2")} @font-face{font-family:"Barlow";font-style:normal;font-weight:600;font-display:swap;src:url(/static/fonts/barlow-semibold.woff2) format("woff2")} :root{ --obsidian:#120F0E;--basalt:#1A1512;--panel:#17110e;--surface:#1c1612;--surface2:#221B16; --bone:#EDE3D6;--ash:#9B8F84;--faint:#6f655c; --ember:#E04B1E;--ember-deep:#8C2408;--brass:#C8A35A; --line:rgba(200,163,90,.22);--line-soft:rgba(255,255,255,.07); --ok:#5FBF7A;--warn:#E9A33C;--err:#D6584A; --serif:"Bitter",Georgia,serif;--sans:"Barlow","Helvetica Neue",Arial,sans-serif; --mono:ui-monospace,Menlo,Consolas,monospace; } *{box-sizing:border-box} html{-webkit-text-size-adjust:100%} body{margin:0;background:var(--obsidian);color:var(--bone);font-family:var(--sans);font-size:17px;line-height:1.6} a{color:var(--brass)} a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,select:focus-visible,label.burger:focus-visible{outline:2px solid var(--brass);outline-offset:2px} h1{font-family:var(--serif);font-weight:800;font-size:28px;line-height:1.2;margin:0 0 6px} h2{font-family:var(--serif);font-weight:600;font-size:19px;margin:0 0 12px} p{margin:0 0 12px} .muted{color:var(--ash);font-size:14px} .nowrap{white-space:nowrap} .code{font-family:var(--mono);font-size:12px} .skip{position:absolute;left:-999px;top:8px;background:var(--brass);color:#1A0E08;padding:8px 14px;z-index:100;font-weight:600} .skip:focus{left:8px} .testbar{background:var(--ember-deep);color:#FBE7C6;text-align:center;padding:7px 12px;font-size:14px;font-weight:600} /* ---- Nyilvános kezdőoldal ---- */ .hero{text-align:center;padding:clamp(64px,14vw,150px) 20px} .wordmark{font-family:var(--serif);font-weight:800;font-size:clamp(48px,13vw,140px);line-height:.95;letter-spacing:.04em;margin:0;background:linear-gradient(178deg,#FBE7C6 8%,#E9B96B 34%,#D8631F 68%,#8C2408 100%);-webkit-background-clip:text;background-clip:text;color:transparent} .orn{display:flex;align-items:center;justify-content:center;gap:14px;margin:26px auto 22px;max-width:420px} .orn i{flex:1;height:1px;background:var(--brass);opacity:.7} .orn b{width:9px;height:9px;transform:rotate(45deg);background:var(--ember)} .motto{font-family:var(--serif);font-style:italic;font-weight:600;font-size:24px;color:var(--brass);margin:0} .ver{margin:6px 0 0;color:var(--ash);font-size:15px} .note{margin:28px auto 12px;max-width:46ch;color:var(--ash);font-size:15px} .homelink{display:inline-block;padding:9px 20px;border:1px solid var(--brass);color:var(--bone);text-decoration:none;font-weight:600;border-radius:2px} .homelink:hover{background:rgba(200,163,90,.12)} /* ---- Belépési és meghívó oldalak ---- */ body.auth{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% -10%,#3a1a10 0%,var(--obsidian) 60%)} .authwrap{flex:1;width:100%;max-width:560px;margin:0 auto;padding:44px 18px 24px} .authbrand{display:block;text-align:center;font-family:var(--serif);font-weight:800;font-size:34px;letter-spacing:.14em;text-decoration:none;margin-bottom:26px;background:linear-gradient(178deg,#FBE7C6 8%,#E9B96B 40%,#D8631F 80%);-webkit-background-clip:text;background-clip:text;color:transparent} .foot{padding:16px;text-align:center;color:var(--ash);font-size:13px} /* ---- Admin keret ---- */ .navtoggle{position:absolute;opacity:0;pointer-events:none} .shell{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh} .side{background:var(--panel);border-right:1px solid var(--line);position:sticky;top:0;height:100vh;overflow-y:auto;display:flex;flex-direction:column;padding:18px 12px 12px} .brand{display:flex;align-items:center;gap:10px;font-family:var(--serif);font-weight:800;font-size:18px;letter-spacing:.16em;color:var(--bone);text-decoration:none;padding:4px 10px 18px} .brand .wm{color:var(--bone);white-space:nowrap} .brand .wm span{color:var(--ember)} .brand .mark{width:20px;height:20px;position:relative;display:block;flex:none} .brand .mark::before{content:"";position:absolute;inset:0;border:2px solid var(--brass);transform:rotate(45deg) scale(.72)} .brand .mark::after{content:"";position:absolute;inset:6px;background:var(--ember);transform:rotate(45deg)} .ngroup{margin-bottom:14px} .ntitle{padding:6px 12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:600} .nitem{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 12px;border-left:2px solid transparent;color:var(--ash);text-decoration:none;font-weight:500;font-size:15.5px;border-radius:0 2px 2px 0} a.nitem:hover{color:var(--bone);background:rgba(200,163,90,.08)} .nitem.on{color:var(--bone);background:rgba(224,75,30,.12);border-left-color:var(--ember)} .nitem.soon{color:var(--faint);cursor:default} .nitem em{font-style:normal;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line-soft);padding:0 6px;border-radius:2px;color:var(--faint)} .locknote{padding:10px 12px;color:var(--warn);font-size:14px} .sidefoot{margin-top:auto;padding:12px 12px 4px;border-top:1px solid var(--line-soft);display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12.5px;color:var(--ash)} .mode{padding:1px 8px;border:1px solid var(--ok);color:var(--ok);border-radius:2px;font-size:11px;letter-spacing:.06em;text-transform:uppercase} .mode.test{border-color:var(--warn);color:var(--warn)} .main{min-width:0;display:flex;flex-direction:column} .topbar{height:58px;display:flex;align-items:center;gap:14px;padding:0 24px;background:var(--panel);border-bottom:1px solid var(--line)} .crumb{display:flex;align-items:center;gap:8px;min-width:0;font-size:15px} .crumb .sep{color:var(--faint)} .crumb strong{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .burger{display:none;width:38px;height:38px;border:1px solid var(--line);border-radius:2px;cursor:pointer;align-items:center;justify-content:center} .burger span,.burger span::before,.burger span::after{display:block;width:18px;height:2px;background:var(--bone);position:relative;content:""} .burger span::before{position:absolute;top:-6px} .burger span::after{position:absolute;top:6px} .scrim{display:none} .usermenu{margin-left:auto;position:relative} .usermenu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;padding:5px 8px;border-radius:2px} .usermenu summary::-webkit-details-marker{display:none} .usermenu summary:hover{background:rgba(200,163,90,.08)} .avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(160deg,#F0A03C,#B72F0C);color:#1A0E08;display:flex;align-items:center;justify-content:center;font-weight:600;font-family:var(--serif)} .uname{font-size:15px;font-weight:500} .usermenu .menu{position:absolute;right:0;top:calc(100% + 6px);min-width:210px;background:var(--surface);border:1px solid var(--line);box-shadow:0 14px 34px rgba(0,0,0,.5);z-index:30;padding:6px} .usermenu .mhead{display:flex;flex-direction:column;padding:8px 10px 10px;border-bottom:1px solid var(--line-soft);margin-bottom:4px} .usermenu .menu a,.menuitem{display:block;width:100%;text-align:left;padding:8px 10px;color:var(--bone);text-decoration:none;background:none;border:0;font:inherit;cursor:pointer;border-radius:2px} .usermenu .menu a:hover,.menuitem:hover{background:rgba(200,163,90,.1)} .content{width:100%;max-width:1100px;padding:28px 28px 56px} .pagehead{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:20px} .pagehead p{margin:0} .actions{display:flex;gap:8px;flex-wrap:wrap} /* ---- Elemek ---- */ .card{background:var(--surface);border:1px solid var(--line-soft);border-top:2px solid var(--ember-deep);padding:20px 22px;margin-bottom:18px} .card.narrow{max-width:460px;margin-left:auto;margin-right:auto} .card>:last-child{margin-bottom:0} .card.alert,.alert{border-top-color:var(--brass);background:rgba(200,163,90,.07)} p.alert{padding:10px 14px;border-left:2px solid var(--brass);border-top:0} .big{font-family:var(--serif);font-size:24px;font-weight:800;margin:0} .hint{color:var(--ash);font-size:14px} .warn{color:var(--warn);font-weight:600} .msg{padding:12px 16px;margin-bottom:18px;border-left:3px solid} .msg.ok{background:rgba(95,191,122,.1);border-color:var(--ok)} .msg.err{background:rgba(214,88,74,.12);border-color:var(--err)} .badge{display:inline-block;padding:1px 10px;border-radius:2px;font-size:12px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;border:1px solid} .badge.ok{color:var(--ok);border-color:var(--ok)} .badge.warn{color:var(--warn);border-color:var(--warn)} .stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:18px} .stat{display:flex;flex-direction:column;gap:2px;background:var(--surface);border:1px solid var(--line-soft);border-top:2px solid var(--line);padding:16px 18px;color:var(--bone);text-decoration:none} a.stat:hover{border-top-color:var(--ember)} .stat .num{font-family:var(--serif);font-size:36px;font-weight:800;line-height:1.1;color:var(--brass)} .stat .num small{font-size:18px;color:var(--ash);font-weight:600} .stat .lbl{font-size:14px;color:var(--ash)} .stat.hot{border-top-color:var(--ember)} .stat.hot .num{color:var(--ember)} .stat.warnstat .num{color:var(--warn)} .cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px;align-items:start} .cols .card{margin:0} .todo ul{list-style:none;margin:0;padding:0} .todo li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid var(--line-soft)} .todo li:last-child{border-bottom:0} .feed{list-style:none;margin:0 0 10px;padding:0} .feed li{display:grid;grid-template-columns:118px minmax(0,1fr);gap:2px 12px;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:15px} .feed .when{color:var(--faint);font-size:13px;font-family:var(--mono)} .feed .who{grid-column:2;font-size:13px} .kv{display:grid;grid-template-columns:auto 1fr;gap:8px 18px;margin:0;font-size:15px} .kv dt{color:var(--ash)} .kv dd{margin:0} label{display:block;margin:0 0 14px;color:var(--ash);font-size:14px;font-weight:500} fieldset{border:0;padding:0;margin:0 0 14px} legend{color:var(--ash);font-size:14px;font-weight:500;margin-bottom:6px;padding:0} input,select{width:100%;margin-top:6px;padding:10px 12px;background:var(--obsidian);color:var(--bone);border:1px solid rgba(255,255,255,.14);border-radius:2px;font:inherit} input[type=checkbox]{width:auto;margin:0} /* Minden szövegmező ugyanazt az oldal-stílust kapja (a külön szabályok csak finomítanak); a magasságot a /static/autosize.js a tartalomhoz igazítja, húzni nem kell. */ textarea{display:block;width:100%;margin-top:6px;padding:10px 12px;background:var(--obsidian);color:var(--bone);border:1px solid rgba(255,255,255,.14);border-radius:2px;font:inherit;line-height:1.5;resize:none;overflow-y:auto} textarea:focus-visible{outline:2px solid var(--brass);outline-offset:2px} textarea[readonly]{opacity:.9} textarea:disabled{opacity:.75} .two{display:grid;grid-template-columns:1fr 1fr;gap:10px} .two input{margin-top:0} .btn{display:inline-block;padding:10px 20px;border:0;border-radius:2px;background:linear-gradient(160deg,#F0A03C,#E04B1E 58%,#B72F0C);color:#1A0E08;font:inherit;font-weight:600;cursor:pointer;text-decoration:none} .btn:hover{filter:brightness(1.08)} .btn.ghost{background:transparent;color:var(--bone);border:1px solid var(--brass)} .btn.ghost:hover{background:rgba(200,163,90,.12)} .btn.danger{background:var(--ember-deep);color:#FBE7C6} .btn.small{padding:6px 12px;font-size:14px} .linkbtn{background:none;border:0;color:var(--brass);font:inherit;cursor:pointer;padding:0;text-decoration:underline} form.inline,div.inline{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin:6px 0} form.inline input,form.inline select{width:auto;margin-top:0;flex:1;min-width:140px} table{width:100%;border-collapse:collapse;font-size:15px} th{text-align:left;color:var(--ash);font-weight:500;font-size:12.5px;letter-spacing:.07em;text-transform:uppercase;padding:8px 10px;border-bottom:1px solid var(--line)} td{padding:10px;border-bottom:1px solid var(--line-soft);vertical-align:top} tbody tr:hover td{background:rgba(255,255,255,.02)} td.actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center} td.actions form{margin:0} .scroll{overflow-x:auto} .matrix td.c{text-align:center} .matrix tr.area td{background:rgba(200,163,90,.08);color:var(--brass);font-weight:600;font-size:12.5px;letter-spacing:.07em;text-transform:uppercase} .member header.mhead{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:8px} .chips{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:8px} .chip{display:inline-flex;align-items:center;gap:6px;margin:0;padding:3px 10px;border:1px solid rgba(200,163,90,.35);border-radius:2px;font-size:13px;color:var(--bone)} .chip.role{border-color:var(--ember);color:#FBE7C6} .chip .x{background:none;border:0;color:var(--ash);font-size:16px;line-height:1;cursor:pointer;padding:0} .chip .x:hover{color:var(--err)} details summary{cursor:pointer;color:var(--brass);font-size:14px} .manage{padding-top:10px;display:flex;flex-direction:column;gap:6px} .linkbox{font-family:var(--mono);font-size:14px;word-break:break-all;background:var(--obsidian);border:1px dashed var(--brass);padding:10px 12px;user-select:all} code{font-family:var(--mono);background:var(--obsidian);padding:2px 6px;border:1px solid rgba(255,255,255,.1)} .qr{background:#fff;display:inline-block;padding:6px;margin:8px 0} .qr svg{display:block;max-width:100%;height:auto} ul.codes{list-style:none;padding:0;margin:14px 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px} ul.codes li{font-family:var(--mono);font-size:17px;background:var(--obsidian);border:1px solid rgba(200,163,90,.3);padding:8px 12px;text-align:center;letter-spacing:.06em} /* ---- Telefon és kis képernyő ---- */ @media (max-width:900px){ .shell{grid-template-columns:minmax(0,1fr)} .side{position:fixed;left:0;top:0;bottom:0;width:272px;z-index:50;transform:translateX(-102%);transition:transform .2s ease;box-shadow:0 0 40px rgba(0,0,0,.6)} .navtoggle:checked ~ .shell .side{transform:none} .navtoggle:checked ~ .shell .scrim{display:block;position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:40} .burger{display:flex} .topbar{padding:0 14px} .uname{display:none} .content{padding:20px 14px 48px} .cols{grid-template-columns:minmax(0,1fr)} .feed li{grid-template-columns:minmax(0,1fr)} .feed .who{grid-column:1} } @media (max-width:640px){.two{grid-template-columns:1fr}} @media (prefers-reduced-motion:reduce){.side{transition:none}} /* ---- Nyilvános oldal ---- */ body.site{min-height:100vh;display:flex;flex-direction:column} .sitebar{display:flex;align-items:center;gap:20px;padding:12px 28px;background:var(--panel);border-bottom:1px solid var(--line);position:relative;flex-wrap:wrap} .sbrand{text-decoration:none;font-family:var(--serif);font-weight:800;font-size:19px;letter-spacing:.16em;color:var(--bone)} .sbrand .wm span{color:var(--ember)} .snav{display:flex;align-items:center;gap:4px;margin-left:auto;flex-wrap:wrap} .snav a{color:var(--ash);text-decoration:none;padding:7px 12px;font-weight:500;font-size:15.5px;border-bottom:1px solid transparent} .snav a:hover{color:var(--bone)} .snav a.on{color:var(--bone);border-bottom-color:var(--brass)} .snav a.slogin{border:1px solid var(--brass);color:var(--bone);border-radius:2px;margin-left:8px} .snav a.slogin:hover{background:rgba(200,163,90,.12)} .sburger{display:none;margin-left:auto} .sitemain{flex:1} .sitefoot{padding:22px;text-align:center;color:var(--ash);font-size:13.5px;border-top:1px solid var(--line)} .blk .in{max-width:1040px;margin:0 auto;padding:0 28px} .blk-heading{padding:56px 0 8px} .blk-heading .kick,.kick{font-family:var(--serif);font-style:italic;color:var(--ember);margin:0 0 8px} .blk-heading h1,.blk-heading h2,.blk-heading h3{font-family:var(--serif);font-weight:800;margin:0;line-height:1.2} .blk-heading h1{font-size:clamp(32px,6vw,52px)} .blk-heading h2{font-size:clamp(26px,4.5vw,38px)} .blk-heading h3{font-size:22px} .blk-heading .sub{margin:12px 0 0;color:var(--ash);max-width:62ch;font-size:18px} .blk-text{padding:18px 0} /* A hős blokknak nincs saját háttere: a fényt a sáv (.sect-hero::before) adja, így nincs kemény él a felirat fölött. */ .blk-hero{padding:clamp(56px,10vw,110px) 0 clamp(40px,7vw,80px);text-align:center} .blk-hero .lead{max-width:62ch;margin:20px auto 0;color:#CFC3B6;font-size:18px} .blk-hero .btnrow{justify-content:center;margin-top:28px} .blk-hero .orn-sub{margin:24px auto 16px} .blk-hero .kick-below{margin:0;font-size:clamp(15px,1.8vw,19px);letter-spacing:.03em} .blk-hero .wordmark{font-size:clamp(44px,12vw,120px)} .blk-buttons{padding:18px 0} .btnrow{display:flex;gap:10px;flex-wrap:wrap} .btnrow.center{justify-content:center} .blk-divider{padding:30px 0} .prose{font-size:17.5px} .prose p{margin:0 0 14px} .prose ul{margin:0 0 14px;padding-left:22px} .prose li{margin:4px 0} .prose a{color:var(--brass)} .blk-cards{padding:24px 0} .cardgrid{display:grid;gap:18px} .cardgrid.cols2{grid-template-columns:repeat(2,minmax(0,1fr))} .cardgrid.cols3{grid-template-columns:repeat(3,minmax(0,1fr))} .cardgrid.cols4{grid-template-columns:repeat(4,minmax(0,1fr))} .pcard{background:var(--surface2);border:1px solid var(--line-soft);border-top:2px solid var(--ember-deep);padding:22px 22px 20px;display:flex;flex-direction:column;gap:8px} .pcard h3{font-family:var(--serif);font-weight:800;font-size:21px;margin:0} .pcard .prose{color:var(--ash);font-size:16px} .pcard .prose p:last-child{margin-bottom:0} .pcard .more{margin-top:auto;font-weight:600;color:var(--brass);text-decoration:none} .pcard .more:hover{text-decoration:underline} .blk-timeline{padding:24px 0} .tline{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));border-left:1px solid var(--line)} .tl-item{padding:22px;border-right:1px solid var(--line);position:relative} .tl-item::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--ember)} .tl-meta{display:block;font-family:var(--serif);font-weight:800;font-size:20px;color:var(--brass);margin-bottom:4px} .tl-item h3{font-family:var(--serif);font-size:18px;margin:0 0 6px} .tl-item .prose{color:var(--ash);font-size:15.5px} .blk-table{padding:24px 0} .tscroll{overflow-x:auto} .ptable{width:100%;border-collapse:collapse;font-size:16px} .ptable th{font-family:var(--serif);color:var(--brass);text-transform:none;letter-spacing:0;font-size:15px;font-weight:800;padding:10px 14px;border-bottom:1px solid var(--line)} .ptable td{padding:10px 14px;border-bottom:1px solid var(--line-soft)} /* ---- Oldalszerkesztő ---- */ .content.wide{max-width:none} /* A szerkesztő két oszlopa. A tartalom-keret széles (.content.wide), az előnézet a szabad hely nagy részét kapja: nagy képernyőn legfeljebb 1240 képpont (a korábbi ~600 duplája), jobbra szabad hely marad; kisebb képernyőn az összes szabad helyet kitölti; ha már nem fér el egymás mellett, az előnézet alá kerül. */ .editor{display:grid;grid-template-columns:minmax(380px,440px) minmax(0,1240px);justify-content:start;gap:20px;align-items:start} @media (max-width:1700px){.editor{grid-template-columns:minmax(340px,400px) minmax(0,1fr)}} .ed-left{display:flex;flex-direction:column;gap:12px} .edbar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;position:sticky;top:0;z-index:5;background:var(--obsidian);padding:6px 0} .edbar form.inline{margin:0;flex:1;justify-content:flex-end;flex-wrap:nowrap} .edbar form.inline input{min-width:100px} .ok{color:var(--ok)} .err{color:var(--err)} .bcard{background:var(--surface);border:1px solid var(--line-soft);border-left:3px solid var(--ember-deep)} .bhead{display:flex;align-items:center;gap:10px;padding:8px 10px;background:var(--surface2)} .bhead strong{flex:1;font-size:15px} .handle{cursor:grab;color:var(--faint);letter-spacing:-3px;font-size:18px;user-select:none;padding:0 4px} .btools{display:flex;gap:4px} .ibtn{background:transparent;border:1px solid var(--line-soft);color:var(--ash);width:30px;height:30px;border-radius:2px;cursor:pointer;font:inherit;font-size:14px;line-height:1} .ibtn:hover{color:var(--bone);border-color:var(--brass)} .ibtn.danger:hover{color:var(--err);border-color:var(--err)} .bbody{padding:12px 12px 4px} .bcard.collapsed .bbody{display:none} .fld{display:block;margin:0 0 12px} .fld>span{display:block;color:var(--ash);font-size:13.5px;font-weight:500} .fld input,.fld select,.fld textarea{width:100%;margin-top:4px;padding:8px 10px;background:var(--obsidian);color:var(--bone);border:1px solid rgba(255,255,255,.14);border-radius:2px;font:inherit;font-size:15px} .fld textarea{resize:none;min-height:70px} .fld textarea.mono{font-family:var(--mono);font-size:13.5px} .help{display:block;color:var(--faint);font-size:12.5px;margin-top:4px} .itemsbox{margin:0 0 12px;border:1px dashed var(--line);padding:10px} .itemshead{font-size:13.5px;color:var(--brass);font-weight:600;margin-bottom:8px} .item{border:1px solid var(--line-soft);padding:8px 10px 0;margin-bottom:8px;background:rgba(255,255,255,.015)} .itembar{display:flex;align-items:center;gap:4px;margin-bottom:6px} .itembar .muted{flex:1} .palette{border-top:1px solid var(--line-soft);padding-top:12px} .pal{display:flex;flex-wrap:wrap;gap:8px} .ed-right{position:sticky;top:12px;max-height:calc(100vh - 24px);display:flex;flex-direction:column;min-width:0} .previewbar{display:flex;align-items:center;gap:12px;padding:8px 12px;background:var(--panel);border:1px solid var(--line);border-bottom:0;font-size:14px;font-weight:600} .previewbar #pstatus{flex:1} .preview{border:1px solid var(--line);background:var(--obsidian);overflow:auto;min-height:300px;flex:1} .preview .blk .in{padding:0 20px} .preview .blk-heading{padding-top:32px} .preview .blk-hero{padding-top:44px} .sortable-ghost{opacity:.4} .check{display:flex;align-items:center;gap:10px;color:var(--bone)} .check input{width:auto;margin:0} @media (max-width:1200px){ .editor{grid-template-columns:minmax(0,1fr)} .ed-right{position:static;max-height:none} } @media (max-width:900px){ .sitebar{padding:12px 16px} .sburger{display:flex} .snav{display:none;width:100%;flex-direction:column;align-items:stretch;margin-left:0;gap:0;padding-top:8px} .snav a{padding:12px 4px;border-bottom:1px solid var(--line-soft)} .snav a.slogin{margin:8px 0 0;text-align:center} #snavtoggle:checked ~ .snav{display:flex} .cardgrid.cols3,.cardgrid.cols4{grid-template-columns:repeat(2,minmax(0,1fr))} } @media (max-width:640px){ .cardgrid.cols2,.cardgrid.cols3,.cardgrid.cols4{grid-template-columns:minmax(0,1fr)} .blk .in{padding:0 16px} } /* ---- Új blokkok és média ---- */ [hidden]{display:none !important} .blk-image{padding:24px 0} .pimg{margin:0} .pimg img{display:block;width:100%;height:auto;border:1px solid var(--line-soft)} .pimg.small{max-width:520px;margin:0 auto} .pimg figcaption{margin-top:8px;color:var(--ash);font-size:14.5px;text-align:center} .pcard-img{display:block;width:calc(100% + 44px);max-width:none;margin:-22px -22px 10px;height:auto;border-bottom:1px solid var(--line-soft)} .blk-raid{padding:24px 0} .raidcard{background:var(--surface2);border:1px solid var(--line-soft);border-top:2px solid var(--ember-deep);padding:26px 24px 22px} .raidcard h3{font-family:var(--serif);font-weight:800;font-size:23px;margin:0 0 6px} .raidcard .rsz{font-size:14px;color:var(--brass);margin:0} .barprog{height:6px;background:rgba(255,255,255,.07);margin:20px 0 10px} .barprog i{display:block;height:100%;background:linear-gradient(90deg,#F0A03C,#E04B1E)} .rstat{display:flex;justify-content:space-between;font-size:14.5px;color:var(--ash);margin:0} .rstat b{color:var(--bone);font-family:var(--serif)} .raidcard .locked{font-size:14.5px;color:var(--ash);margin:16px 0 0;padding-top:14px;border-top:1px solid var(--line-soft)} .blk-cd{padding:36px 0;text-align:center} .cdlabel{font-family:var(--serif);font-style:italic;color:var(--brass);font-size:20px;margin:0 0 12px} .cd{display:flex;justify-content:center;gap:clamp(14px,4vw,40px);padding:20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(255,255,255,.015)} .cdcell{text-align:center;min-width:56px} .cdcell b{display:block;font-family:var(--serif);font-size:clamp(34px,7vw,56px);font-weight:800;line-height:1;color:var(--bone)} .cdcell small{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ash)} .cd.done .cdcell b{color:var(--ash)} .cddone{margin:14px 0 0;font-family:var(--serif);font-size:22px;color:var(--ember);font-weight:800} .blk-faq{padding:18px 0} .qa{border:1px solid var(--line-soft);border-left:3px solid var(--ember-deep);background:var(--surface);margin-bottom:8px} .qa summary{cursor:pointer;padding:14px 18px;font-weight:600;font-size:17px;color:var(--bone);list-style:none;display:flex;justify-content:space-between;gap:12px} .qa summary::-webkit-details-marker{display:none} .qa summary::after{content:"+";color:var(--brass);font-size:22px;line-height:1} .qa[open] summary::after{content:"–"} .qa .prose{padding:0 18px 12px;color:#CFC3B6;font-size:16.5px} .imgrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px} .imgthumb{width:64px;height:64px;object-fit:cover;border:1px solid var(--line)} .pickerov{position:fixed;inset:0;background:rgba(0,0,0,.65);z-index:80;display:flex;align-items:center;justify-content:center;padding:16px} .pickerbox{background:var(--surface);border:1px solid var(--line);width:min(760px,100%);max-height:90vh;overflow:auto;padding:16px 18px} .pickerhead{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px} .mgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:14px} .mgrid.picker{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:10px} .pickitem{padding:0;border:1px solid var(--line-soft);background:var(--obsidian);cursor:pointer;aspect-ratio:1;overflow:hidden} .pickitem:hover{border-color:var(--brass)} .pickitem img{width:100%;height:100%;object-fit:cover;display:block} .mitem{margin:0;background:var(--surface2);border:1px solid var(--line-soft)} .mitem img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover} .mitem figcaption{display:flex;flex-direction:column;gap:2px;padding:10px 12px;font-size:14px} .mname{font-weight:600;word-break:break-all} @media (max-width:640px){.cd{gap:12px;padding:16px 8px}.cdcell{min-width:44px}} /* ---- Nyilvános fejléc gomb és lábléc ---- */ .snav .scta{margin-left:8px;color:#1A0E08} .snav a.btn.small{padding:7px 14px;border-bottom:0} .sitefoot{border-top:1px solid var(--line);padding:40px 0;background:var(--basalt);text-align:center} .sitefoot .in{max-width:1120px;margin:0 auto;padding:0 24px} .flegal{width:100%;margin:0 auto 18px;max-width:112ch;color:var(--ash);font-size:13.5px;line-height:1.7;opacity:.85;text-align:center} .fcopy{margin:0 0 20px;color:var(--ash);font-size:14.5px;text-align:center} .flinks{display:flex;justify-content:center;align-items:center;gap:12px 30px;flex-wrap:wrap} .flinks a{color:var(--ash);font-size:16px;text-decoration:none;padding:4px 2px} .flinks a:hover{color:var(--bone)} @media (max-width:900px){.snav .scta{margin:8px 0 0;text-align:center}} /* ===================================================================== A nyilvános oldal megjelenése: a WordPress téma szakaszai, váltakozó háttérrel ===================================================================== */ .sect{position:relative;padding:clamp(56px,8vw,96px) 0;counter-reset:rule;overflow-x:clip} .sect-alt{background:var(--basalt);border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft)} .sect .blk{padding:0} .sect .blk + .blk{margin-top:32px} .sect .blk-heading + .blk{margin-top:36px} .sect .blk + .blk-heading{margin-top:56px} .sect .blk-heading h2{font-size:clamp(28px,4.4vw,42px)} .sect .blk-heading .sub{margin:14px 0 0;color:var(--ash);font-size:17.5px;max-width:62ch} /* oldalfejléc */ .sect-head{padding:clamp(54px,8vw,86px) 0 clamp(34px,5vw,50px);overflow:hidden;border-bottom:1px solid var(--line)} .sect-head::before{content:"";position:absolute;inset:-60% -20% auto -20%;height:200%;pointer-events:none; background:radial-gradient(48% 40% at 22% 24%,rgba(224,75,30,.22),transparent 66%),radial-gradient(40% 34% at 82% 10%,rgba(200,163,90,.10),transparent 70%)} .sect-head .blk{position:relative;z-index:2} .sect-head .blk-heading h1{font-size:clamp(36px,6.2vw,66px)} .sect-head .blk-heading .sub{color:#CFC3B6} /* főoldali hős rész */ .sect-hero{padding:clamp(64px,11vw,124px) 0 0;overflow:hidden} .sect-hero::before{content:"";position:absolute;inset:-30% -10% auto -10%;height:120%;pointer-events:none;filter:blur(6px);animation:breathe 11s ease-in-out infinite; background:radial-gradient(58% 42% at 50% 8%,rgba(224,75,30,.30),transparent 62%),radial-gradient(40% 30% at 18% 42%,rgba(140,36,8,.28),transparent 70%),radial-gradient(46% 34% at 84% 30%,rgba(200,163,90,.12),transparent 70%)} .sect-hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(0,0,0,.18) 0 1px,transparent 1px 3px);opacity:.35;mix-blend-mode:multiply} @keyframes breathe{0%,100%{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.05)}} @media (prefers-reduced-motion:reduce){.sect-hero::before{animation:none}} .sect-hero .blk{position:relative;z-index:2} .sect-hero .blk-hero{padding-bottom:clamp(40px,7vw,72px)} .sect-hero .blk-cd{margin-top:0} .sect-hero .wordmark{font-size:clamp(62px,15.5vw,186px);line-height:.9;filter:drop-shadow(0 6px 30px rgba(224,75,30,.35))} .blk-hero .motto{font-size:clamp(19px,2.6vw,27px);margin:0} .blk-hero .btnrow,.blk-cta .btnrow{margin-top:30px} /* visszaszámláló sáv */ .blk-cd{padding:0;text-align:center} .cdband{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(180deg,rgba(34,27,22,.7),rgba(18,15,14,.7))} .cdband .in{position:relative} .cdrot{display:grid} /* A váltakozó események egymásra rétegződnek ugyanazon a helyen, így a sáv magassága nem ugrál váltáskor. */ .cdslide{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .6s ease,visibility .6s ease} .cdslide.active{opacity:1;visibility:visible} @media (prefers-reduced-motion:reduce){.cdslide{transition:none}} /* A függőleges térköz itt a lényeg: a számok ne érjenek a sáv széléhez. */ .cdin{display:flex;align-items:center;justify-content:center;gap:clamp(18px,5vw,54px);flex-wrap:wrap;padding:clamp(36px,5vw,50px) 0 clamp(30px,4vw,40px)} .cdlabel{text-align:left;max-width:260px;font-style:normal;margin:0} .cdlabel strong{display:block;font-family:var(--serif);font-size:18px;font-weight:800;font-style:normal;color:var(--bone)} .cdlabel span{font-size:14.5px;color:var(--ash);font-style:italic} .cd{display:flex;gap:clamp(14px,3vw,30px);padding:0;border:0;background:none} .cdcell{min-width:58px} .cdcell b{font-size:clamp(30px,5vw,46px);font-variant-numeric:tabular-nums} .cdcell small{display:block;margin-top:8px;font-size:12.5px;letter-spacing:.06em;text-transform:none;color:var(--ash)} .blk-cd .cddone{padding:34px 24px;margin:0} .cddots{display:flex;justify-content:center;gap:8px;padding:0 0 16px} .cddots button{width:9px;height:9px;padding:0;border:1px solid var(--brass);background:transparent;border-radius:50%;cursor:pointer} .cddots button.on{background:var(--brass)} @media (max-width:900px){.cdin{flex-direction:column;gap:22px}.cdlabel{text-align:center;max-width:none}} /* két oszlop: szöveg és lista ("honnan jövünk") */ .about{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(32px,6vw,72px);align-items:start} .about-main h2{font-family:var(--serif);font-weight:800;font-size:clamp(28px,4.4vw,42px);line-height:1.2;margin:0 0 24px} .about-body{font-size:17.5px;color:#DCD1C4} .about-body p:first-of-type::first-letter{float:left;font-family:var(--serif);font-weight:800;font-size:66px;line-height:.82;padding:6px 12px 0 0;color:var(--ember)} .about-side .kick{margin:0 0 14px} .creds{border-left:2px solid var(--ember);padding:4px 0 4px 22px;margin:0;list-style:none} .creds li{list-style:none;margin:0 0 18px;padding:0} .creds strong{display:block;font-family:var(--serif);font-size:17px;font-weight:800} .creds span{font-size:15px;color:var(--ash)} @media (max-width:900px){.about{grid-template-columns:minmax(0,1fr)}} /* panelek */ .panelgrid{display:grid;gap:clamp(22px,4vw,44px)} .panelgrid.cols2{grid-template-columns:repeat(2,minmax(0,1fr))} .panelgrid.cols3{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px} .panel{background:var(--surface2);border:1px solid var(--line-soft);padding:32px 30px} .panel h3{font-family:var(--serif);font-weight:800;font-size:24px;margin:0 0 12px} .panel .prose{color:#CFC3B6;font-size:16.5px} .panel .prose p:last-child{margin-bottom:0} .panel .prose ul{list-style:none;padding:0;margin:16px 0 0} .panel .prose li{display:flex;gap:12px;margin:0;padding:10px 0;border-bottom:1px solid var(--line-soft);font-size:16px;color:#DCD1C4} .panel .prose li:last-child{border-bottom:0} .panel .prose li::before{content:"";flex:0 0 7px;height:7px;margin-top:9px;transform:rotate(45deg);background:var(--brass)} @media (max-width:900px){.panelgrid.cols2,.panelgrid.cols3{grid-template-columns:minmax(0,1fr)}} /* felhívás */ .blk-cta{position:relative;text-align:center} .blk-cta::before{content:"";position:absolute;left:50%;bottom:-96px;width:min(1200px,160%);height:340px;transform:translateX(-50%);pointer-events:none; background:radial-gradient(50% 50% at 50% 100%,rgba(224,75,30,.28),transparent 68%)} .blk-cta .in{position:relative;z-index:2} .blk-cta h2{font-family:var(--serif);font-weight:800;font-size:clamp(32px,5.4vw,54px);line-height:1.15;margin:0} .blk-cta .prose{max-width:58ch;margin:20px auto 0;color:#CFC3B6} /* megjegyzés */ .note{padding:14px 16px;border-left:2px solid var(--ember);background:rgba(224,75,30,.07);font-size:15.5px;color:#E3D7C9} .note.brass{border-left-color:var(--brass);background:rgba(200,163,90,.08)} .note p{margin:0 0 8px;font-size:15.5px} .note p:last-child{margin-bottom:0} /* idővonal: a megtörtént elemek kiemelve */ .tl-item::before{background:rgba(200,163,90,.2)} .tl-item.done::before{background:linear-gradient(90deg,var(--ember),var(--brass))} .tl-meta{color:var(--bone)} .tl-item.done .tl-meta{color:var(--brass)} /* számozott címsor és listaváltozatok (szabályzat, raid este) */ /* A számozott címsorok vonala a szöveg oszlopával egyenlő széles (az eredeti .ruleblock), nem a teljes sávon fut végig. */ .sect .blk-heading.numbered .in::before{content:"";display:block;height:1px;background:var(--line);margin-bottom:30px} .sect .blk + .blk-heading.numbered{margin-top:30px} .sect > .blk-heading.numbered:first-child .in::before{display:none} .sect .blk-heading.numbered + .blk{margin-top:12px} .blk-heading.numbered h2{display:flex;align-items:baseline;gap:16px;font-size:clamp(24px,3.4vw,32px)} .blk-heading.numbered h2::before{counter-increment:rule;content:counter(rule,decimal-leading-zero);font-size:15px;color:var(--ember);font-family:var(--sans);font-weight:600;letter-spacing:.06em} .prose.dash ul{list-style:none;margin:0;padding:0 0 0 4px} .prose.dash li{position:relative;margin:0;padding:8px 0 8px 22px;color:#DCD1C4;font-size:16.5px} .prose.dash li::before{content:"";position:absolute;left:0;top:19px;width:8px;height:1px;background:var(--brass)} .prose.schedule ul{list-style:none;margin:0;padding:0;border-left:2px solid var(--line)} .prose.schedule li{position:relative;margin:0;padding:14px 0 14px 28px;color:#DCD1C4;font-size:16.5px} .prose.schedule li::before{content:"";position:absolute;left:-5px;top:22px;width:8px;height:8px;transform:rotate(45deg);background:var(--brass)} .prose.schedule li strong{display:inline-block;min-width:74px;color:var(--ember);font-family:var(--serif);font-weight:800;font-size:17px} /* táblázat a témához igazítva */ .tscroll{border:1px solid var(--line-soft);background:var(--surface2)} .ptable th,.ptable td{padding:13px 18px;text-align:left} /* szerkesztő: jelölőnégyzetes mező */ .checkfld{display:flex;align-items:center;gap:10px} .checkfld input{width:auto;margin:0} .checkfld span{color:var(--bone)} /* ---- Haladás-csík szélességek ---- */ .pw-0{width:0%}.pw-1{width:1%}.pw-2{width:2%}.pw-3{width:3%}.pw-4{width:4%}.pw-5{width:5%}.pw-6{width:6%}.pw-7{width:7%}.pw-8{width:8%}.pw-9{width:9%} .pw-10{width:10%}.pw-11{width:11%}.pw-12{width:12%}.pw-13{width:13%}.pw-14{width:14%}.pw-15{width:15%}.pw-16{width:16%}.pw-17{width:17%}.pw-18{width:18%}.pw-19{width:19%} .pw-20{width:20%}.pw-21{width:21%}.pw-22{width:22%}.pw-23{width:23%}.pw-24{width:24%}.pw-25{width:25%}.pw-26{width:26%}.pw-27{width:27%}.pw-28{width:28%}.pw-29{width:29%} .pw-30{width:30%}.pw-31{width:31%}.pw-32{width:32%}.pw-33{width:33%}.pw-34{width:34%}.pw-35{width:35%}.pw-36{width:36%}.pw-37{width:37%}.pw-38{width:38%}.pw-39{width:39%} .pw-40{width:40%}.pw-41{width:41%}.pw-42{width:42%}.pw-43{width:43%}.pw-44{width:44%}.pw-45{width:45%}.pw-46{width:46%}.pw-47{width:47%}.pw-48{width:48%}.pw-49{width:49%} .pw-50{width:50%}.pw-51{width:51%}.pw-52{width:52%}.pw-53{width:53%}.pw-54{width:54%}.pw-55{width:55%}.pw-56{width:56%}.pw-57{width:57%}.pw-58{width:58%}.pw-59{width:59%} .pw-60{width:60%}.pw-61{width:61%}.pw-62{width:62%}.pw-63{width:63%}.pw-64{width:64%}.pw-65{width:65%}.pw-66{width:66%}.pw-67{width:67%}.pw-68{width:68%}.pw-69{width:69%} .pw-70{width:70%}.pw-71{width:71%}.pw-72{width:72%}.pw-73{width:73%}.pw-74{width:74%}.pw-75{width:75%}.pw-76{width:76%}.pw-77{width:77%}.pw-78{width:78%}.pw-79{width:79%} .pw-80{width:80%}.pw-81{width:81%}.pw-82{width:82%}.pw-83{width:83%}.pw-84{width:84%}.pw-85{width:85%}.pw-86{width:86%}.pw-87{width:87%}.pw-88{width:88%}.pw-89{width:89%} .pw-90{width:90%}.pw-91{width:91%}.pw-92{width:92%}.pw-93{width:93%}.pw-94{width:94%}.pw-95{width:95%}.pw-96{width:96%}.pw-97{width:97%}.pw-98{width:98%}.pw-99{width:99%} .pw-100{width:100%} @media (max-width:700px){.flinks{gap:10px 20px}.flegal{font-size:12.5px}} .panel .note{margin-top:20px} /* ---- Class színek (Blizzard) és toborzási állapotok ---- */ .cls-warrior{--cc:#C69B6D}.cls-paladin{--cc:#F48CBA}.cls-hunter{--cc:#AAD372}.cls-rogue{--cc:#FFF468} .cls-priest{--cc:#FFFFFF}.cls-shaman{--cc:#0070DD}.cls-mage{--cc:#3FC7EB}.cls-warlock{--cc:#8788EE}.cls-druid{--cc:#FF7C0A} .stpill{display:inline-block;padding:3px 12px;border-radius:2px;font-size:13px;font-weight:600;letter-spacing:.04em;line-height:1.5;white-space:nowrap} .st-green{background:#2E8B57;color:#fff}.st-red{background:#B3362D;color:#fff}.st-orange{background:#E3822B;color:#1A0E08} .st-blue{background:#3A6FB8;color:#fff}.st-purple{background:#7A55B0;color:#fff}.st-grey{background:#5d554e;color:#fff}.st-brass{background:#C8A35A;color:#1A0E08} .blk-recruit{padding:24px 0} .rectable .recrow td:first-child{border-left:3px solid var(--cc,var(--line))} .rectable .rc-class{font-family:var(--serif);font-weight:800;font-size:17px;color:var(--cc,var(--bone))} .rectable .rc-note{color:var(--ash);font-size:15px} .rectable td{vertical-align:middle} .strows td{padding:8px 10px;vertical-align:middle} .strows input[type=text],.strows input:not([type]),.strows select{margin-top:0} .strows .newrow td{border-bottom-style:dashed} /* ---- Toborzási sorok a szerkesztőben ---- */ .recrows{display:flex;flex-direction:column;gap:8px;margin-bottom:8px} .recitem{display:grid;grid-template-columns:1fr 1fr;gap:6px;border:1px solid var(--line-soft);padding:8px 10px 10px;background:rgba(255,255,255,.015)} .recitem .recbar{grid-column:1 / -1;margin-bottom:0} .recitem input,.recitem select{margin-top:0;width:100%;padding:7px 9px;font-size:14.5px} .recitem select.clsel{font-weight:700;color:var(--cc,var(--bone))} .recitem select.stsel{font-weight:600} .recitem select.stsel.st-green,.recitem select.stsel.st-red,.recitem select.stsel.st-orange,.recitem select.stsel.st-blue,.recitem select.stsel.st-purple,.recitem select.stsel.st-grey,.recitem select.stsel.st-brass{border-color:transparent} .recactions{display:flex;gap:8px;flex-wrap:wrap} select option{background:#1c1612;color:var(--bone)} select option.cls-warrior{color:#C69B6D}select option.cls-paladin{color:#F48CBA}select option.cls-hunter{color:#AAD372} select option.cls-rogue{color:#FFF468}select option.cls-priest{color:#FFFFFF}select option.cls-shaman{color:#3fa0ff} select option.cls-mage{color:#3FC7EB}select option.cls-warlock{color:#8788EE}select option.cls-druid{color:#FF7C0A} /* ---- Keskeny oszlop (szabályzat): az eredeti .narrow, 820 képpont ---- */ .sect.narrow .blk .in{max-width:820px} /* ---- Hős felirat: soha ne lógjon ki a keretéből ---- A felirat az "INFERNUM" Bitter 800-as betűvel, 0,04 em betűközzel 5,62 em széles (mérve). A színátmenetes betű csak a saját keretén belül festődik, ezért ami kilóg, az átlátszó marad (ez vágta le az M-et). A méret a keret szélességéből jön. */ .sect-hero .blk-hero .in{max-width:1400px} .blk-hero .in{container-type:inline-size} .sect-hero .wordmark{display:inline-block;max-width:100%;padding:0 .04em;font-size:clamp(48px,12vw,160px)} @supports (font-size:1cqw){ .sect-hero .wordmark{font-size:clamp(40px,calc((100cqw - 8px) / 5.9),186px)} } /* ---- Jelentkezés: nyilvános űrlap, követő oldal ---- */ .blk-apply{padding:8px 0} .blk-apply h2{font-family:var(--serif);font-weight:800;font-size:clamp(26px,4vw,36px);margin:0 0 10px} .applyform{display:flex;flex-direction:column;gap:6px;margin-top:18px} .applyform .hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden} .applyform .afield{display:block;margin:0 0 12px;border:0;padding:0;color:var(--ash);font-size:15px;font-weight:500} .applyform legend{color:var(--ash);font-size:15px;font-weight:500;margin-bottom:6px;padding:0} .applyform input[type=text],.applyform select,.applyform textarea{width:100%;margin-top:6px;padding:11px 12px;background:var(--obsidian);color:var(--bone);border:1px solid rgba(255,255,255,.16);border-radius:2px;font:inherit} .applyform .two input{margin-top:0} .applyform textarea{resize:none;min-height:96px} .applyform .req{color:var(--ember)} .applyform .consent{border:1px solid var(--line);background:rgba(200,163,90,.06);padding:18px 20px;margin:10px 0 16px} .applyform .consent legend{padding:0 8px;color:var(--brass);font-family:var(--serif);font-weight:800;font-size:17px} .applyform .consent p{margin:0 0 10px;color:#CFC3B6;font-size:15.5px} .applyform .check{margin:0;color:var(--bone)} .applyform .btn{align-self:flex-start} .applyform input:disabled,.applyform select:disabled,.applyform textarea:disabled{opacity:.75} .blk-apply .big{font-family:var(--serif);font-size:26px;font-weight:800;margin:0 0 12px} .blk-apply .steps{display:grid;gap:14px;margin:12px 0} .blk-apply .step{background:var(--surface2);border:1px solid var(--line-soft);border-top:2px solid var(--ember-deep);padding:18px 20px} .blk-apply .step p{margin:8px 0 0} .blk-apply .amsg{padding:12px 16px;border-left:3px solid var(--brass);background:rgba(200,163,90,.08);white-space:pre-wrap} /* ---- Jelentkezések az adminban ---- */ .nbadge{margin-left:auto;background:var(--ember);color:#1A0E08;font-size:12px;font-weight:700;padding:0 8px;border-radius:10px;line-height:1.6} .appgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-bottom:26px} .appwrap{display:flex;flex-direction:column;gap:8px;align-items:flex-start} .appwrap .appcard{width:100%} .appcard{position:relative;display:flex;align-items:stretch;gap:18px;padding:16px;background:var(--surface);border:1px solid var(--line-soft);border-radius:4px;text-decoration:none;color:var(--bone);transition:border-color .15s,box-shadow .15s} .appcard:hover,.appcard:focus-visible{border-color:var(--brass);box-shadow:0 0 0 1px rgba(200,163,90,.25);outline:none} .appcard.unseen{background:rgba(224,75,30,.06)} .apic{flex:0 0 78px;width:78px;min-height:104px;border:1px solid var(--brass);border-radius:10px;overflow:hidden;background:var(--basalt);box-shadow:0 0 0 3px rgba(200,163,90,.08);display:block} .apic img{width:100%;height:100%;object-fit:cover;display:block} .abody{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1} .aname{font-family:var(--serif);font-weight:800;font-size:17px;line-height:1.25;overflow-wrap:anywhere} .ameta{font-size:13.5px;color:var(--ash)} .acls,.aclass{font-weight:600;color:var(--cc,var(--bone))} .aprof{font-size:13.5px;font-weight:600;color:#E6A04A} .adiscord{font-size:13px;color:var(--bone);overflow-wrap:anywhere} .afoot{margin-top:auto;padding-top:6px;display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap} .adate{font-size:11.5px;color:var(--ash)} .adecider{font-size:11.5px;font-weight:600;text-align:right} .adecider.ok{color:#8FCB7A}.adecider.no{color:#FF8A70}.adecider.exp{color:var(--ash)} .newdot{position:absolute;top:10px;right:12px;background:var(--ember);color:#1A0E08;font-size:11px;font-weight:700;padding:1px 8px;border-radius:10px} .aphead{display:flex;gap:18px;align-items:center} .aphead .apic{flex-basis:78px} .aheading{color:var(--cc,var(--bone));margin:0 0 4px} dl.answers{display:grid;grid-template-columns:minmax(150px,240px) 1fr;gap:14px 24px;margin:0} dl.answers dt{color:var(--ash);font-size:14px;font-weight:500} dl.answers dd{margin:0;white-space:pre-wrap;word-break:break-word} .note-item{border-left:2px solid var(--brass);padding:4px 0 4px 14px;margin:0 0 14px} .note-item p{margin:4px 0 0;white-space:pre-wrap} .testbtns{margin-top:14px} .testbtns form{margin:0} .frows td,.strows td{vertical-align:top} .frows input[type=text],.frows input:not([type]),.frows select,.frows textarea{margin-top:0;font-size:14.5px;padding:7px 9px} .narrowin{width:68px !important} @media (max-width:640px){dl.answers{grid-template-columns:1fr}} .helpcard summary{cursor:pointer;color:var(--bone)} .helpcard ol{margin:14px 0 8px;padding-left:22px} .helpcard li{margin:0 0 10px;color:#DCD1C4} /* ---- Class képek ---- */ .cigrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:18px} .ci{margin:0;display:flex;flex-direction:column;gap:10px} .ci-pic{display:block;aspect-ratio:3/4;border:1px solid var(--brass);border-radius:10px;overflow:hidden;background:var(--basalt);box-shadow:0 0 0 3px rgba(200,163,90,.08)} .ci-pic img{width:100%;height:100%;object-fit:cover;display:block} .ci-pic.is-empty,.apic.is-empty{background:radial-gradient(120% 80% at 30% 20%,rgba(237,227,214,.10),transparent 60%),linear-gradient(160deg,rgba(237,227,214,.06),rgba(237,227,214,.015))} .ci figcaption{display:flex;flex-direction:column;gap:6px;align-items:flex-start} .ci-name{font-family:var(--serif);font-weight:800;font-size:18px;color:var(--cc,var(--bone))} .cardacts{display:flex;gap:10px;align-items:flex-start;flex-wrap:wrap} .cardacts form{margin:0} details.confirm{display:inline-block} details.confirm summary{list-style:none;cursor:pointer} details.confirm summary::-webkit-details-marker{display:none} details.confirm[open]{padding:10px 12px;border:1px solid var(--line);background:var(--surface)} details.confirm[open] summary{margin-bottom:8px} .pagehead.sub{display:flex;justify-content:space-between;align-items:center;gap:16px;margin:0} /* ---- Biztonsági napló: 30 sor után függőlegesen görgethető, rejtett görgetősávval ---- */ .logbox{--logrow:52px;--loghead:44px;max-height:calc(30 * var(--logrow) + var(--loghead));overflow-y:auto;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;overscroll-behavior:contain} .logbox::-webkit-scrollbar{display:none;width:0;height:0} .logbox:focus-visible{outline:2px solid var(--brass);outline-offset:2px} .logbox table{width:100%;min-width:760px;table-layout:fixed;border-collapse:separate;border-spacing:0} .logbox thead th{position:sticky;top:0;z-index:2;height:var(--loghead);padding:0 12px;background:var(--surface);text-align:left;border-bottom:1px solid var(--line)} .logbox tbody tr{height:var(--logrow)} .logbox td{height:var(--logrow);padding:0 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;border-bottom:1px solid var(--line-soft);line-height:1.35} .avrow{display:flex;gap:18px;align-items:center} .avpic{flex:0 0 96px;width:96px;height:96px;border-radius:50%;overflow:hidden;border:1px solid var(--brass);background:var(--basalt);display:block} .avpic img{width:100%;height:100%;object-fit:cover;display:block} .avpic.is-empty{background:radial-gradient(120% 80% at 30% 20%,rgba(237,227,214,.10),transparent 60%),linear-gradient(160deg,rgba(237,227,214,.06),rgba(237,227,214,.015))} /* ---- Mentés ---- */ .backupnote a{font-weight:700} .dlform{display:flex;flex-direction:column;gap:8px;min-width:320px;max-width:420px;margin-top:8px} .dlform label{display:block;font-size:14px;color:var(--ash)} .dlform input,.dlform select{width:100%;margin-top:4px} details.dl[open]{background:var(--surface);padding:12px 14px;border:1px solid var(--line)} /* ---- Jelszógenerátor ---- */ .pwtools{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:2px 0 12px} .pwtools[hidden],.pwtools [hidden]{display:none} .pwstatus{flex:1 1 100%;font-size:14px;color:var(--ash);min-height:1.2em} .pwsaved{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink)} .pwsaved input{width:auto;margin:0} /* ---- Meghívók ---- */ .invform{display:flex;flex-direction:column;gap:12px;max-width:560px} .invform fieldset{border:1px solid var(--line);border-radius:6px;padding:12px 14px;margin:0} .invform legend{padding:0 6px;color:var(--ash)} .invform.tedit{max-width:780px} .rankbox{border:1px solid var(--line);border-radius:6px;padding:12px 14px 2px;margin:0 0 14px;background:rgba(255,255,255,.015)} .rankbox legend{padding:0 8px;color:var(--bone);font-weight:600} .invform textarea{display:block;width:100%;margin-top:6px;padding:10px 12px;background:var(--obsidian);color:var(--bone);border:1px solid rgba(255,255,255,.14);border-radius:2px;font:inherit;font-size:14.5px;line-height:1.5;height:7.5em;min-height:7.5em;resize:none;overflow-y:auto} .invform textarea:focus-visible{outline:2px solid var(--brass);outline-offset:2px} .hint.err{color:var(--err)} .check{display:flex;gap:8px;align-items:flex-start;font-weight:500} .check input{width:auto;margin-top:4px} .groupbox{display:flex;flex-direction:column;gap:6px} .copystatus{font-size:14px;color:var(--ash);margin-left:8px} .bulkresult td.link{font-family:var(--mono);font-size:13px;word-break:break-all} .bulkall{width:100%;min-height:160px;font-family:var(--mono);font-size:13px} .adiscord .dlabel{color:var(--ash)} /* ---- Discord belépés a tagi oldalakon ---- */ .discordbox{border-color:var(--brass)} .discordbox h2{margin-top:0} /* ---- Felugró ablak (Discord belépés a regisztráció végén) ---- */ dialog.dlgbox{max-width:min(520px,92vw);background:var(--surface);color:var(--ink);border:1px solid var(--brass);border-radius:8px;padding:24px 26px} dialog.dlgbox::backdrop{background:rgba(0,0,0,.65)} dialog.dlgbox h2{margin-top:0} dialog.dlgbox .btn{display:inline-block} /* ---- Link másolása és könyvjelzőbe mentés a jelentkező követő linkje mellett ---- */ .linkactions{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .bookmarkhelp{margin-top:0} /* ---- Link küldése e-mailben ---- */ .hp{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden} .emailform label{display:block;margin-bottom:8px} /* ---- A meghívók listája: 10 sor után görgethető, rejtett görgetősávval (a napló dobozát használja) ---- */ .logbox.rows10{--logrow:56px;max-height:calc(10 * var(--logrow) + var(--loghead))} .logbox.rows10 table.invtable{table-layout:auto;min-width:900px} .logbox.rows10 .linkbtn{white-space:nowrap} /* ---- Elfogadott jelentkezések: kártyák jelvényekkel ---- */ .abadges{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 2px} .abadge{font-size:11.5px;font-weight:600;padding:2px 9px;border-radius:999px;border:1px solid var(--line-soft);color:var(--ash);white-space:nowrap} .abadge.on{color:#8FCB7A;border-color:rgba(143,203,122,.45);background:rgba(143,203,122,.08)} .abadge.warn{color:#FF8A70;border-color:rgba(255,138,112,.45);background:rgba(255,138,112,.07)} /* ---- Egyéni belépési link ---- */ .loginlinkbox h3{margin-bottom:6px} .note.strong{border-left:4px solid var(--brass);background:rgba(200,163,90,.08)} /* ---- Talent kalkulátor ---- */ .tc{--tc-cell:64px} .tc-loading,.tc-error{padding:24px 0;color:var(--ash)} .tc-classes{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px} .tc-class{padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:var(--ink);font:inherit;font-weight:600;cursor:pointer} .tc-class[aria-pressed="true"]{border-color:var(--tcc,var(--brass));box-shadow:0 0 0 1px var(--tcc,var(--brass));color:var(--tcc,var(--brass))} .tc-class:focus-visible,.tc-talent:focus-visible,.tc-tabreset:focus-visible{outline:2px solid var(--brass);outline-offset:2px} .cls-warrior{--tcc:#C69B6D}.cls-paladin{--tcc:#F48CBA}.cls-hunter{--tcc:#AAD372}.cls-rogue{--tcc:#FFF468}.cls-priest{--tcc:#E8E8E8} .cls-shaman{--tcc:#2E86F0}.cls-mage{--tcc:#3FC7EB}.cls-warlock{--tcc:#8788EE}.cls-druid{--tcc:#FF7C0A} .tc-warn{padding:10px 14px;border-left:4px solid #E6A04A;background:rgba(230,160,74,.1);margin:0 0 12px} .tc-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px} .tc-summary{margin:0;font-weight:600} .tc-buttons{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .tc-alert{margin:16px 0 0;padding:12px 16px;border:1px solid #E8963A;border-left-width:5px;border-radius:8px;background:rgba(232,150,58,.15);color:#FFE4BD;font-weight:600;box-shadow:0 0 18px rgba(232,150,58,.28);position:sticky;bottom:12px;z-index:5} .tc-trees{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px} .tc-tab{background:var(--surface);border:1px solid var(--line-soft);border-radius:12px;padding:12px;min-width:0} .tc-tabhead{display:flex;align-items:baseline;gap:10px;margin-bottom:10px} .tc-tabname{margin:0;font-size:18px;color:var(--tcc,var(--brass))} .tc-tabpts{font-weight:700;font-size:18px} .tc-tabreset{margin-left:auto;background:none;border:0;color:var(--ash);text-decoration:underline;cursor:pointer;font:inherit;font-size:13px} .tc-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(7,1fr);aspect-ratio:4/7;width:100%} .tc-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none} .tc-line{stroke:var(--line);stroke-width:3;vector-effect:non-scaling-stroke;stroke-linecap:round} .tc-line.is-on{stroke:var(--tcc,var(--brass))} .tc-line.is-visual{stroke-dasharray:2 6;opacity:.6} .tc-talent{position:relative;margin:7%;padding:3px;border-radius:10px;border:2px solid var(--line);background:var(--bg,#14110f);color:var(--ink);font:inherit;font-size:11px;line-height:1.15;cursor:pointer;display:flex;flex-direction:column;justify-content:space-between;align-items:center;text-align:center;overflow:hidden;min-width:0} .tc-name{display:block;overflow:hidden;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;word-break:break-word} .tc-rank{font-weight:700;font-size:12px} .tc-talent.is-locked{opacity:.45} .tc-talent.is-available{border-color:#8FCB7A} .tc-talent.is-partial{border-color:#8FCB7A;background:rgba(143,203,122,.12)} .tc-talent.is-maxed{border-color:var(--tcc,var(--brass));background:rgba(200,163,90,.16)} .tc-talent.is-single{border-radius:50%} .tc-detail{margin-top:18px;padding:14px 16px;border:1px solid var(--line-soft);border-radius:12px;background:var(--surface);min-height:90px} .tc-detail-name{margin:0 0 4px;color:var(--tcc,var(--brass))} .tc-detail p{margin:4px 0} .tc-detail-desc{white-space:pre-line} .tc-detail-next-title{color:var(--ash);font-weight:600} .tc-detail-hint,.tc-help,.tc-note{color:var(--ash);font-size:13.5px} .tc-help,.tc-note{margin-top:14px} @media (max-width:900px){.tc-trees{grid-template-columns:1fr}.tc-grid{max-width:420px;margin:0 auto}} .importreport ul{margin:6px 0 10px 18px} /* ---- Talent admin: háttér-helyek ---- */ .tabbg{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-bottom:12px} .tabbg-thumb{width:96px;height:168px;border:1px dashed var(--line);border-radius:8px;display:flex;align-items:center;justify-content:center;overflow:hidden;text-align:center;font-size:12px} .tabbg-thumb img{width:100%;height:100%;object-fit:cover} /* ---- Talent kalkulátor: ikonok, háttér, buborék, nyelvváltó ---- */ .tc-top{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-start;justify-content:space-between;margin-bottom:14px} .tc-top .tc-classes{margin-bottom:0} .tc-lang{display:flex;gap:0;border:1px solid var(--line);border-radius:999px;overflow:hidden} .tc-langbtn{padding:7px 14px;border:0;background:var(--surface);color:var(--ink);font:inherit;font-weight:700;cursor:pointer} .tc-langbtn[aria-pressed="true"]{background:var(--brass);color:#14110f} .tc-langbtn:focus-visible{outline:2px solid var(--brass);outline-offset:-2px} .tc-grid{background-size:cover;background-position:center;border-radius:10px} .tc-lines{z-index:1} .tc-talent{z-index:2} .tc-talent.has-ic{padding:0;border-width:2px} .tc-ic{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit;-webkit-user-drag:none;user-select:none} .tc-talent.has-ic .tc-rank{position:absolute;right:2px;bottom:2px;padding:0 5px;border-radius:6px;background:rgba(10,8,6,.85);font-size:11px;line-height:1.5} .tc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .tc-talent.has-ic.is-locked{opacity:1} .tc-talent.has-ic.is-locked .tc-ic{filter:grayscale(1) brightness(.5)} .tc-talent.has-ic.is-available .tc-ic{filter:none} .tc-talent.has-ic.is-maxed{box-shadow:0 0 10px rgba(200,163,90,.7)} .tc-tip{position:fixed;z-index:80;max-width:min(340px,calc(100vw - 16px));padding:10px 12px;border:1px solid var(--brass);border-radius:10px;background:#14110f;color:var(--ink);box-shadow:0 8px 24px rgba(0,0,0,.55);pointer-events:none;font-size:13.5px;line-height:1.4} .tc-tip-name{font-weight:700;font-size:15px;color:var(--tcc,var(--brass));margin-bottom:2px} .tc-trees .tc-tip-name{color:var(--brass)} .tc-tip-rank,.tc-tip-req,.tc-tip-pre{color:var(--ash)} .tc-tip-miss{color:#FF8A70;font-weight:600} .tc-tip-desc{margin-top:6px;white-space:pre-line} .tc-tip-next{margin-top:8px;color:var(--ash);font-weight:600} .tc-tip-hint{margin-top:8px;font-size:12px;color:var(--ash);opacity:.8} /* ---- Talent kalkulátor: az ikonok 20%-kal kisebbek (a mostani 86%-os kitöltés 68,8%-ra) ---- */ .tc-talent.has-ic{margin:15.6%} .tc-talent.has-ic .tc-rank{font-size:10px} /* ---- Talent admin: fényerő ---- */ .lightclass{margin-top:26px} .lightrow{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px} .lightcard{display:flex;gap:14px;align-items:center;padding:12px;border:1px solid var(--line-soft);border-radius:10px;background:var(--surface)} .lightprev{flex:0 0 60px;width:60px;height:114px;border-radius:4px;background:#1A1512 center/cover no-repeat;display:flex;align-items:center;justify-content:center;text-align:center} .lightprev.noimg span{font-size:10px;line-height:1.2;color:var(--ash);padding:4px} .lightbody{flex:1;min-width:0} .lightbody input[type=range]{display:block;width:100%;margin:2px 0;accent-color:var(--brass)} .lightscale{display:flex;justify-content:space-between;margin-top:8px;font-size:10.5px;color:var(--ash);position:relative} .lightscale span:nth-child(2){position:absolute;left:50%;transform:translateX(-50%)} .lightval{font-weight:600;margin-right:10px} /* ---- Hibabeküldés ---- */ .bugform label{display:block;margin-bottom:14px;font-weight:600} .bugform input[name=name],.bugform textarea{display:block;width:100%;margin-top:6px;font:inherit} .report{margin-bottom:12px} .reporthead{display:flex;flex-wrap:wrap;gap:10px;align-items:baseline} .reportbody{white-space:pre-wrap;word-break:break-word;margin:8px 0} .reportact{display:flex;flex-wrap:wrap;gap:8px;align-items:flex-start} .rstat{margin-left:auto;font-size:12px;font-weight:700;padding:2px 10px;border-radius:999px;border:1px solid var(--line)} .rstat-new{color:#FF8A70;border-color:rgba(255,138,112,.5)} .rstat-seen{color:var(--ash)} .rstat-done{color:#8FCB7A;border-color:rgba(143,203,122,.45)} .tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px} .tabs a{padding:6px 12px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none} .tabs a.on{border-color:var(--brass);color:var(--brass)} /* ---- Raid Planner ---- */ .rp-title{margin:0 0 4px;color:var(--brass)} .rp-sub{color:var(--ash);margin:0 0 6px} .rp-counter{font-weight:700;margin:0 0 14px} .rp-counter.full{color:var(--ember)} .rp-cols{display:grid;grid-template-columns:minmax(260px,1fr) minmax(320px,2fr);gap:18px;align-items:start} .rp-col{background:var(--surface);border:1px solid var(--line-soft);border-radius:12px;padding:12px} .rp-col h3{margin:0 0 10px;font-size:16px} .rp-zone{min-height:90px;border:2px dashed transparent;border-radius:10px;padding:2px} .rp-zone.rp-over{border-color:var(--brass);background:rgba(200,163,90,.07)} .rp-empty{color:var(--ash);font-size:14px;margin:6px} .rp-cat{margin-bottom:12px} .rp-cat h4{margin:0 0 6px;font-size:14px;color:var(--ash)} .rp-cat-tank h4{color:#5B8DD6}.rp-cat-heal h4{color:#5FBF7A}.rp-cat-melee h4,.rp-cat-ranged h4{color:#D6584A} .rp-cat-list{display:grid;gap:6px;min-height:8px} .rp-card{display:flex;gap:8px;align-items:center;justify-content:space-between;padding:8px 10px;border:1px solid var(--line);border-left:4px solid var(--tcc,var(--brass));border-radius:8px;background:var(--bg,#14110f);cursor:grab;touch-action:none;user-select:none} .rp-cmain{display:flex;flex-direction:column;min-width:0} .rp-cname{color:var(--tcc,var(--bone))} .rp-cmeta,.rp-cplayer{font-size:12.5px;color:var(--ash);white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .rp-cacts{display:flex;gap:4px} .rp-btn{min-width:34px;min-height:34px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);cursor:pointer;font:inherit} .rp-btn:focus-visible{outline:2px solid var(--brass)} .rp-rm{color:#FF8A70} .rp-dragging{opacity:.4} .rp-ghost{position:fixed;z-index:90;pointer-events:none;opacity:.92;box-shadow:0 8px 24px rgba(0,0,0,.55)} .rp-bar{display:flex;flex-wrap:wrap;gap:10px;align-items:center;justify-content:flex-end;margin-top:16px} .rp-status{margin-right:auto;color:var(--ash)} @media (max-width:760px){.rp-cols{grid-template-columns:1fr}} /* ---- Raid Planner: kaszt- és spec-ikonok ---- */ .rp-icons{display:flex;gap:4px;align-items:center;flex:0 0 auto} .rp-ic{width:30px;height:30px;border-radius:5px;display:block;-webkit-user-drag:none;user-select:none} .rp-ic-class{width:22px;height:22px;opacity:.9} /* ---- Raid Planner: időpont-fülek ---- */ .rp-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 12px} .rp-tab{padding:8px 14px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--ink);font:inherit;cursor:pointer} .rp-tab.on{border-color:var(--brass);color:var(--brass);font-weight:700} .rp-tab.rp-over{background:rgba(200,163,90,.18);border-color:var(--brass)} .rp-tab:focus-visible{outline:2px solid var(--brass)} .rp-slotsel{min-height:34px;border:1px solid var(--line);border-radius:6px;background:var(--surface);color:var(--ink);font:inherit;max-width:64px} /* ---- Nyilvános névsor ---- */ .nv-meta{color:var(--ash);margin:4px 0 0;font-size:17px} .nv-wrap{max-width:1100px} .nv-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px} .nv-tabs a{padding:8px 14px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none} .nv-tabs a:hover,.nv-tabs a:focus-visible{border-color:var(--brass);color:var(--brass)} .nv-slot{margin:0 0 34px;padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--surface)} .nv-slot h2{margin:0 0 4px;color:var(--brass)} .nv-cancelled{opacity:.55} .nv-status{margin:0 0 14px;color:var(--ash);font-weight:600} .nv-roles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px} .nv-role h3,.nv-bench h3{margin:0 0 8px;font-size:17px} .nv-role-tank h3{color:#5B8DD6}.nv-role-heal h3{color:#5FBF7A}.nv-role-melee h3,.nv-role-ranged h3{color:#D6584A} .nv-list{list-style:none;margin:0;padding:0;display:grid;gap:6px} .nv-list li{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:7px 10px;border-left:4px solid var(--tcc,var(--brass));border-radius:6px;background:rgba(255,255,255,.04);font-size:18px} .nv-list strong{color:var(--tcc,var(--bone))} .nv-list small{flex-basis:100%;margin-left:40px;color:var(--ash);font-size:13.5px} .nv-seq{color:var(--ash);font-weight:700;min-width:2.2em} .nv-ic{width:30px;height:30px;border-radius:5px;flex:0 0 auto} .nv-empty{color:var(--ash);margin:0} .nv-bench{margin-top:18px} .nv-bench .nv-list{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))} .nv-classes{display:flex;flex-wrap:wrap;gap:16px;margin-top:20px;padding-top:14px;border-top:1px solid var(--line)} .nv-cls{display:inline-flex;align-items:center;gap:8px;font-size:22px} .nv-cls b{color:var(--tcc,var(--bone))} .nv-cls .nv-ic{width:28px;height:28px} .nv-zero{opacity:.35} .nv-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .nv-note{color:var(--ash);font-size:14px} @media (max-width:900px){.nv-roles{grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:560px){.nv-roles{grid-template-columns:1fr}} .rp-hint{color:var(--ash);font-size:13.5px} /* ---- Raid Naptár ---- */ .rc-bar{display:flex;flex-wrap:wrap;gap:14px 24px;justify-content:space-between;margin:14px 0 18px} .rc-chips{display:flex;flex-wrap:wrap;gap:8px} .rc-chip{padding:7px 14px;border:1px solid var(--line);border-radius:999px;color:var(--ink);text-decoration:none} .rc-chip b{color:var(--ash);margin-left:4px} .rc-chip.on{border-color:var(--brass);color:var(--brass);font-weight:700} .rc-chip:focus-visible{outline:2px solid var(--brass)} .rc-empty{padding:28px;border:1px dashed var(--line);border-radius:12px;color:var(--ash);text-align:center} .rc-lista{display:grid;gap:12px} .rc-card{border:1px solid var(--line);border-left:4px solid var(--brass);border-radius:12px;background:var(--surface);padding:14px 16px} .rc-raid{border-left-color:#E04B1E} .rc-head h2{margin:2px 0 2px;font-size:22px} .rc-kind{display:inline-block;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--brass);font-weight:700} .rc-raid .rc-kind{color:#E04B1E} .rc-meta{margin:0 0 8px;color:var(--ash);font-size:14.5px} .rc-card{display:grid;grid-template-columns:minmax(210px,1fr) 3fr;gap:6px 22px;align-items:start} .rc-head{grid-column:1} .rc-slots{grid-column:2;min-width:0} .rc-slot{border-top:1px solid var(--line);padding:8px 0} .rc-slot summary{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;cursor:pointer;list-style:none} .rc-slot summary::-webkit-details-marker{display:none} .rc-slot summary::before{content:"▸";color:var(--brass)} .rc-slot[open] summary::before{content:"▾"} .rc-when{font-weight:700} .rc-fill,.rc-wait,.rc-lead,.rc-lock{color:var(--ash);font-size:14.5px} .rc-body{padding:12px 0 4px} .rc-links{margin:14px 0 0} @media (max-width:760px){.rc-card{grid-template-columns:1fr}.rc-head,.rc-slots{grid-column:1}} /* ---- Raid Naptár: vékony, listaszerű névsor (sorszám, spec ikon, név) ---- */ .rc-roles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px 10px} .rc-role{min-width:0} .rc-rh{margin:0 0 4px;font-size:13.5px;white-space:nowrap;display:flex;align-items:center;gap:5px} .rc-rh b{font-weight:700;color:var(--ash)} .rc-role-tank .rc-rh{color:#5B8DD6}.rc-role-heal .rc-rh{color:#5FBF7A}.rc-role-melee .rc-rh,.rc-role-ranged .rc-rh{color:#D6584A} .rc-ppl{list-style:none;margin:0;padding:0} .rc-p{display:flex;align-items:center;gap:5px;height:26px;padding:0 4px;border-left:3px solid var(--tcc,var(--brass));min-width:0} .rc-p:nth-child(odd){background:rgba(255,255,255,.035)} .rc-seq{flex:0 0 auto;min-width:1.9em;text-align:right;color:var(--ash);font-size:13px;font-variant-numeric:tabular-nums} .rc-ic{flex:0 0 auto;width:22px;height:22px;border-radius:4px;display:block} .rc-name{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--tcc,var(--bone));font-weight:600;font-size:14.5px} .rc-none{margin:0;color:var(--ash);font-size:14px} .rc-benchbox{margin-top:10px} .rc-bench{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:0 10px} .rc-classes{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:10px;padding-top:8px;border-top:1px solid var(--line)} .rc-cls{display:inline-flex;align-items:center;gap:4px;font-size:15px} .rc-cls b{color:var(--tcc,var(--bone))} @media (max-width:760px){.rc-roles{grid-template-columns:repeat(2,minmax(0,1fr))}} @media (max-width:420px){.rc-roles{grid-template-columns:1fr}} /* ---- Tagi profil ---- */ .pf-top{display:flex;gap:22px;flex-wrap:wrap;align-items:flex-start} .pf-pic{display:flex;align-items:center;justify-content:center;width:160px;height:160px;border:1px solid var(--line);background:var(--obsidian);overflow:hidden} .pf-pic img{width:100%;height:100%;object-fit:cover;display:block} .pf-pic.is-empty{border-style:dashed} .pf-picside{flex:1 1 260px;min-width:240px} .pf-picside .check{margin-top:10px} .pf-preview{font-family:var(--serif);font-weight:800;font-size:22px;margin:0 0 14px;color:var(--cc,var(--bone))} .pf-preview .pv-meta{font-family:var(--sans,inherit);font-weight:500;font-size:15px} .profform select.clsel{font-weight:700;color:var(--cc,var(--bone))} .profform textarea{width:100%;margin-top:4px;padding:10px 12px;background:var(--obsidian);color:var(--bone);border:1px solid rgba(255,255,255,.14);border-radius:2px;font:inherit;resize:none;min-height:200px;line-height:1.5} .pf-reason{white-space:pre-wrap} .pf-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap} .pf-rowpic{width:72px;height:72px;border:1px solid var(--line);background:var(--obsidian);display:flex;align-items:center;justify-content:center;overflow:hidden;font-size:12px} .pf-rowpic img{width:100%;height:100%;object-fit:cover} .pf-rowtxt{flex:1 1 220px} .pf-rowtxt p{margin:0} .pf-name{font-family:var(--serif);font-weight:800;color:var(--cc,var(--bone))} .pf-compare{display:flex;gap:22px;flex-wrap:wrap} .pf-compare figure{margin:0} .pf-diff{width:100%;border-collapse:collapse} .pf-diff th,.pf-diff td{padding:8px 10px;border-bottom:1px solid var(--line-soft);text-align:left;vertical-align:top} .pf-diff thead th{color:var(--ash);font-weight:500;font-size:14px} .pf-diff tbody th{width:170px;color:var(--ash);font-weight:500} .pf-diff tr.changed td.pf-new{background:rgba(200,163,90,.10)} .pf-long{white-space:pre-wrap;overflow-wrap:anywhere} .pf-rejectbox{margin-top:14px} /* Buildek (v0.24.1) */ .bd,.bd-form{--bd-panel:#1a1411;--bd-panel2:#211a15;--bd-line:#3a2d24;--bd-line2:#4d3a2c;--bd-bone:#eadfca;--bd-ash:#a99c88;--bd-dim:#7a6e5f;--bd-ember:#e8741f;--bd-ember2:#c8541a;--bd-brass:#d6a24a;--bd-gold:#ffd27a} .bd-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} .bd-hero{position:relative;padding:8px 0 22px} .bd-hero h1{font-family:var(--serif,'Bitter',Georgia,serif);font-size:clamp(34px,5.4vw,58px);margin:0;letter-spacing:.04em;line-height:1.05;background:linear-gradient(180deg,#fff1d2,#e8a24a 55%,#b4521a);-webkit-background-clip:text;background-clip:text;color:transparent} .bd-lead{max-width:640px;color:var(--bd-ash);margin:12px 0 0;font-size:17px} .bd-muted{color:var(--bd-dim);font-size:14px} .bd-note{margin:14px 0 0;padding:10px 14px;border-left:3px solid var(--bd-ember);background:#1c120b;border-radius:0 10px 10px 0;color:#d8cbb4;font-size:14.5px}.bd-note.err{border-color:#c0392b;background:#2a100d} .bd-searchrow{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:22px} .bd-search{flex:1 1 300px;max-width:520px;display:block} .bd-search input{width:100%;background:#0b0705;border:1px solid var(--bd-line2);border-radius:12px;color:var(--bd-bone);padding:12px 16px;font:inherit} .bd-search input:focus{outline:none;border-color:var(--bd-ember);box-shadow:0 0 0 3px #e8741f26} .bd-btn{display:inline-flex;align-items:center;gap:8px;padding:11px 18px;border-radius:12px;border:1px solid transparent;font:inherit;font-weight:600;text-decoration:none;cursor:pointer;background:linear-gradient(180deg,var(--bd-ember),var(--bd-ember2));color:#1a0d05;box-shadow:0 8px 24px -12px var(--bd-ember)} .bd-btn:hover{filter:brightness(1.08)}.bd-btn.ghost{background:transparent;color:var(--bd-bone);border-color:var(--bd-line2);box-shadow:none}.bd-btn.ghost:hover{border-color:var(--bd-brass)}.bd-btn.sm{padding:7px 13px;font-size:14px;border-radius:10px} .bd-rail{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:10px;margin:6px 0 20px} .bd-cls{position:relative;display:block;text-align:center;text-decoration:none;color:var(--bd-bone);background:linear-gradient(180deg,var(--bd-panel2),var(--bd-panel));border:1px solid var(--bd-line);border-radius:14px;padding:12px 6px 10px;overflow:hidden;transition:transform .2s,border-color .2s} .bd-cls:before{content:"";position:absolute;inset:0;background:radial-gradient(closest-side at 50% 0,var(--cc,#fff),transparent 75%);opacity:0;transition:opacity .25s} .bd-cls:hover{transform:translateY(-3px);border-color:var(--cc,#fff)}.bd-cls:hover:before{opacity:.18} .bd-cls.on{border-color:var(--cc,#fff);box-shadow:0 12px 34px -14px var(--cc,#fff),inset 0 0 0 1px var(--cc,#fff)}.bd-cls.on:before{opacity:.28} .bd-ico,.bd-crest{position:relative;display:block;width:46px;height:46px;margin:0 auto 6px;object-fit:contain;filter:drop-shadow(0 4px 10px #0009)}.bd-crest{width:44px;height:50px;color:var(--cc,#fff)} .bd-cls b{display:block;position:relative;font-size:14px;color:var(--cc,#fff)}.bd-cls small{display:block;position:relative;color:var(--bd-dim);font-size:12px} .bd-bar{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:0 0 20px;padding:10px 12px;background:var(--bd-panel);border:1px solid var(--bd-line);border-radius:14px} .bd-seg{display:inline-flex;flex-wrap:wrap;background:#0b0705;border:1px solid var(--bd-line);border-radius:11px;padding:3px} .bd-seg a{display:inline-flex;align-items:center;gap:7px;padding:7px 13px;border-radius:8px;color:var(--bd-ash);text-decoration:none;font-size:14px} .bd-seg a svg{width:15px;height:15px}.bd-seg a:hover{color:var(--bd-bone)}.bd-seg a.on{background:linear-gradient(180deg,#3a2514,#2a1a0e);color:var(--bd-gold);box-shadow:inset 0 0 0 1px #6a4423} .bd-sort{margin-left:auto}.bd-count{color:var(--bd-dim);font-size:14px;margin:-8px 0 14px} .bd-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px} .bd-card{position:relative;background:linear-gradient(180deg,var(--bd-panel2),var(--bd-panel));border:1px solid var(--bd-line);border-radius:16px;overflow:hidden;transition:transform .22s,border-color .22s,box-shadow .22s} .bd-card:hover{transform:translateY(-4px);border-color:var(--cc,#fff);box-shadow:0 18px 44px -18px var(--cc,#fff)} .bd-link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none} .bd-banner{position:relative;min-height:84px;padding:0 16px 10px;display:flex;align-items:flex-end;gap:8px;background:linear-gradient(120deg,color-mix(in srgb,var(--cc,#fff) 36%,#120c08) 0,#120c08 78%)} .bd-banner:after{content:"";position:absolute;right:-30px;top:-40px;width:170px;height:170px;border-radius:50%;background:radial-gradient(closest-side,var(--cc,#fff),transparent 70%);opacity:.26;pointer-events:none} .bd-spec{position:absolute;right:14px;top:12px;width:52px;height:52px;object-fit:contain;z-index:1;filter:drop-shadow(0 4px 10px #000a)} .bd-tag{position:relative;z-index:1;display:inline-flex;align-items:center;gap:6px;font-size:12px;letter-spacing:.1em;text-transform:uppercase;background:#0009;border:1px solid #fff2;border-radius:999px;padding:3px 10px}.bd-tag svg{width:13px;height:13px} .bd-ribbon{position:absolute;top:12px;left:14px;z-index:2;background:linear-gradient(180deg,#ffd98a,#c8902a);color:#2a1700;font-weight:800;font-size:11px;letter-spacing:.12em;padding:4px 10px;border-radius:6px;box-shadow:0 6px 16px -6px var(--bd-gold)} .bd-body{display:flex;flex-direction:column;gap:10px;padding:16px 18px 14px;flex:1} .bd-body h2{font-family:var(--serif,'Bitter',Georgia,serif);font-size:20px;margin:0;line-height:1.2}.bd-body p{margin:0;color:var(--bd-ash);font-size:14.5px} .bd-cname{color:var(--cc,#d6a24a);font-weight:700;font-size:13px;letter-spacing:.06em;text-transform:uppercase} .bd-split{display:flex;gap:8px;margin-top:2px}.bd-tr{flex:1;min-width:0}.bd-tr i{display:block;height:6px;border-radius:99px;background:#0b0705;border:1px solid var(--bd-line);overflow:hidden} .bd-tr s{display:block;height:100%;background:linear-gradient(90deg,color-mix(in srgb,var(--cc,#fff) 55%,#000),var(--cc,#fff))} .bd-tr span{display:flex;justify-content:space-between;gap:6px;font-size:11.5px;color:var(--bd-dim);margin-top:4px}.bd-tr span b{color:var(--bd-bone);font-variant-numeric:tabular-nums} .bd-foot{display:flex;align-items:center;gap:10px;padding:12px 18px;border-top:1px solid var(--bd-line);color:var(--bd-dim);font-size:13px}.bd-foot em{margin-left:auto;font-style:normal} .bd-av{display:grid;place-items:center;flex:none;width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,var(--cc,#d6a24a),#2a1a10);font-weight:700;font-size:12px;color:#120c08}.bd-av.big{width:44px;height:44px;font-size:18px} .bd-empty{grid-column:1/-1;text-align:center;padding:50px 0;color:var(--bd-dim)} .bd-detail{max-width:1100px}.bd-back{margin:0 0 14px}.bd-back a{color:var(--bd-ash);text-decoration:none} .bd-dhero{position:relative;border:1px solid var(--cc,#fff);border-radius:20px;overflow:hidden;background:linear-gradient(120deg,color-mix(in srgb,var(--cc,#fff) 28%,#120c08),#120c08 70%);padding:28px 30px;box-shadow:0 24px 60px -30px var(--cc,#fff)} .bd-dhero:after{content:"";position:absolute;right:-60px;top:-80px;width:340px;height:340px;border-radius:50%;background:radial-gradient(closest-side,var(--cc,#fff),transparent 70%);opacity:.2;pointer-events:none} .bd-badges{display:flex;flex-wrap:wrap;gap:8px;position:relative}.bd-badges span{background:#0009;border:1px solid #fff2;border-radius:999px;padding:3px 12px;font-size:12px;letter-spacing:.1em;text-transform:uppercase}.bd-badges .bd-cb{color:var(--cc,#fff);border-color:var(--cc,#fff)}.bd-badges .bd-gold{color:var(--bd-gold);border-color:#ffd27a66} .bd-dh{position:relative;display:flex;gap:18px;align-items:center;margin-top:14px}.bd-dico{flex:none;width:72px;height:72px;object-fit:contain;filter:drop-shadow(0 6px 14px #000a)} .bd-dh h1{font-family:var(--serif,'Bitter',Georgia,serif);font-size:clamp(26px,4vw,40px);margin:0 0 6px;line-height:1.1}.bd-dh p{margin:0;max-width:640px;color:#d8cbb4} .bd-kpis{display:flex;flex-wrap:wrap;gap:26px;margin-top:20px;position:relative}.bd-kpi b{display:block;font-family:var(--serif,'Bitter',Georgia,serif);font-size:30px;line-height:1;color:var(--cc,#fff)}.bd-kpi small{color:var(--bd-ash);font-size:12px;letter-spacing:.08em;text-transform:uppercase} .bd-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px;position:relative} .bd-cols{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:22px;margin-top:22px} .bd-tabs{display:none;gap:4px;border-bottom:1px solid var(--bd-line);margin-bottom:18px;overflow:auto}.bd-tabbed .bd-tabs{display:flex} .bd-tabs button{background:none;border:0;border-bottom:3px solid transparent;color:var(--bd-ash);padding:12px 18px;font:inherit;font-weight:600;white-space:nowrap;cursor:pointer}.bd-tabs button.on{color:var(--bd-gold);border-color:var(--bd-ember)}.bd-tabs button:hover{color:var(--bd-bone)} .bd-pane{margin-bottom:26px}.bd-pane h2{font-family:var(--serif,'Bitter',Georgia,serif);font-size:20px;border-bottom:1px solid var(--bd-line);padding-bottom:6px;margin:0 0 14px} .bd-tabbed .bd-pane{display:none;margin-bottom:0}.bd-tabbed .bd-pane.on{display:block}.bd-tabbed .bd-pane h2{display:none} .bd-box{background:linear-gradient(180deg,var(--bd-panel2),var(--bd-panel));border:1px solid var(--bd-line);border-radius:16px;padding:18px}.bd-box h2{margin:0 0 12px;font-family:var(--serif,'Bitter',Georgia,serif);font-size:17px} .bd-trees{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px} .bd-tree{background:#0d0907;border:1px solid var(--bd-line);border-radius:14px;padding:12px} .bd-tree header{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:10px;color:var(--bd-ash);font-size:13px}.bd-tree header b{font-family:var(--serif,'Bitter',Georgia,serif);font-size:15px;color:var(--bd-bone)}.bd-tree header em{font-style:normal;color:var(--cc,#fff);font-weight:700;font-variant-numeric:tabular-nums} .bd-tgrid{display:grid;gap:7px}.bd-tgrid.c3{grid-template-columns:repeat(3,1fr)}.bd-tgrid.c4{grid-template-columns:repeat(4,1fr)}.bd-tgrid.c5{grid-template-columns:repeat(5,1fr)}.bd-tgrid.c6{grid-template-columns:repeat(6,1fr)}.bd-tgrid.c7{grid-template-columns:repeat(7,1fr)}.bd-tgrid.c8{grid-template-columns:repeat(8,1fr)} .bd-node{position:relative;aspect-ratio:1;border-radius:9px;border:1px solid #2a2018;background:#150f0b;display:block}.bd-node.empty{border-color:transparent;background:none} .bd-node img{display:block;width:100%;height:100%;object-fit:cover;border-radius:8px;filter:grayscale(1) brightness(.5)} .bd-node.f{border-color:var(--cc,#fff);background:radial-gradient(closest-side,color-mix(in srgb,var(--cc,#fff) 45%,#150f0b),#150f0b);box-shadow:0 0 14px -4px var(--cc,#fff)}.bd-node.f img{filter:none}.bd-node.full{border-color:var(--bd-gold)} .bd-node b{position:absolute;right:-4px;bottom:-5px;background:#000;border:1px solid var(--cc,#fff);border-radius:99px;padding:0 6px;font-size:11px;color:var(--bd-gold)} .bd-lvl{display:flex;flex-wrap:wrap;gap:18px;color:var(--bd-ash);font-size:14px;margin:14px 0 0}.bd-lvl b{color:var(--bd-bone)} .bd-text p{margin:0 0 12px}.bd-text ul{margin:0 0 12px 20px}.bd-links{list-style:none;padding:0;margin:0}.bd-links li{margin:8px 0} .bd-author{display:flex;gap:12px;align-items:center}.bd-kv{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;font-size:14px;margin:14px 0 0}.bd-kv dt{color:var(--bd-dim)}.bd-kv dd{margin:0;text-align:right}.bd-kv .bd-cc{color:var(--cc,#fff)} .bd-own{margin:14px 0 0}.bd-side .bd-box+.bd-box{margin-top:16px} .bd-toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,40px);background:#0c0806;border:1px solid var(--bd-brass);color:var(--bd-gold);padding:10px 18px;border-radius:12px;opacity:0;transition:.25s;z-index:60;pointer-events:none}.bd-toast.on{opacity:1;transform:translate(-50%,0)} .bd-split s.w0{width:0%}.bd-split s.w2{width:2%}.bd-split s.w4{width:4%}.bd-split s.w6{width:6%}.bd-split s.w8{width:8%}.bd-split s.w10{width:10%}.bd-split s.w12{width:12%}.bd-split s.w14{width:14%}.bd-split s.w16{width:16%}.bd-split s.w18{width:18%}.bd-split s.w20{width:20%}.bd-split s.w22{width:22%}.bd-split s.w24{width:24%}.bd-split s.w26{width:26%}.bd-split s.w28{width:28%}.bd-split s.w30{width:30%}.bd-split s.w32{width:32%}.bd-split s.w34{width:34%}.bd-split s.w36{width:36%}.bd-split s.w38{width:38%}.bd-split s.w40{width:40%}.bd-split s.w42{width:42%}.bd-split s.w44{width:44%}.bd-split s.w46{width:46%}.bd-split s.w48{width:48%}.bd-split s.w50{width:50%}.bd-split s.w52{width:52%}.bd-split s.w54{width:54%}.bd-split s.w56{width:56%}.bd-split s.w58{width:58%}.bd-split s.w60{width:60%}.bd-split s.w62{width:62%}.bd-split s.w64{width:64%}.bd-split s.w66{width:66%}.bd-split s.w68{width:68%}.bd-split s.w70{width:70%}.bd-split s.w72{width:72%}.bd-split s.w74{width:74%}.bd-split s.w76{width:76%}.bd-split s.w78{width:78%}.bd-split s.w80{width:80%}.bd-split s.w82{width:82%}.bd-split s.w84{width:84%}.bd-split s.w86{width:86%}.bd-split s.w88{width:88%}.bd-split s.w90{width:90%}.bd-split s.w92{width:92%}.bd-split s.w94{width:94%}.bd-split s.w96{width:96%}.bd-split s.w98{width:98%}.bd-split s.w100{width:100%} .bd-statstrip{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;margin-top:18px;padding:12px 18px;background:linear-gradient(180deg,var(--bd-panel2),var(--bd-panel));border:1px solid var(--bd-line);border-radius:14px}.bd-statstrip b{font-family:var(--serif,'Bitter',Georgia,serif);font-size:16px} .bd-sp{display:flex;flex-wrap:wrap;gap:8px}.bd-sp span{background:#0d0907;border:1px solid var(--bd-line);border-radius:8px;padding:5px 12px;font-size:14px;white-space:nowrap}.bd-sp span+span:before{content:"\203A";color:var(--bd-ember);font-weight:800;margin-right:10px} .bd-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;counter-reset:bds} .bd-steps li{display:flex;gap:14px;align-items:center;background:#0d0907;border:1px solid var(--bd-line);border-radius:12px;padding:10px 14px} .bd-steps li:before{counter-increment:bds;content:counter(bds);width:28px;height:28px;border-radius:50%;background:linear-gradient(180deg,var(--bd-ember),var(--bd-ember2));color:#1a0d05;font-weight:800;display:grid;place-items:center;flex:none} .bd-ic{width:38px;height:38px;border-radius:9px;background:linear-gradient(135deg,color-mix(in srgb,var(--cc,#fff) 55%,#000),#1a120c);border:1px solid var(--cc,#fff);display:grid;place-items:center;font-weight:800;color:#fff;flex:none} .bd-steps li div{min-width:0}.bd-steps b{display:block}.bd-steps small{color:var(--bd-ash)} .bd-notes{margin-top:16px;padding:12px 14px;border-left:3px solid var(--bd-ember);background:#1c120b;border-radius:0 10px 10px 0}.bd-notes p:last-child{margin-bottom:0} .bd-gear{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 14px} .bd-slot{--rc:#9d9d9d;display:flex;gap:10px;align-items:center;background:#0d0907;border:1px solid var(--bd-line);border-radius:10px;padding:8px 10px;min-width:0;color:inherit;transition:border-color .15s,box-shadow .15s} .bd-slot:hover{border-color:var(--rc);box-shadow:0 0 18px -8px var(--rc)} .bd-slot.r-poor{--rc:#9d9d9d}.bd-slot.r-common{--rc:#ffffff}.bd-slot.r-uncommon{--rc:#1eff00}.bd-slot.r-rare{--rc:#0070dd}.bd-slot.r-epic{--rc:#a335ee}.bd-slot.r-legendary{--rc:#ff8000} .bd-sq{width:36px;height:36px;border-radius:7px;border:2px solid var(--rc);background:#150f0b;display:grid;place-items:center;font-size:12px;color:var(--rc);font-weight:700;flex:none;box-shadow:0 0 12px -4px var(--rc)} .bd-gt{min-width:0;display:block}.bd-gt .bd-gl{display:block;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--bd-dim)} .bd-in{display:block;font-size:13.5px;font-weight:700;color:var(--rc);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bd-in:hover{text-decoration:underline} .bd-en{display:block;color:#1eff00;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .bd-slot em{margin-left:auto;font-style:normal;font-size:11.5px;color:var(--rc);letter-spacing:.06em;text-transform:uppercase;flex:none}.bd-lk{flex:none;opacity:.6;color:var(--bd-ember)} .bd-form .bd-help{margin:0 0 16px;padding:14px 16px;border:1px solid var(--bd-brass);border-radius:12px;background:linear-gradient(180deg,#2a1a0e,#1c120b)} .bd-form .bd-help b:first-child{display:block;font-size:16px;color:var(--bd-gold);margin-bottom:6px}.bd-form .bd-help ul{margin:0;padding-left:18px}.bd-form .bd-help li{margin:5px 0} .bd-form textarea{display:block;width:100%;margin-top:6px;padding:10px 12px;background:var(--obsidian,#0b0705);color:var(--bone,#eadfca);border:1px solid rgba(255,255,255,.14);border-radius:2px;font:inherit;resize:none;min-height:90px}.bd-form textarea:focus,.bd-form input:focus,.bd-form select:focus{outline:none;border-color:var(--bd-ember)} .bd-form code{background:#0b0705;border:1px solid var(--bd-line2);border-radius:6px;padding:1px 7px;font-size:12.5px;word-break:break-all;color:var(--bd-gold)} .bd-growhead,.bd-grow{display:grid;grid-template-columns:96px minmax(0,2.2fr) minmax(0,1.6fr) 120px minmax(0,1.8fr);gap:8px;align-items:start;margin:0 0 8px} .bd-growhead{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--bd-dim);margin-top:6px} .bd-grow input,.bd-grow select,.bd-srow input{width:100%;min-width:0}.bd-gslot{padding-top:10px;font-weight:700;color:var(--bd-bone)} .bd-gl small{display:block;min-height:1em;font-size:12px}.bd-good{color:#7fd37f}.bd-bad{color:#e8a24a} .bd-srow{display:grid;grid-template-columns:34px minmax(0,1fr) minmax(0,1.6fr);gap:8px;align-items:center;margin:0 0 8px}.bd-sn{width:28px;height:28px;border-radius:50%;background:linear-gradient(180deg,var(--bd-ember),var(--bd-ember2));color:#1a0d05;font-weight:800;display:grid;place-items:center} .bd-hide{display:none!important} @media(max-width:900px){.bd-gear{grid-template-columns:1fr}.bd-growhead{display:none}.bd-grow{grid-template-columns:1fr 1fr;padding:10px;border:1px solid var(--bd-line);border-radius:10px}.bd-gslot{grid-column:1/-1;padding-top:0}.bd-grow .bd-gl{grid-column:1/-1}.bd-srow{grid-template-columns:34px 1fr}.bd-srow input:last-child{grid-column:2}} .bd-vt{display:inline-flex;align-items:center;gap:4px;font-size:13px;font-variant-numeric:tabular-nums}.bd-vt svg{width:12px;height:12px}.bd-vt.up{color:#7fd37f}.bd-vt.down{color:#e8806f}.bd-au{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.bd-foot .bd-vt{flex:none}.bd-foot em{flex:none;white-space:nowrap;font-size:12px} .bd-vote{display:flex;gap:10px;flex-wrap:wrap}.bd-vote form{margin:0} .bd-vbtn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:12px;border:1px solid var(--bd-line2);background:#0d0907;color:var(--bd-bone);font:inherit;font-weight:600;cursor:pointer} .bd-vbtn svg{width:15px;height:15px}.bd-vbtn b{font-variant-numeric:tabular-nums}.bd-vbtn.up svg{color:#7fd37f}.bd-vbtn.down svg{color:#e8806f} .bd-vbtn:not(.static):hover{border-color:var(--bd-brass)}.bd-vbtn.up.on{background:#14260f;border-color:#7fd37f;color:#bff0b0}.bd-vbtn.down.on{background:#2a120d;border-color:#e8806f;color:#f5b8ac}.bd-vbtn.static{cursor:default} .bd-vhint{margin:10px 0 0;font-size:13px}.bd-vhint a{color:var(--bd-gold)} @media(max-width:1000px){.bd-rail{grid-template-columns:repeat(5,minmax(0,1fr))}.bd-cols{grid-template-columns:1fr}.bd-trees{grid-template-columns:1fr}.bd-sort{margin-left:0}} @media(max-width:640px){.bd-rail{grid-template-columns:repeat(3,minmax(0,1fr))}.bd-dhero{padding:20px 16px}.bd-dh{flex-direction:column;align-items:flex-start}} @media (prefers-reduced-motion:reduce){.bd-cls,.bd-card,.bd-toast{transition:none}} /* ---- Tagok oldal (v0.19.0): fa, kártyák, pergamen profil ---- */ @property --pg-r{syntax:'';inherits:true;initial-value:1} body:has(dialog.pg-dlg[open]){overflow:hidden} .pg-dlg [hidden]{display:none!important} /* A gradiens betűszín csak a sormagasságig fest: a lelógó betűk (g, y) levágódnának, ezért a sormagasság és az alsó hely bőven elég. */ .tg-hero .wordmark{font-size:clamp(46px,9vw,92px);line-height:1.2;padding-bottom:.08em} .tg-hero.sect-hero .blk-hero{padding-bottom:clamp(30px,5vw,50px)} .tg-wrap{padding-bottom:80px} .tg-note{margin:0 0 26px;padding:10px 16px;border:1px solid var(--brass);background:rgba(200,163,90,.08);color:var(--bone);font-size:15px;text-align:center} .tg-empty{text-align:center;color:var(--ash);padding:30px 0} .tg-thrones{display:flex;flex-wrap:wrap;justify-content:center;gap:34px 26px} .tg-ph{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:linear-gradient(160deg,#2a1f18,#120f0e);color:var(--cc);font-family:var(--serif);font-weight:800;font-size:calc(var(--tg-hs) * .42);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)} .pg-portrait .tg-ph{aspect-ratio:1;height:auto;font-size:84px;clip-path:none;background:linear-gradient(160deg,#4a3320,#241709);color:#e9d9bc} .tg-officers.tg-notop .tg-node::before,.tg-officers.tg-notop .tg-node::after,.tg-officers.tg-notop .tg-dia.tg-t{display:none} .tg-officers.tg-notop .tg-node{padding-top:0} .tg-officers.tg-nobottom .tg-stub,.tg-officers.tg-nobottom .tg-bus,.tg-officers.tg-nobottom .tg-dia.tg-b{display:none} .tg-officers.tg-nobottom .tg-node{padding-bottom:0} /* ---- A fa: arany vonalak, narancs rombusz-csomópontok ---- */ .tg-tree{display:flex;flex-direction:column;align-items:center} .tg-link{position:relative;z-index:2;flex:none;width:2px;height:44px;background:linear-gradient(180deg,var(--brass),var(--ember-deep))} .tg-link::before,.tg-link::after,.tg-node .tg-dia{content:"";position:absolute;left:50%;width:9px;height:9px;background:var(--ember);transform:translateX(-50%) rotate(45deg);box-shadow:0 0 10px rgba(224,75,30,.75)} .tg-link::before{top:-4px}.tg-link::after{bottom:-4px} .tg-officers{display:flex;justify-content:center;gap:0 22px} .tg-officers .tg-node{position:relative;padding:28px 0} .tg-officers .tg-node::before{content:"";position:absolute;top:0;left:calc(50% - 1px);height:28px;border-left:2px solid var(--brass)} .tg-officers .tg-node::after{content:"";position:absolute;top:0;left:-11px;right:-11px;border-top:2px solid var(--brass)} .tg-node .tg-stub{position:absolute;left:calc(50% - 1px);bottom:0;height:28px;border-left:2px solid var(--brass)} .tg-node .tg-bus{position:absolute;bottom:0;left:-11px;right:-11px;border-top:2px solid var(--brass)} .tg-node .tg-dia{display:block} .tg-node .tg-dia.tg-t{top:-4px}.tg-node .tg-dia.tg-b{bottom:-4px} .tg-officers .tg-node:first-child::after,.tg-officers .tg-node:first-child .tg-bus{left:50%} .tg-officers .tg-node:last-child::after,.tg-officers .tg-node:last-child .tg-bus{right:50%} /* Egyetlen Officernél nincs elágazás: a szár és az összekötő egy vonal, csak a csatlakozásnál van rombusz (nem két egymás után). */ .tg-officers .tg-node:only-child::after,.tg-officers .tg-node:only-child .tg-bus,.tg-officers .tg-node:only-child .tg-dia{display:none} /* Guild Master: trónpanel */ .tg-throne{position:relative;padding:44px clamp(30px,8vw,96px) 28px;border:1px solid rgba(233,196,106,.45);border-top:2px solid var(--ember);background:radial-gradient(70% 120% at 50% 0%,rgba(224,75,30,.30),transparent 72%),linear-gradient(180deg,var(--surface2),var(--surface));box-shadow:0 0 70px rgba(224,75,30,.16)} .tg-throne::before{content:"";position:absolute;top:-8px;left:50%;width:14px;height:14px;transform:translateX(-50%) rotate(45deg);background:var(--ember);box-shadow:0 0 16px var(--ember),0 0 0 3px var(--obsidian)} .tg-throne::after,.tg-crowd::after{content:"";position:absolute;inset:-7px;pointer-events:none; background:linear-gradient(var(--tg-gc),var(--tg-gc)) 0 0/22px 2px no-repeat,linear-gradient(var(--tg-gc),var(--tg-gc)) 0 0/2px 22px no-repeat, linear-gradient(var(--tg-gc),var(--tg-gc)) 100% 0/22px 2px no-repeat,linear-gradient(var(--tg-gc),var(--tg-gc)) 100% 0/2px 22px no-repeat, linear-gradient(var(--tg-gc),var(--tg-gc)) 0 100%/22px 2px no-repeat,linear-gradient(var(--tg-gc),var(--tg-gc)) 0 100%/2px 22px no-repeat, linear-gradient(var(--tg-gc),var(--tg-gc)) 100% 100%/22px 2px no-repeat,linear-gradient(var(--tg-gc),var(--tg-gc)) 100% 100%/2px 22px no-repeat} .tg-throne::after{--tg-gc:#e9c46a} .tg-crowd::after{--tg-gc:var(--brass)} /* A tagok kerete */ .tg-crowd{position:relative;z-index:1;width:100%;padding:18px clamp(12px,3vw,34px) 26px;border:1px solid var(--line);background:radial-gradient(60% 40% at 50% 0%,rgba(224,75,30,.14),transparent 72%),var(--surface)} .tg-crowd .tg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:68px 18px;padding-top:56px} /* Kártyák */ .tg-card{appearance:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;width:100%;padding:0 8px 16px;border:0;background:none;color:inherit;transition:transform .18s,box-shadow .18s} .tg-card:hover{transform:translateY(-4px)} .tg-crowd .tg-card{background:var(--surface2);border:1px solid var(--line-soft);border-top:2px solid var(--cc)} .tg-crowd .tg-card:hover{box-shadow:0 12px 28px rgba(0,0,0,.45),0 0 0 1px var(--cc),0 0 28px color-mix(in srgb,var(--cc) 34%,transparent)} .tg-officers .tg-card{width:182px;border:1px solid rgba(200,163,90,.34);border-top:2px solid var(--brass);background:linear-gradient(180deg,rgba(200,163,90,.12),var(--surface2) 46%)} .tg-officers .tg-card:hover{box-shadow:0 12px 28px rgba(0,0,0,.45),0 0 26px rgba(200,163,90,.28)} .tg-throne .tg-card{width:min(320px,100%);padding:0} .tg-throne .tg-card:hover{transform:translateY(-3px)} /* Hatszögletű portré, a Class színével keretezve */ .tg-avw{--tg-hs:88px;position:relative;display:block;margin-top:-48px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.55))} .tg-av{display:block;width:var(--tg-hs);height:calc(var(--tg-hs) * 1.1547);padding:3px;background:var(--cc);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)} .tg-av img{display:block;width:100%;height:100%;object-fit:cover;background:#000;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)} .tg-officers .tg-avw{--tg-hs:108px;margin-top:20px} .tg-officers .tg-av{background:linear-gradient(135deg,#f0d28a,#8a6a2c)} .tg-throne .tg-avw{--tg-hs:152px;margin-top:0;filter:drop-shadow(0 0 22px rgba(224,75,30,.6)) drop-shadow(0 8px 12px rgba(0,0,0,.5))} .tg-throne .tg-av{background:linear-gradient(140deg,#f8dd92,#b8862f 45%,#e04b1e)} .tg-nm{font-family:var(--serif);font-weight:700;font-size:16.5px;line-height:1.2;color:var(--cc);text-shadow:0 0 16px color-mix(in srgb,var(--cc) 35%,transparent)} .tg-throne .tg-nm{font-size:23px} .tg-rk{font-size:14.5px;color:var(--ash);line-height:1.2} .tg-throne .tg-rk{padding:4px 18px;background:linear-gradient(180deg,#e0561f,#8C2408);color:#ffe8b8;font:800 16px/1.2 var(--serif);letter-spacing:.05em;border:1px solid #e9c46a;border-radius:2px;box-shadow:0 0 16px rgba(224,75,30,.5)} .tg-officers .tg-rk{padding:3px 13px;color:#f0d28a;font:700 14.5px/1.2 var(--serif);border:1px solid rgba(200,163,90,.7);border-radius:2px;background:rgba(200,163,90,.08)} .tg-live{position:absolute;left:50%;bottom:-7px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:5px;background:#C13B2E;color:#fff;font:700 11.5px/1 var(--sans);letter-spacing:.06em;padding:4px 8px 4px 7px;border-radius:3px;box-shadow:0 2px 6px rgba(0,0,0,.5);white-space:nowrap} .tg-live::before{content:"";width:6px;height:6px;border-radius:50%;background:#fff;animation:tg-pulse 1.3s infinite} @keyframes tg-pulse{50%{opacity:.25}} @media (max-width:700px){ .tg-officers{flex-wrap:wrap} .tg-officers .tg-node{padding:8px 0} .tg-officers .tg-node::before,.tg-officers .tg-node::after,.tg-node .tg-stub,.tg-node .tg-bus,.tg-node .tg-dia{display:none} .tg-link{height:30px} .tg-throne{padding:38px 22px 24px} .tg-throne .tg-avw{--tg-hs:124px} .tg-officers .tg-card{width:156px}.tg-officers .tg-avw{--tg-hs:92px} .tg-crowd .tg-grid{grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:62px 12px} .tg-avw{--tg-hs:78px;margin-top:-42px} .tg-nm{font-size:15.5px} } /* ---- Pergamen ---- */ dialog.pg-dlg{position:fixed;inset:0;margin:0;width:100vw;height:100dvh;max-width:none;max-height:none;padding:0;border:0;background:transparent;color:var(--ink);overflow:hidden} dialog.pg-dlg:not([open]){display:none} dialog.pg-dlg::backdrop{background:radial-gradient(ellipse at 50% 38%,rgba(46,22,8,.8),rgba(5,3,2,.94));transition:opacity .8s} dialog.pg-dlg.pg-closing::backdrop{opacity:0} .pg-stage{position:absolute;inset:0;display:grid;padding:12px;overflow:auto} .pg-scroll{position:relative;margin:auto;width:min(100%,860px);padding:16px 26px 22px;filter:drop-shadow(0 22px 34px rgba(0,0,0,.65));outline:none;--pg-r:1;-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat} .pg-scroll.pg-unroll{animation:pg-unroll-kf var(--pg-unroll,450ms) cubic-bezier(.22,.7,.2,1) both} @keyframes pg-unroll-kf{from{--pg-r:0}to{--pg-r:1}} .pg-roll{position:absolute;left:8px;right:8px;height:28px;border-radius:14px;z-index:4;pointer-events:none; background:linear-gradient(180deg,#4a2c12 0%,#93662f 22%,#e6c78a 50%,#93662f 78%,#3f2310 100%); box-shadow:0 3px 8px rgba(0,0,0,.5),inset 0 0 0 1px rgba(40,20,6,.5)} .pg-roll::before,.pg-roll::after{content:"";position:absolute;top:3px;bottom:3px;width:16px;border-radius:50%;background:radial-gradient(circle at 40% 40%,#f0d9a6,#7a5226 70%,#3a210d)} .pg-roll::before{left:-5px}.pg-roll::after{right:-5px} .pg-roll.pg-top{top:2px} .pg-roll.pg-bot{top:calc(2px + (100% - 38px) * var(--pg-r))} .pg-reveal{position:relative;clip-path:inset(-20px -20px calc(100% * (1 - var(--pg-r))) -20px)} .pg-paper{position:relative;overflow:auto;max-height:calc(100dvh - 76px);padding:46px clamp(20px,5vw,50px) 36px; --pg-noise:url("data:image/svg+xml;utf8,"); --pg-stain:url("data:image/svg+xml;utf8,"); background:var(--pg-noise),var(--pg-stain),radial-gradient(120% 70% at 18% 6%,rgba(255,246,218,.6),transparent 60%),linear-gradient(172deg,#ecdcb2,#ddc693 55%,#cdb078); box-shadow:inset 0 0 80px rgba(112,62,18,.6),inset 0 0 10px rgba(60,30,8,.65); scrollbar-width:thin;scrollbar-color:#8a6330 transparent} .pg-fire{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:3} .pg-sparks{position:fixed;inset:0;width:100vw;height:100dvh;pointer-events:none;z-index:9} .pg-mast{text-align:center} .pg-mast .pg-wm span{color:var(--ember)} .pg-mast .pg-wm{font-family:var(--serif);font-weight:800;font-size:clamp(36px,7vw,56px);line-height:1;letter-spacing:.075em;color:var(--ink);text-shadow:0 1px 0 rgba(255,236,196,.55)} .pg-mast .pg-orn{position:relative;height:16px;width:min(420px,82%);margin:12px auto 0;background:linear-gradient(90deg,transparent,#7a5a24 18%,#7a5a24 82%,transparent) center/100% 1.5px no-repeat} .pg-mast .pg-orn::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:10px;transform:translate(-50%,-50%) rotate(45deg);background:var(--ember-deep);outline:4px solid #dcc592} .pg-livecorner{position:absolute;top:14px;right:16px} .pg-livecorner .tg-live{position:static;transform:none} .pg-body{display:grid;grid-template-columns:232px 1fr;gap:20px 34px;margin-top:26px;align-items:start} .pg-portrait{position:relative;padding:6px;background:#f3e6c6;border:3px solid #3a2410;box-shadow:3px 4px 0 rgba(60,30,8,.35);transform:rotate(-1.4deg)} .pg-portrait img{display:block;width:100%;aspect-ratio:1;object-fit:cover;filter:sepia(.18) contrast(1.04)} .pg-info h2{font-family:var(--serif);font-weight:800;font-size:clamp(28px,4.4vw,38px);line-height:1.08;margin:2px 0 12px;color:var(--ink)} .pg-tags{display:flex;gap:8px;flex-wrap:wrap;margin:0} .pg-tag{display:inline-flex;align-items:center;gap:8px;background:#1d130c;color:#e9d9bc;padding:4px 13px 4px 10px;border-radius:3px;font:600 15.5px var(--sans)} .pg-tag i{width:10px;height:10px;border-radius:50%;background:var(--cc);box-shadow:0 0 0 1px rgba(255,255,255,.2)} .pg-tag.pg-cls{color:var(--cc)} .pg-tag.pg-race{background:transparent;color:#2a170c;box-shadow:inset 0 0 0 2px #5a3a18} .pg-rankbar{margin:0 0 16px} .pg-rb{display:inline-flex;align-items:center;gap:10px} .pg-rb svg{flex:none;display:block} .pg-tier-member .pg-rb{padding:5px 16px;background:#1d130c;color:#e9d9bc;border-radius:3px} .pg-tier-member .pg-txt{font:600 16px/1.2 var(--sans)} .pg-tier-officer .pg-rb{padding:7px 22px 7px 14px;background:linear-gradient(180deg,#3d2816,#221409);color:#f0d28a;border:2px solid #b78a3e;border-radius:3px;box-shadow:inset 0 0 0 1px rgba(255,220,150,.22),0 3px 0 rgba(60,30,8,.4)} .pg-tier-officer .pg-txt{font:800 19px/1.1 var(--serif);letter-spacing:.04em} .pg-rankbar.pg-tier-gm{filter:drop-shadow(0 0 12px rgba(224,75,30,.55)) drop-shadow(0 3px 0 rgba(60,30,8,.45))} .pg-tier-gm .pg-rb{display:inline-flex;padding:3px;background:linear-gradient(180deg,#f8dd92,#b8862f 55%,#f0cf7a);clip-path:polygon(0 0,100% 0,calc(100% - 18px) 50%,100% 100%,0 100%,18px 50%)} .pg-tier-gm .pg-rb-in{display:flex;align-items:center;gap:12px;padding:9px 44px;background:linear-gradient(180deg,#e0561f,#8C2408 58%,#561304);clip-path:polygon(0 0,100% 0,calc(100% - 16px) 50%,100% 100%,0 100%,16px 50%)} .pg-tier-gm .pg-txt{font:800 clamp(22px,3.6vw,30px)/1.1 var(--serif);letter-spacing:.07em;color:#ffe8b8;text-shadow:0 1px 0 #3a0c02,0 0 14px rgba(255,170,60,.65)} .pg-paper.pg-is-gm .pg-portrait{border-color:#b8862f;box-shadow:0 0 0 3px #3a2410,3px 4px 0 rgba(60,30,8,.35),0 0 26px rgba(224,75,30,.42)} .pg-paper.pg-is-officer .pg-portrait{border-color:#8a6a2c} .pg-paper.pg-is-gm .pg-info h2{font-size:clamp(32px,5vw,44px)} .pg-profs{list-style:none;display:flex;gap:12px;flex-wrap:wrap;padding:0;margin:16px 0 0} .pg-profs li{border:2px dashed #6b4a22;color:#4a2f14;padding:3px 13px;border-radius:3px;font:600 15px var(--sans);transform:rotate(-2deg)} .pg-profs li:nth-child(2){transform:rotate(1.6deg)} .pg-bio{grid-column:1/-1;margin:6px 0 0;white-space:pre-line;font-family:var(--serif);font-size:17px;line-height:1.72;color:#2f1c0e;max-width:70ch} .pg-bio::first-letter{float:left;font-weight:800;font-size:3.5em;line-height:.8;color:var(--ember-deep);padding:7px 9px 0 0} .pg-links{grid-column:1/-1;display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:4px 0 0} .pg-links span{font:600 15px var(--sans);color:#5a3a18;margin-right:4px} .pg-links a{display:inline-block;background:#1d130c;color:#e8c981;padding:8px 18px;border-radius:3px;font:600 15.5px var(--sans);text-decoration:none;box-shadow:0 2px 0 rgba(60,30,8,.4)} .pg-links a:hover{background:#2b1b10;color:#ffd98a} .pg-seal{display:block;margin:30px auto 0;width:78px;height:78px;border:0;cursor:pointer;color:#f7dcae;font:600 15.5px var(--sans); border-radius:52% 48% 55% 45% / 47% 56% 44% 53%; background:radial-gradient(circle at 34% 28%,#d1481f,#8C2408 56%,#4a1203); box-shadow:0 4px 10px rgba(0,0,0,.45),inset 0 -5px 9px rgba(0,0,0,.4),inset 0 3px 6px rgba(255,178,120,.4);transition:transform .15s} .pg-seal:hover{transform:scale(1.06) rotate(-3deg)} .pg-seal:focus-visible{outline-color:#2a170c} @media (max-width:640px){ .pg-body{grid-template-columns:1fr} .pg-portrait{width:200px;margin:0 auto} .pg-info{text-align:center}.pg-tags,.pg-profs{justify-content:center} .pg-scroll{padding:14px 10px 18px} .pg-livecorner{top:8px;right:8px} } @media (prefers-reduced-motion:reduce){.pg-scroll.pg-unroll{animation:none}.tg-card{transition:none}.tg-live::before{animation:none}} .pg-links a.pg-liveon{background:#8C2408;color:#ffe8b8} .pg-links a.pg-liveon::before{content:"● ";color:#ffd0b0}