/* Emberfall character select, 4 slots per server (task 7c68db6c). Sizes follow the window height (vh) so 1080p and 4K look the same. */
#prom .pm.csm{width:min(94vw,150vh);max-width:94vw;padding:clamp(14px,1.6vh,34px) clamp(22px,2.6vh,56px) clamp(10px,1.2vh,24px);gap:clamp(6px,.9vh,18px)}
#prom .pm.csm .logo img{width:clamp(44px,5vh,96px);height:clamp(44px,5vh,96px)}
#prom .pm.csm .logo h1{font-size:clamp(34px,4.6vh,92px)}
#prom .pm.csm .logo p{font-size:clamp(11px,1.25vh,24px)}
#prom .pm.csm .ver{font-size:clamp(11px,1.05vh,20px)}
#prom .cs{position:relative;width:100%;display:flex;flex-direction:column;gap:clamp(8px,1.2vh,24px)}
#prom .cs-cap{display:block;font:700 clamp(10px,1.1vh,20px) "Cinzel",serif;letter-spacing:.22em;text-transform:uppercase;color:#a88a58}
#prom .cs-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:12px;padding-bottom:clamp(6px,.8vh,14px);border-bottom:1px solid rgba(232,184,96,.28)}
#prom .cs-srv b,#prom .cs-acct b{font:700 clamp(17px,2vh,38px) "Cinzel",serif;color:#ffd98a}
#prom .cs-srv small{margin-left:.6em;font-size:clamp(13px,1.35vh,26px);color:#c8ac78}
#prom .cs-acct{text-align:right}
#prom h2.cs-title{margin:0;font:700 clamp(22px,2.7vh,52px) "Cinzel",serif;color:#ffe2a0;letter-spacing:.06em;text-shadow:0 2px 0 #2a1406}
#prom .cs-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.5vh,30px)}
#prom .cs-load{grid-column:1/-1;padding:20vh 0}
#prom .cs-slot{position:relative;display:flex;flex-direction:column;height:clamp(340px,53vh,1200px);background:linear-gradient(180deg,rgba(26,18,10,.82),rgba(8,6,3,.9));border:2px solid #5e4624;box-shadow:inset 0 0 24px rgba(0,0,0,.7);cursor:pointer;outline:none;transition:border-color .12s,box-shadow .12s}
#prom .cs-slot:hover{border-color:#a8843e}
#prom .cs-slot.sel{border-color:#f0c060;box-shadow:0 0 0 1px #f0c060,0 0 22px rgba(255,170,60,.35),inset 0 0 24px rgba(0,0,0,.5)}
#prom .cs-num{position:absolute;top:clamp(6px,.8vh,16px);left:clamp(6px,.8vh,16px);z-index:2;min-width:2.2em;padding:.12em .5em;text-align:center;font:700 clamp(12px,1.35vh,26px) "Cinzel",serif;color:#e8c47a;background:rgba(12,8,4,.8);border:1px solid #6e5428}
#prom .cs-slot.sel .cs-num{color:#1a1006;background:#e8b860;border-color:#ffe0a0}
#prom .cs-stage{position:relative;flex:1 1 auto;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 50% 78%,rgba(255,150,60,.16),rgba(0,0,0,0) 62%)}
#prom .cs-slot.sel .cs-stage{background:radial-gradient(ellipse at 50% 78%,rgba(255,160,70,.3),rgba(0,0,0,0) 64%)}
#prom .cs-pv{position:absolute;inset:0;width:100%;height:100%;display:block}
#prom .cs-ped{position:absolute;left:18%;right:18%;bottom:5%;height:5%;border-radius:50%;background:radial-gradient(ellipse,rgba(255,190,110,.22),rgba(0,0,0,0) 70%);pointer-events:none}
#prom .cs-sil{position:absolute;left:50%;bottom:6%;height:74%;transform:translateX(-50%);fill:rgba(232,184,96,.045);stroke:rgba(232,184,96,.11);stroke-width:1}
#prom .cs-plus{position:absolute;left:50%;top:50%;background:rgba(14,10,5,.75);transform:translate(-50%,-50%);width:1.6em;height:1.6em;line-height:1.5em;text-align:center;font:400 clamp(34px,4.4vh,84px) "Cinzel",serif;color:rgba(240,200,120,.55);border:2px solid rgba(240,200,120,.35);border-radius:50%}
#prom .cs-slot.empty:hover .cs-plus,#prom .cs-slot.empty.sel .cs-plus{color:#ffd98a;border-color:#e8b860}
#prom .cs-info{flex:none;display:flex;flex-direction:column;align-items:center;gap:clamp(2px,.35vh,8px);padding:clamp(8px,1.1vh,22px) 8px clamp(10px,1.3vh,26px);text-align:center;background:linear-gradient(180deg,rgba(40,28,14,.0),rgba(40,28,14,.65));border-top:1px solid rgba(232,184,96,.22)}
#prom .cs-name{font:700 clamp(18px,2.15vh,42px) "Cinzel",serif;color:#ffd98a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
#prom .cs-name.dim{color:#b49a6a}
#prom .cs-line{font-size:clamp(14px,1.55vh,30px);color:#eed6a2}
#prom .cs-info small{font-size:clamp(12px,1.25vh,24px);color:#a8916a}
#prom .cs-on{font-style:normal;color:#7ee070}
#prom .cs-new{margin-top:clamp(2px,.4vh,8px);font-size:clamp(14px,1.5vh,28px)!important;padding:.35em 1em!important}
#prom .cs-extra{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
#prom .cs-extra:empty{display:none}
#prom .cs-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}
#prom .cs-bar .plink{font-size:clamp(14px,1.45vh,28px)}
#prom .cs-r{text-align:right}
#prom .cs-play{width:clamp(220px,22vh,440px)!important;padding:.45em 0!important;font-size:clamp(20px,2.4vh,46px)!important}
#prom .cs-play.cs-create{font-size:clamp(17px,1.9vh,36px)!important}
#prom .plink:disabled{opacity:.35;cursor:default;text-decoration:none}
#prom .cs-modal{position:absolute;inset:-8px;z-index:5;display:flex;align-items:center;justify-content:center;background:rgba(6,4,2,.72)}
#prom .cs-dlg{width:min(560px,60vh,90%);display:flex;flex-direction:column;gap:10px;padding:clamp(16px,2vh,36px) clamp(20px,2.4vh,44px);background:#1e150d;border:2px solid #a8432a;box-shadow:0 8px 30px rgba(0,0,0,.8)}
#prom .cs-dlg h3{margin:0;text-align:center;font:700 clamp(19px,2.2vh,40px) "Cinzel",serif;color:#ffb48a}
#prom .cs-dlg p{margin:0;font-size:clamp(14px,1.5vh,28px);color:#e8cf98;text-align:center}
#prom .cs-dlg label{font-size:clamp(14px,1.45vh,26px)}
#prom .cs-dlg input{font-size:clamp(16px,1.7vh,32px)}
#prom .cs-dmsg{min-height:1.2em;text-align:center;color:#ff8a6a;font-size:clamp(13px,1.35vh,24px)}
#prom .cs-danger{background:#6a1a10!important}
#prom .cs-danger:disabled{filter:grayscale(.8) brightness(.6)}

