/* Identity room geometry follows the supplied 4-by-2 OL screenshots. */
.ll2-shell.ll2-room-bg, .ll2-shell.ll2-identity{background:#59412c url('/sanguosha/assets/identity/room-bg.webp') center/cover;color:#e9d7ad}
.ll2-shell.ll2-identity .id-header{height:8.5cqh;min-height:36px;background:linear-gradient(100deg,#907255b0,#3d2b1da0);padding:0 7%;border-bottom:2px solid #3a271b;flex:none}
.ll2-shell.ll2-identity .id-header>b{font:clamp(20px,4.9cqh,46px) 'STKaiti','KaiTi',serif;letter-spacing:.15em;color:#f5deb0;text-shadow:2px 3px #24170d}
.ll2-shell.ll2-identity .id-header>span{font-size:clamp(11px,2.6cqh,24px);padding:8px 14px;background:#34291c50;border-radius:8px}
.ll2-shell.ll2-identity .id-header nav{margin-left:auto}
.ll2-shell.ll2-identity .id-header nav>span{white-space:nowrap}
.ll2-identity .id-hall{padding:4%;gap:3%;grid-template-columns:minmax(260px,35%) 1fr;max-width:none}
.ll2-identity .raid-panel{background:#302319d9;border:2px solid #92724d}
.id-room{flex:1;min-height:0;display:grid;grid-template-columns:clamp(54px,6vw,70px) 1fr clamp(200px,22vw,270px);grid-template-rows:minmax(0,1fr) 6cqh;gap:1% 1.5%;padding:2cqh 5% 1cqh 5%;position:relative}
.id-left{display:flex;align-items:center;justify-content:center;padding:0}
.id-add,button.id-add,button.id-add:disabled,button.id-add:hover{padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important;outline:none!important;cursor:pointer}
.id-add img{width:52px;height:auto;display:block;filter:drop-shadow(0 2px 5px rgba(0,0,0,0.6));transition:transform .15s,opacity .15s}
.id-add:hover:not(:disabled) img{transform:scale(1.08)}
.id-add:disabled img{opacity:.45;filter:grayscale(.8);cursor:not-allowed}
.id-seats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:1.4cqh .6cqw;min-height:0}
.id-seat{position:relative;background:url('/sanguosha/assets/identity/empty-seat.webp') center/100% 100%;border-radius:.5cqh;min-width:0;min-height:0;display:flex;align-items:center;flex-direction:column}
.id-seat-name{font:clamp(11px,2.2cqh,22px) 'STKaiti','KaiTi',serif;color:#a5d651;margin-top:1.3cqh;text-align:center;width:86%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.id-seat.ai .id-seat-name{color:#e8a343}
.id-seat-number{position:absolute;bottom:1.4cqh;left:1.2cqh;font-size:clamp(8px,1.35cqh,13px);color:#af9875;z-index:1}
.id-avatar{width:65%;height:69%;object-fit:contain;margin-top:4.4cqh;border-radius:.5cqh}
.id-seat.human .id-avatar{margin-top:4.4cqh}
.id-ready{position:absolute;top:8.8cqh;right:-.3cqw;background:linear-gradient(#62813b,#2a570f);border:1px solid #84944e;padding:.7cqh 1cqh;font:clamp(11px,2.4cqh,24px) 'STKaiti','KaiTi',serif;box-shadow:0 2px 4px #241508}
.id-ready.host{background:linear-gradient(#b65a33,#8e3020);border-color:#a5774e}
.id-ready.waiting{background:#594b38;color:#bdb19c}
.id-remove{position:absolute;right:.7cqh;top:1cqh;font-size:clamp(14px,2.7cqh,26px);border:0;background:transparent;min-width:0;padding:0 3px;height:auto;color:#c6b775;z-index:3}
.id-empty{position:absolute;inset:0;border:0;background:transparent;min-width:0;width:100%;height:100%;padding:0}
.id-seat-menu{position:absolute;inset:3cqh 17% auto;display:flex;flex-direction:column;gap:1cqh;z-index:4}
.id-seat-menu button,.id-point-action,.id-prepare,.id-leave,.id-system button{background:linear-gradient(#844b2c,#543521);border:1px solid #a87847;color:#ebd4a6;border-radius:4px;font:clamp(11px,2.6cqh,26px) 'STKaiti','KaiTi',serif;padding:.8cqh .6cqw;min-width:0;box-shadow:0 2px 5px #1c130d}
.id-right{display:flex;flex-direction:column;align-items:center;min-height:0;gap:1.7cqh}
.id-points{width:100%;padding:2.5cqh 2cqh 1.4cqh;background:#2a1c16bb;display:flex;flex-direction:column;align-items:center;gap:1.2cqh;border-radius:4px}
.id-roles{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:1cqh}
.ll2-identity .id-roles>button{aspect-ratio:1.06;position:relative;background-size:cover;background-position:center 12%;border:2px solid #c5ac76;border-radius:4px;min-width:0;padding:0;height:auto;overflow:hidden}
.id-roles b{position:absolute;left:4px;bottom:1.8cqh;font:clamp(15px,3.4cqh,32px) 'STKaiti','KaiTi',serif;text-shadow:2px 2px #21160d}
.id-roles small{position:absolute;bottom:0;left:0;right:0;background:#1b110dc9;font-size:clamp(8px,1.35cqh,13px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.id-role-0{color:#ff7373}.id-role-1{color:#efc55b}.id-role-2{color:#89c86d}.id-role-3{color:#69bade}
.id-point-action{font-size:clamp(13px,3cqh,30px);letter-spacing:.1em}
.id-start{width:105%;max-height:30cqh;margin-top:auto;border:0;background:transparent;min-width:0;padding:0;height:auto}
.id-start img{width:100%;height:auto;display:block}.id-start:disabled{filter:grayscale(1);opacity:.75!important}
.id-start-note{font-size:clamp(9px,1.5cqh,14px);color:#d7be8b;text-align:center}
.id-prepare{margin-top:auto}.id-leave{font-size:clamp(10px,1.8cqh,17px)!important;margin-top:auto}
.id-chat{grid-column:2/4;display:flex;align-items:center;gap:2%;min-height:0}
.id-chat-log{flex:1;height:100%;overflow:auto;background:#251b14b0;padding:3px 10px;border:1px solid #6e5636;font-size:clamp(9px,1.65cqh,16px)}
.id-chat-log p{margin:0;line-height:1.5}.id-chat-log b{color:#d8b880}.id-chat-send{display:flex;gap:4px;width:34%}
.id-chat input{width:100%;min-width:0;background:#2b1b15b0;border:1px solid #94764b;color:#ead7b3;padding:5px 8px;font-size:clamp(10px,1.6cqh,15px)}
.id-chat button{min-width:0;font-size:clamp(10px,1.6cqh,15px);padding:4px 7px}
.id-system article{width:60%;background:linear-gradient(#5b3b29,#715239);border:3px solid #af854e;text-align:center;padding:3cqh 3cqw;max-width:none}
.id-system h2{font:4cqh 'STKaiti','KaiTi',serif}.id-system p{border:2px solid #68492d;background:#32221870;padding:8cqh 2cqw;font:3cqh 'STKaiti','KaiTi',serif}
.id-system .ll2-buttons{justify-content:center;gap:4cqw}

.id-seats.seats-3{display:flex;justify-content:center;align-items:center;gap:clamp(16px,3cqw,46px);min-height:0;height:100%;padding:0 1%}
.id-seats.seats-3 .id-seat{width:clamp(145px,17cqw,200px);height:clamp(200px,44cqh,276px);aspect-ratio:281/379;flex:none;margin:0}
.id-seats.seats-3 .id-avatar{width:70%;height:68%;object-fit:contain;margin-top:clamp(8px,2cqh,14px)}
.id-seats.seats-3 .id-seat-name{font:clamp(12px,2cqh,18px) 'STKaiti','KaiTi',serif;margin-top:clamp(6px,1.2cqh,11px)}
.id-seats.seats-3 .id-ready{top:clamp(16px,4cqh,26px);right:-6px;font-size:clamp(10px,1.5cqh,14px);padding:3px 6px}
.id-seats.seats-3 .id-seat-menu{inset:clamp(14px,3cqh,22px) 8% auto;gap:5px}

.id-mode-card{width:100%;padding:2.2cqh 1.8cqh;background:#2a1c16bb;display:flex;flex-direction:column;align-items:center;gap:1.2cqh;border-radius:4px;border:1px solid #735336}
.id-mode-card h3{margin:0;font:clamp(16px,3.2cqh,30px) 'STKaiti','KaiTi',serif;color:#f5deb0;text-shadow:1px 2px #22140a}
.id-mode-tip{margin:0;font-size:clamp(10px,1.7cqh,15px);color:#d1ba95;line-height:1.5;text-align:center}
.id-room-code{display:flex;align-items:center;gap:8px;background:#1a110bb0;padding:4px 10px;border:1px solid #8e6d45;border-radius:4px;margin-top:2px}
.id-room-code span{font-size:clamp(10px,1.5cqh,14px);color:#b39b78}
.id-room-code b{font-size:clamp(13px,2.2cqh,20px);color:#f7dfaf;letter-spacing:1px}
.id-room-code button{padding:2px 8px;font-size:clamp(10px,1.5cqh,14px);min-width:0;height:auto;background:linear-gradient(#844b2c,#543521);border:1px solid #a87847;color:#ebd4a6;border-radius:3px}
.id-draft{overflow:auto;flex:1;min-height:0}.id-draft-progress{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:16px}.id-draft-progress span{background:#312119a0;padding:6px 8px}
.ll2-identity .ll2-role.id-role-0{background:#8e3527}.ll2-identity .ll2-role.id-role-1{background:#806722}.ll2-identity .ll2-role.id-role-2{background:#416c35}.ll2-identity .ll2-role.id-role-3{background:#2d586b}
.ll2-identity .id-board{background:#292b35 url('/sanguosha/assets/raid/ol-table.jpg') center/cover}
@media(max-height:500px){.id-room{padding:1.5cqh 5% 1cqh 5%;grid-template-columns:6% 68% 23%;gap:1%}.ll2-shell.ll2-identity .id-header{padding:0 3%}.id-points{padding:1.5cqh}.id-hall{overflow:auto}}
@media(orientation:portrait){.id-room{grid-template-columns:7% 69% 22%;padding:2% 1%;gap:1%}.id-avatar{height:55%;margin-top:4cqh}.id-seat-number{font-size:7px}.ll2-shell.ll2-identity .id-header{padding:0 2%;flex-wrap:wrap}.id-header nav{gap:1px!important}.ll2-identity .id-hall{grid-template-columns:1fr}.id-chat-send{width:40%}.id-chat-log{font-size:9px}.id-seats.seats-3 .id-seat{width:96%;height:95%}.id-seats.seats-3 .id-avatar{height:52%;margin-top:3cqh}.id-seats.seats-3 .id-seat-name{font-size:clamp(9px,1.8cqh,16px);margin-top:1cqh}.id-seats.seats-3 .id-ready{top:8cqh;padding:.4cqh .6cqh;font-size:9px}}

.ll2-shell.ll2-identity .id-header button{background:linear-gradient(#785436,#4c3524);border-color:#ae8753;color:#ead7b1;height:4cqh;min-height:24px}
.ll2-shell.ll2-identity{background:linear-gradient(120deg,#8f7659,#61442d 50%,#453321)}
/* Point selection follows the OL portrait grid and four identity slots. */
.ll2-identity .id-point-modal{padding:4cqh 8cqw;background:#090704b3}
.ll2-identity .id-point-modal article{position:relative;width:100%;max-width:1400px;height:90cqh;max-height:none;padding:0 2.4cqw 1cqh;display:flex;flex-direction:column;overflow:visible;border:2px solid #97704a;border-radius:.6cqh;background:linear-gradient(#4d3322eF,#674a32f5);box-shadow:0 0 0 3px #291d13,0 1cqh 3cqh #0009;color:#dfc798;font-family:'STKaiti','KaiTi',serif}
.id-point-heading{height:5.6cqh;flex:none;display:flex;justify-content:center;align-items:center;border-bottom:1px solid #9c734666}
.ll2-identity .id-point-heading h2{margin:0;position:relative;top:-1cqh;padding:.5cqh 6cqw;font-size:3.6cqh;letter-spacing:.5em;text-indent:.5em;color:#f3d4a0;background:linear-gradient(#684829,#3b2518);border:1px solid #957047;border-radius:2cqh 2cqh 0 0;text-shadow:1px 2px #251308}
.ll2-identity .id-point-heading button{position:absolute;top:.6cqh;right:1cqw;width:3cqh;height:3cqh;min-width:0;padding:0;border:0;background:transparent;color:#e8cd98;font-size:3.5cqh}
.id-point-toolbar{display:flex;align-items:stretch;height:8cqh;flex:none;gap:1cqw}
.id-point-toolbar nav{display:grid;grid-template-columns:repeat(5,1fr);flex:1;min-width:0}
.ll2-identity .id-point-toolbar nav button{height:100%;min-width:0;padding:0 .4cqw;background:linear-gradient(#563a2680,#35231750);border:0;border-right:1px solid #80604280;border-radius:0;font:3.1cqh 'STKaiti','KaiTi',serif;white-space:nowrap;color:#bca071;text-shadow:1px 1px #2c1a0c}
.ll2-identity .id-point-toolbar nav button.active{color:#ffe6b2;background:linear-gradient(#84644466,#2d1c1044);box-shadow:inset 0 2px #b58f5a66}
.id-point-search{display:flex;align-items:center;flex:0 0 19%;margin:1.1cqh 0;background:#312016aa;border:1px solid #61442d;border-radius:.5cqh;min-width:0;padding:0 1cqw}
.ll2-identity .id-point-search input{width:100%;min-width:0;height:100%;border:0;background:transparent;color:#f3ddaf;outline:none;font:2.5cqh 'STKaiti','KaiTi',serif;padding:0}
.id-point-search input::placeholder{color:#b49a7a}.id-point-search span{font:5cqh serif;color:#ddbd80;line-height:1}
.id-point-generals{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));grid-auto-rows:min-content;align-content:start;justify-items:center;gap:2.3cqh 2.2cqw;flex:1;min-height:0;overflow:auto;padding:3cqh 2cqw;background:#291c1480;border:1px solid #8b65433f;scrollbar-color:#95714d #342317;scrollbar-width:thin}
.ll2-identity .id-point-generals button{position:relative;aspect-ratio:1;min-width:0;width:100%;max-width:13cqh;height:auto;min-height:0;padding:0;background-size:cover;background-position:center 15%;border:2px solid #94643c;border-radius:.3cqh;box-shadow:inset 0 0 0 1px #d19a55,0 2px 4px #1e130a;overflow:hidden;outline:0}
.ll2-identity .id-point-generals button.chosen{border-color:#ffdfa2;box-shadow:0 0 1cqh #f0cc7e,inset 0 0 0 2px #f5ce83}
.id-point-generals b,.id-point-slot-card b{position:absolute;bottom:0;left:0;right:0;padding:.2cqh 1px;background:#21160ddb;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#f4dfb3;font:2.05cqh 'STKaiti','KaiTi',serif;text-shadow:1px 1px #160b04}
.id-point-empty{grid-column:1/-1;margin:3cqh;font-size:2.6cqh}
.id-point-bottom{display:flex;align-items:center;gap:2.5cqw;flex:none;min-height:22cqh;padding-top:2cqh}
.id-point-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:2.6cqw;flex:1;max-width:75%;padding:2cqh 2.5cqw 1cqh;border:2px solid #392617;box-shadow:inset 0 0 0 1px #866341;background:#2c1b1270}
.id-point-slot{position:relative;display:flex;flex-direction:column;align-items:center;gap:1cqh;min-width:0}
.ll2-identity .id-point-slot-card{position:relative;aspect-ratio:1;width:100%;max-width:13.3cqh;height:auto;min-width:0;min-height:0;padding:0;background-size:cover;background-position:center 15%;border:2px solid #914532;box-shadow:inset 0 0 0 1px #c88b55;border-radius:.2cqh}
.ll2-identity .id-point-slot.active .id-point-slot-card{border-color:#ffe0a1;box-shadow:0 0 1cqh #e6c181,inset 0 0 0 1px #cba057}
.id-point-slot>span{font-size:2.5cqh;letter-spacing:.25em;text-indent:.25em;color:#e7cea0}
.ll2-identity .id-point-remove{position:absolute;right:calc(50% - 7.8cqh);top:-1.4cqh;width:3.3cqh;height:3.3cqh;min-width:0;min-height:0;padding:0;border:1px solid #694d31;border-radius:50%;background:#332719;color:#dac18c;font:3.6cqh 'STKaiti','KaiTi',serif;line-height:1}
.id-point-status{flex:0 0 21%;display:flex;flex-direction:column;gap:1.8cqh;font-size:2.8cqh;white-space:nowrap}
.id-point-status b{font-weight:normal}.id-point-status i{display:inline-block;padding:.1cqh 1.2cqw;border-radius:2cqh;background:linear-gradient(#b58d50,#674725);color:#fce4ad;border:1px solid #a48050;font-size:2.6cqh;font-style:normal}.id-point-status strong{font-size:3cqh;color:#f3d59f;font-weight:normal}.id-point-status small{font-size:1.9cqh;color:#c8ac81}
.ll2-identity .id-point-tip{margin:.8cqh 0 0;text-align:center;flex:none;font-size:1.7cqh;color:#cab188}
@media(orientation:portrait){.ll2-identity .id-point-modal{padding:3cqh 2cqw}.id-point-generals{grid-template-columns:repeat(4,minmax(0,1fr));gap:1cqh}.id-point-toolbar{height:auto;flex-wrap:wrap}.id-point-toolbar nav{flex-basis:100%;height:6cqh}.id-point-search{flex-basis:100%;height:4cqh}.id-point-slots{gap:2cqw;padding:1cqh 1cqw;max-width:100%}.id-point-status{font-size:1.8cqh;flex-basis:24%}.id-point-slot>span{font-size:1.8cqh}.ll2-identity .id-point-remove{right:-.6cqw;top:-.7cqh;width:2.4cqh;height:2.4cqh;font-size:2.6cqh}.id-point-bottom{gap:1cqw;min-height:16cqh}}

/* Identity guesses are private controls alongside the portrait, not attack targets. */
.ll2-shell.ll2-identity .raid-unit .ll2-role.id-guess-button{position:absolute;z-index:6;min-width:0;min-height:30px;height:auto;width:2.8em;padding:4px 2px;cursor:pointer;pointer-events:auto;color:#ffe6b4}
.ll2-identity .id-guess-button.guessed{border-style:dashed}
.ll2-identity .id-guess-button.guessed::after{content:'?';position:absolute;right:-4px;bottom:-4px;border:1px solid #be9e64;border-radius:50%;background:#241c16;font:10px/13px sans-serif;width:13px;height:13px;color:#ffe5aa}
.ll2-shell.ll2-identity .raid-unit .raid-nick.id-player-name{display:block;position:absolute;bottom:-2.8cqh;left:0;right:0;width:100%;padding:0 2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;color:#e9e3d1;font:clamp(10px,1.6cqh,15px)/1.3 sans-serif;text-shadow:0 1px 2px #000}
.ll2-shell.ll2-identity .raid-unit.mine{padding-bottom:2.2cqh}
.ll2-shell.ll2-identity .raid-unit.mine .raid-nick.id-player-name{bottom:0}
.ll2-identity .id-guess-modal article{width:min(620px,85%);max-height:85cqh;overflow:auto;background:#493321;border:2px solid #a48152;color:#ecd5aa}
.ll2-identity .id-guess-modal h2{padding-right:24px;font-size:clamp(18px,3cqh,28px)}
.ll2-identity .id-guess-modal p{font-size:clamp(12px,2cqh,18px);line-height:1.6}
.ll2-identity .id-guess-modal .ll2-buttons{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.ll2-identity .id-guess-modal [data-id-guess-pick]{min-width:0;min-height:40px;background:#322419;border:1px solid #a48152;font-size:clamp(14px,2.4cqh,22px);padding:8px 4px}
.ll2-identity .id-guess-modal [data-id-guess-pick].chosen{border-color:#ffe0a1;box-shadow:0 0 7px #e6c181}
@media(max-height:500px){.ll2-identity .id-guess-modal .ll2-buttons{gap:6px}.ll2-identity .id-guess-modal [data-id-guess-pick]{min-height:36px}.ll2-shell.ll2-identity .raid-unit .ll2-role.id-guess-button{min-height:26px}}
