:root{--bg:#060e18;--bg2:#0e1724;--panel:#101d2c;--border:#536271;--purple:#a08ac0;--cyan:#a4d6e4;--text:#edf1f5;--muted:#b3c1cf;}
#wrap{background:#050b12}canvas{box-shadow:none}.brand{display:none}
.overlay{background:rgba(5,12,22,.91);backdrop-filter:blur(8px);gap:16px;touch-action:pan-y}
h1{font-family:Georgia,'Times New Roman',serif;font-weight:400;font-size:clamp(42px,6vw,94px);background:none;-webkit-text-fill-color:#f4ead5;letter-spacing:3px;text-shadow:0 4px 22px #000;animation:none;line-height:.95}
h1 small{font-family:system-ui,sans-serif;font-weight:400;font-size:11px;letter-spacing:6px;margin-top:19px;color:#c2d4e0;-webkit-text-fill-color:#c2d4e0}
#startScreen{align-items:flex-start;text-align:left;padding:clamp(30px,6vw,100px);background:linear-gradient(90deg,rgba(3,10,19,.97),rgba(3,10,19,.74) 43%,rgba(3,10,19,.04) 83%),url('assets/cathedral.webp') center/cover;gap:23px;backdrop-filter:none}
#startScreen h1{max-width:800px;margin-bottom:9px}#startScreen .sub{max-width:540px;color:#c3d0df;font-family:system-ui;font-size:14px;line-height:1.7}
#startScreen>div{justify-content:flex-start!important;max-width:620px}#startScreen .keys{max-width:580px;justify-content:flex-start;gap:8px 15px;letter-spacing:0;font-family:system-ui;font-size:10px;color:#b3c1cf}
#startScreen .keys b{font-family:system-ui;font-size:10px;border-radius:2px;padding:3px 6px;background:#11223296;border-color:#8097ac55}
#startScreen>.sub:last-of-type{font-size:12px!important;max-width:510px}
.legend{gap:17px}.legend span{font:11px system-ui;color:#c7d3df}.dot{width:5px;height:5px;box-shadow:none}
.btn{background:linear-gradient(135deg,#c8e1e9,#8fb7c8);color:#0a1825;border-color:#d5e9ed;border-radius:2px;box-shadow:0 5px 28px #0004;font:600 11px system-ui;letter-spacing:1.2px;padding:16px 25px;transition:background .2s,transform .15s}
.btn:hover{filter:brightness(1.12);transform:translateY(-1px)}.btn:focus-visible,.perk-card:focus-visible{outline:2px solid #f3d69a;outline-offset:4px}.btn.ghost{background:#0a1727a8;border-color:#7990a055;color:#d4dde7;border-radius:2px;font:500 10px system-ui;letter-spacing:.8px;padding:12px 17px;box-shadow:none}
#startBtn{min-width:236px;padding:18px 25px}.perk-card{border-radius:3px;background:#122033;border-color:#8194a166}.perk-card .pk-name{font-family:system-ui;font-size:14px;letter-spacing:.5px}.perk-card .pk-desc{font-family:system-ui;font-size:12px;line-height:1.6}.shop-row,.ach-row{border-radius:3px}.shop-name{font-family:system-ui}.set-btn{font-size:11px}
#artStatus{position:fixed;right:18px;bottom:15px;z-index:40;background:#0a1727d9;color:#d5e1e7;font:11px system-ui;padding:9px 13px;border:1px solid #677b8955}#artStatus[hidden]{display:none}
#takeWeapon{position:absolute;right:25%;bottom:17%;z-index:18;font-size:10px;padding:13px}#takeWeapon[hidden]{display:none}
dialog#codex{margin:auto;width:min(1000px,94vw);max-height:90dvh;overflow:auto;background:#0a1522;color:#e3eaf1;border:1px solid #6f8598;padding:32px;touch-action:pan-y;font:13px/1.7 system-ui;user-select:text}dialog#codex::backdrop{background:#020610df}#codex h2{font:32px Georgia;margin:7px 0 18px;color:#ecdcbf}#closeCodex{float:right}#codex p{color:#abbccc;margin:14px 0;max-width:850px}#codexStats{border-top:1px solid #314356;border-bottom:1px solid #314356;margin:20px 0;padding:4px 0}.table-scroll{overflow:auto;touch-action:pan-x pan-y}#codex table{border-collapse:collapse;width:100%;min-width:730px;font-size:11px;text-align:left}#codex th{color:#c4d4df;font-weight:500;font-size:10px;letter-spacing:.5px;padding:12px 10px;border-bottom:1px solid #526779}#codex td{padding:11px 10px;border-bottom:1px solid #283b4b}#codex .codex-note{font-size:11px}
#touch .tbtn{background:#101e30cc;border-color:#98afbf88;backdrop-filter:none;box-shadow:none}#touch .tbtn.atk{background:#365264bb;border-color:#b5dfe9;color:#e5f7ff}
@media(max-height:700px) and (min-width:800px){#startScreen{padding:30px 6vw;gap:16px}#startScreen h1{font-size:64px}#startScreen>.sub:last-of-type{display:none}}
@media(max-width:700px){#startScreen{padding:32px 24px;justify-content:flex-start;background-position:60% center;gap:19px}#startScreen h1{font-size:44px;margin-top:16px}#startScreen .sub{font-size:12px;max-width:440px}#startScreen .keys{display:none}#startScreen>.sub:last-of-type{font-size:11px!important}#startBtn{min-width:185px}#startScreen .btn.ghost{font-size:9px;padding:11px}#codex{padding:20px!important}.overlay{justify-content:flex-start;padding-top:30px}.overlay h1{font-size:36px}#perkRow{gap:10px}.perk-card{width:min(180px,85vw)}}
@media(max-height:480px){#startScreen{padding:22px 35px;gap:12px;justify-content:flex-start}#startScreen h1{font-size:45px;margin:0}#startScreen h1 small{margin-top:8px}#startScreen .sub{font-size:11px;line-height:1.4;max-width:410px}#startScreen .keys,#startScreen>.sub:last-of-type,#startScreen .legend{display:none}#startScreen .btn{padding:11px 17px;font-size:9px}.overlay{justify-content:flex-start;gap:12px}.tbtn{width:49px;height:49px}.tbtn.small{width:39px;height:39px}.tbtn.atk{width:59px;height:59px}.pad{gap:6px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* 2.1 — a full-height portrait game, with controls outside the playfield. */
html,body{overscroll-behavior:none;touch-action:manipulation}
#wrap{height:var(--app-height,100dvh);bottom:auto}
#safeArea{position:fixed;visibility:hidden;pointer-events:none;padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) env(safe-area-inset-bottom,0px) env(safe-area-inset-left,0px)}
#game,#touch{touch-action:none;-webkit-touch-callout:none}
[hidden]{display:none!important}
.overlay{flex-shrink:0;padding-bottom:max(24px,env(safe-area-inset-bottom));scroll-padding:24px}
.overlay>*{flex-shrink:0}
.btn,.cta-app,.shop-buy{min-height:44px;touch-action:manipulation}
.menu-primary,.menu-secondary{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
#startScreen{gap:18px;padding-top:42px;padding-bottom:42px}
#brandLogo{display:block;width:300px;max-width:65vw;height:auto;object-fit:contain;filter:drop-shadow(0 4px 12px #03091780);margin:0 0 4px}
.mobile-guide{display:none;font:13px/1.65 system-ui;color:#c3d3e0;max-width:440px}
.mobile-guide span{font-size:11px;color:#98b0c2}
.touch-enabled .mobile-guide{display:block}
.touch-enabled #startScreen .keys{display:none}
.touch-enabled #abilScreen>.keys{display:none}

/* Compact keyboard/touch reference on the home screen. It stays closed until
   requested so the portrait menu keeps its focus on starting a run. */
.controls-guide{width:min(580px,100%);border:1px solid #8097ac55;background:#0a1727b8;color:#c8d5e0;font:11px/1.45 system-ui;}
.controls-guide summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:42px;padding:10px 13px;cursor:pointer;list-style:none;color:#e7edf2;font-weight:650;letter-spacing:1.1px;}
.controls-guide summary::-webkit-details-marker{display:none}
.controls-guide summary::after{content:'+';font-size:18px;font-weight:400;line-height:1;color:#a4d6e4}
.controls-guide[open] summary{border-bottom:1px solid #8097ac3d}
.controls-guide[open] summary::after{content:'−'}
.controls-guide summary small{margin-left:auto;color:#91a9ba;font-size:10px;letter-spacing:.3px;font-weight:400}
.guide-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px 10px;padding:11px 13px 13px;text-align:left}
.guide-item{display:flex;flex-direction:column;gap:3px;min-width:0;padding:6px 7px;background:#11223273;border:1px solid #8097ac22}
.guide-item strong{font-size:10px;letter-spacing:.8px;color:#e5d8bf;font-weight:650}
.guide-item span{color:#b4c5d2;font-size:10px;line-height:1.45}
.guide-item kbd{display:inline-block;min-width:18px;margin-right:3px;padding:1px 4px;border:1px solid #8097ac66;border-radius:2px;background:#07121f;color:#edf1f5;text-align:center;font:600 10px/15px system-ui;vertical-align:baseline}
.guide-item.touch-item{grid-column:1/-1;background:#182b3b8c;border-color:#a4d6e433}

#portraitHud{position:absolute;top:0;left:0;right:0;height:var(--hud-h);z-index:10;padding:calc(9px + env(safe-area-inset-top,0px)) 12px 8px;background:linear-gradient(#071322f5 70%,#071322e8);font-family:system-ui;pointer-events:none;border-bottom:1px solid #60788a42}
.realm-line{display:flex;align-items:center;justify-content:space-between;padding-right:48px;gap:8px;font-size:10px;letter-spacing:1px;line-height:16px;color:#d4deeb}
#realmLabel{color:#e9d7b7;white-space:nowrap}
#realmProgress{font-size:10px;letter-spacing:.4px;color:#abd6e1;white-space:nowrap}
#realmName{color:#8ca9be;font-size:10px;line-height:16px;margin-bottom:9px;max-width:calc(100% - 46px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.health-line{display:flex;align-items:center;gap:8px;font-size:11px;line-height:17px}
.health-caption{font-size:8px;letter-spacing:.6px;color:#cf9ead}
.health-track{height:9px;background:#020a13;flex:1;border:1px solid #b770852f;overflow:hidden}
.health-track i,.xp-track i{display:block;width:100%;height:100%;transform-origin:left center;background:linear-gradient(90deg,#ae506a,#e59da0)}
.health-track i.low{background:#fc665f}
#hpValue{font-size:10px;font-weight:600;color:#eedfe5;min-width:51px;text-align:right}
#rankValue{font-size:9px;white-space:nowrap;letter-spacing:.4px}
.xp-track{height:2px;background:#152a3e;margin-top:4px;overflow:hidden}
.xp-track i{background:#adbedc}
.portrait-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:6px;font-size:10px;line-height:15px}
.portrait-stats span{color:var(--stat);letter-spacing:.7px}.portrait-stats b{color:#e7ecf5;font-weight:500;font-size:11px;margin-left:5px;letter-spacing:0}
#combatNotice{position:absolute;top:calc(var(--hud-h) + 8px);left:12px;right:12px;font-size:10px;letter-spacing:.5px;color:#eed39e;text-align:center;text-shadow:0 1px 5px #000}
#combatNotice:empty{display:none}
#portraitWeapon{position:absolute;left:0;right:0;bottom:var(--control-h);height:51px;z-index:11;display:flex;align-items:center;gap:12px;padding:6px 16px;background:linear-gradient(#07121f94,#07121ff5);border-top:1px solid #7895ab24;pointer-events:none;font-family:system-ui}
#weaponIcon{font-size:25px;width:30px;text-align:center;flex-shrink:0}
#portraitWeapon>div{min-width:0}
#weaponName{display:block;font-size:11px;color:#e9dcc5;font-weight:500;letter-spacing:.6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:20px}
#weaponInfo{display:block;font-size:10px;color:#b1cadb;letter-spacing:.2px;line-height:16px}
.near-weapon.portrait #portraitWeapon{visibility:hidden}
#takeWeapon{display:flex;flex-direction:column;gap:5px;text-align:left;letter-spacing:.25px;padding:8px 14px}
.pickup-title{font-size:11px;font-weight:650}.pickup-detail{font-size:10px;font-weight:500}
.portrait #takeWeapon{left:10px;right:10px;bottom:calc(var(--control-h) + 3px);height:47px;border-radius:8px;background:#badbe4;color:#092034;max-width:none;width:auto}

#mPause{position:absolute;top:calc(8px + env(safe-area-inset-top,0px));right:calc(10px + env(safe-area-inset-right,0px));display:none;align-items:center;justify-content:center;width:44px;height:44px;z-index:16;border:1px solid #8297ae60;border-radius:12px;background:#0b1b2bd9;color:#dce9f1;font:600 19px system-ui;touch-action:manipulation}
#touch .tbtn{cursor:pointer;position:relative;flex-direction:column;gap:3px;border:1px solid #98afbf6b;color:#d5e6f0;font-family:system-ui;font-weight:500;line-height:1;box-shadow:inset 0 1px 0 #fff1;transition:transform 60ms,background 60ms;touch-action:none;padding:0}
#touch .control-label{font-size:9px;letter-spacing:.5px;line-height:12px;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
#touch .control-status{font-size:15px;line-height:17px;letter-spacing:.2px}
#touch .tbtn.act{background:#34677d;border-color:#c4e8ed;transform:scale(.96)}
#touch .tbtn.ready{border-color:#e9cb90;box-shadow:inset 0 0 16px #e9cb901f;color:#f6dca5}
#touch .tbtn.cooldown{color:#96a6b7;background:#101b2a}
#touch .tbtn.move{font-size:39px}
#touch .tbtn.atk{color:#eff9fb;background:linear-gradient(140deg,#426d84,#24445e);border-color:#b0d8e8}
#touch .tbtn.jump{color:#bde6f4}
.touch-abilities{position:absolute;bottom:calc(14px + env(safe-area-inset-bottom,0px));left:50%;transform:translateX(-50%);display:flex;gap:8px;pointer-events:auto}
#touch .tbtn.ability{width:95px;height:48px;border-radius:10px;border-color:var(--ready-color,#a7c9db);background:#102338e8}
#touch .ability .control-label{font-size:8px}.ability .control-status{font-size:10px!important;color:#a5bece}
.portrait #touch{top:auto;height:var(--control-h);background:linear-gradient(#0b1a2beb,#07101ffb);border-top:1px solid #7e98ad60}
.portrait .touch-abilities{top:9px;bottom:auto;left:auto;right:12px;width:calc(50% - 19px);transform:none;gap:8px}
.portrait #touch .tbtn.ability{width:auto;min-width:0;flex:1 1 0;height:44px;flex-direction:column;justify-content:center;padding:0 5px;border-radius:9px;background:#12263b}
.portrait #touch .ability .control-label{font-size:8px;letter-spacing:.2px;color:#d9e9f2}
.portrait #touch .tbtn.ability{gap:2px}
.portrait #touch .ability .control-label{white-space:nowrap;text-align:center;line-height:11px;min-width:0;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.portrait #touch .ability .control-status{flex-shrink:0;font-size:8px!important;line-height:10px}
.portrait #touch .tbtn[data-k="ult"]{flex-direction:column;gap:2px}
.portrait #touch .tbtn[data-k="ult"] .control-status{font-size:13px}
.portrait .pad{bottom:calc(13px + env(safe-area-inset-bottom,0px));width:calc(50% - 19px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;justify-items:stretch;align-items:stretch}
.portrait .pad.left{left:12px}.portrait .pad.right{right:12px}
.portrait #touch .tbtn{width:100%;height:68px;border-radius:17px;font-size:28px;opacity:1}
.portrait #touch .tbtn.small{height:48px;margin:0;border-radius:11px;flex-direction:row;gap:6px;font-size:17px;background:#15253b;overflow:hidden}
.portrait #touch .tbtn.small .control-label{font-size:9px}
.portrait #touch .tbtn.move{font:40px Georgia;background:linear-gradient(#213b53,#14253b)}
.portrait #touch .tbtn.atk{border-radius:22px 22px 26px 22px}
.portrait #touch .tbtn[data-k="ult"]{background:linear-gradient(90deg,#7c683e33 var(--charge,0%),#15253b var(--charge,0%))}
.portrait #touch .tbtn:focus-visible{outline:2px solid #eed5a7;outline-offset:2px}
.portrait #startScreen{padding:calc(22px + env(safe-area-inset-top,0px)) 24px calc(24px + env(safe-area-inset-bottom,0px));gap:16px;justify-content:flex-start;background-image:linear-gradient(180deg,#0610209c,#06102045 24%,#061020e8 55%,#061020fc),url('assets/cathedral.webp');background-position:54% center;text-align:left}
.portrait #brandLogo{width:280px;max-width:85%;margin:0 0 4px;align-self:center}
.portrait #startScreen h1{font-size:clamp(39px,10.8vw,66px);margin:0;white-space:nowrap;letter-spacing:1px;max-width:100%}
.portrait #startScreen h1 small{font-size:10px;margin-top:12px;letter-spacing:5px}
.portrait #startScreen .sub{font-size:12px;line-height:1.65;max-width:100%}
.portrait #startScreen .legend{gap:11px;margin-top:0}.portrait #startScreen .legend span{font-size:10px}
.portrait #startScreen .menu-primary,.portrait #startScreen .menu-secondary{display:grid;grid-template-columns:1fr 1fr;width:100%;max-width:520px;gap:9px}
.portrait #startScreen .menu-primary #startBtn{grid-column:1/-1;width:100%;font-size:12px;min-height:54px;border-radius:9px;padding:15px;letter-spacing:1.5px}
.portrait #startScreen .btn.ghost{font-size:10px;min-height:44px;padding:10px 8px;border-radius:7px;background:#0f2236c4;letter-spacing:.3px}
.portrait #startScreen .menu-secondary{gap:8px}
.portrait #startScreen .menu-secondary #codexBtn{grid-column:1/-1}
.portrait #startScreen>.sub:last-of-type{display:none}
.portrait .mobile-guide{display:block;font-size:11px;line-height:1.65;margin-top:0}
.portrait .mobile-guide span{font-size:10px}
.portrait .controls-guide{width:100%;font-size:10px}
.portrait .controls-guide summary{min-height:40px;padding:9px 11px;font-size:10px}
.portrait .controls-guide summary small{font-size:9px}
.portrait .guide-grid{gap:6px 7px;padding:8px}
.portrait .guide-item{padding:6px 5px}
.portrait .guide-item span{font-size:9px}
.portrait .guide-item kbd{font-size:9px;line-height:14px;min-width:17px}
.portrait .overlay:not(#startScreen){padding:calc(24px + env(safe-area-inset-top,0px)) 18px calc(24px + env(safe-area-inset-bottom,0px));gap:16px;justify-content:flex-start}
.portrait .overlay>.sub{font-family:system-ui;font-size:13px;letter-spacing:1.5px!important;line-height:1.5}
.portrait #abilRow{display:grid!important;grid-template-columns:1fr 1fr;gap:10px!important;width:100%}
.portrait #abilRow .perk-card{width:100%!important;min-height:148px;padding:12px;gap:7px}
.portrait #abilRow .pk-name{font-size:12px}.portrait #abilRow .pk-desc{font-size:11px;line-height:1.4}
.portrait #abilRow .pk-key{font:10px system-ui;margin-top:auto}
.portrait #abilPick{font:11px/1.6 system-ui;letter-spacing:.5px}
.portrait #perkRow,.portrait #pactRow,.portrait #shrineRow{width:100%;display:flex;flex-direction:column;gap:12px!important}
.portrait #perkRow .perk-card,.portrait #pactRow .perk-card,.portrait #shrineRow .perk-card{width:100%;min-height:108px;padding:16px;gap:7px}
.portrait .perk-card:hover,.portrait .perk-card:active{transform:none}
.portrait #pauseScreen>.sub{margin-top:10px}
.portrait .cta-app{font-size:11px;line-height:1.6;max-width:100%;letter-spacing:.8px}
.portrait .shop-row{padding:12px 9px;gap:8px}.portrait .shop-name{font-size:11px}.portrait .shop-desc{font-size:12px}
.portrait .shop-buy{font:10px system-ui;padding:9px;min-width:57px}
.portrait #shopList,.portrait #achList,.portrait .board-list{max-width:100%;touch-action:pan-y}
.portrait #codex{width:calc(100vw - 20px);max-height:calc(var(--app-height) - 30px);padding:20px 15px!important;border-radius:12px;font-size:12px;overflow-wrap:break-word}
.portrait #codex h2{font-size:26px;clear:both;padding-top:10px}.portrait #closeCodex{min-height:44px}

@media(min-width:800px) and (max-height:800px){#startScreen{gap:12px;padding-top:25px;padding-bottom:25px}#brandLogo{width:240px}#startScreen h1{font-size:60px}}
@media(max-width:359px){.portrait #startScreen{padding-left:18px;padding-right:18px;gap:13px}.portrait #brandLogo{width:250px}.portrait .pad{bottom:calc(11px + env(safe-area-inset-bottom,0px));width:calc(50% - 17px);gap:7px}.portrait .pad.left{left:10px}.portrait .pad.right{right:10px}.portrait .touch-abilities{right:10px;width:calc(50% - 17px);gap:6px}.portrait #touch .tbtn{height:62px}.portrait #touch .tbtn.small{height:44px;gap:4px}.portrait #touch .tbtn.small .control-label{font-size:8px}.portrait #touch .tbtn.ability{padding:0 7px}.portrait #touch .ability .control-label{font-size:8px}.portrait #weaponInfo{font-size:9px}.portrait .controls-guide summary{padding-left:9px;padding-right:9px}.portrait .guide-grid{grid-template-columns:1fr;gap:5px}.portrait .guide-item.touch-item{grid-column:auto}}
@media(orientation:landscape) and (max-height:500px){#brandLogo{width:170px;position:absolute;right:32px;top:22px}#startScreen{gap:11px;padding:22px 30px}#startScreen .mobile-guide{font-size:10px;line-height:1.4;max-width:400px}#startScreen .mobile-guide span{display:none}#touch .tbtn{height:55px;width:55px;border-radius:15px}#touch .tbtn.small{height:44px;width:55px;margin-bottom:0;border-radius:10px}#touch .tbtn.atk{height:64px;width:64px}#touch .pad{gap:7px;bottom:calc(10px + env(safe-area-inset-bottom,0px))}#touch .touch-abilities{bottom:14px}#touch .tbtn.ability{width:80px;height:44px}.menu-primary,.menu-secondary{gap:8px}}

/* Hunter report */
#leadScreen{justify-content:flex-start;padding:calc(clamp(18px,4vh,38px) + env(safe-area-inset-top,0px)) 18px calc(clamp(18px,4vh,38px) + env(safe-area-inset-bottom,0px));gap:14px}
.report-card{width:min(680px,100%);padding:clamp(18px,4vw,30px);border:1px solid #a4d6e455;background:linear-gradient(145deg,#102237,#091522);box-shadow:0 18px 60px #0008;text-align:left}
.report-kicker{font:600 11px/1.4 system-ui,sans-serif;letter-spacing:2px!important;color:#a4d6e4!important}
.report-outcome{margin:10px 0 18px;color:#f4ead5;font:500 clamp(22px,4vw,34px)/1.15 Georgia,'Times New Roman',serif;letter-spacing:.4px}
.report-rank{display:flex;align-items:center;gap:16px;padding:0 0 16px;border-bottom:1px solid #8097ac44;color:#b3c1cf;font:600 10px system-ui,sans-serif;letter-spacing:1.5px}
#leadRank{font-size:clamp(42px,9vw,72px);line-height:.95}
.report-summary{margin:16px 0;color:#d8e2eb;font:14px/1.6 system-ui,sans-serif}
.report-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.report-stat{min-width:0;padding:12px;background:#071522a8;border:1px solid #8097ac33}
.report-stat span{display:block;color:#aebdca;font:10px/1.4 system-ui,sans-serif}
.report-stat strong{display:block;margin-top:5px;color:#edf1f5;font:600 clamp(15px,2.6vw,20px)/1.1 system-ui,sans-serif;overflow-wrap:anywhere}
.report-affinity{margin-top:12px;padding:14px 16px;background:#12273a;border-left:3px solid #a4d6e4}
.report-affinity>span{display:block;color:#b3c1cf;font:10px system-ui,sans-serif;letter-spacing:.6px}
.report-affinity strong{display:block;margin-top:5px;color:#a4d6e4;font:700 16px system-ui,sans-serif}
.report-affinity p{margin:6px 0 0;color:#d8e2eb;font:12px/1.5 system-ui,sans-serif}
.report-note{margin-top:12px;color:#91a5b6;font:10px/1.5 system-ui,sans-serif}
.report-form{display:flex;flex-direction:column;gap:9px;width:min(440px,100%);text-align:left}
.report-field{display:flex;flex-direction:column;gap:5px;color:#d8e2eb;font:11px/1.4 system-ui,sans-serif}
.report-field span{color:#91a5b6}
#leadMsg{min-height:20px;text-align:center}
#leadScreen .btn{width:100%}
#leadScreen .btn.ghost{width:auto}
#reportOutcome:focus{outline:2px solid #f3d69a;outline-offset:5px}
#boardScreen .board-list{width:min(620px,92vw);max-height:min(46vh,520px);min-height:0;flex-shrink:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-gutter:stable;touch-action:pan-y}
#boardList:focus-visible{outline:2px solid #f3d69a;outline-offset:4px}
#boardList .board-row{min-height:38px;flex:0 0 auto}
@media(max-width:520px){.report-stats{grid-template-columns:repeat(2,minmax(0,1fr))}#leadScreen{padding-left:14px;padding-right:14px}.report-card{padding:18px}.report-outcome{font-size:23px}}
.board-name-field{display:flex;flex-direction:column;gap:5px;width:min(440px,100%);color:#d8e2eb;font:600 12px/1.4 system-ui,sans-serif}
.board-name-field small{margin:0;color:#91a5b6;font:10px/1.4 system-ui,sans-serif;letter-spacing:0}
.score-feedback{display:flex;flex-direction:column;align-items:center;gap:7px;width:min(440px,92vw);text-align:center}
.score-feedback p{min-height:18px;color:#a8c6d3;font:12px/1.4 system-ui,sans-serif}
.report-actions{display:flex;flex-direction:column;gap:8px;width:min(440px,92vw)}
.board-note,.board-summary{color:#b3c1cf;font:12px/1.4 system-ui,sans-serif;text-align:center}
.board-row.empty{opacity:.55;border-style:dashed}