/* creator attribute rows: one fixed size, highlight by colour only (Tyler 6:59 AM Oct 20) */
body.csat #pmattr .pmat{grid-template-rows:auto;height:40px;box-sizing:border-box;padding:0 8px;margin:4px 0;transition:none;transform:none!important}
body.csat #pmattr .pmat .pmad,body.csat #pmattr .pmat:hover .pmad{display:none!important}
body.csat #pmattr .pmat:hover{border-color:#e8b860;background:rgba(70,48,18,.6);box-shadow:inset 0 0 0 1px rgba(232,184,96,.5)}
body.csat #pmattr .pmat button{width:30px!important;height:28px!important;min-width:30px;padding:0!important;margin:0!important;border-width:2px!important;box-sizing:border-box;transform:none!important;flex:none}
body.csat #pmattr .pmat button:hover:not(:disabled){filter:brightness(1.35)}
body.csat #pmattr .pmav{width:38px;font-variant-numeric:tabular-nums}
body.csat #pmattr .pmhint{display:none}
body.csat #pmattr,body.csat #csatinfo{width:440px;max-width:100%;box-sizing:border-box}
body.csat #pmattr .swl{display:flex;justify-content:space-between;align-items:baseline;gap:12px}
body.csat #pmattr .pmleft{float:none}
#csatinfo{height:4.4em;box-sizing:border-box;margin:0 0 8px;padding:.35em .6em;overflow:hidden;font-size:13px;line-height:1.3;color:#e2cc98;background:rgba(10,7,4,.45);border:1px solid #4a3820}
#csatinfo b{color:#ffd98a}#csatinfo .dim{color:#a8916a}