body{height:100dvh;min-height:0;display:flex;flex-direction:column;padding:16px 22px 8px;overflow:hidden}header{margin-bottom:10px}header h1{font-size:25px}header p{margin-top:5px}header .topnote{display:none}header nav{flex-shrink:0}.guide-link{color:var(--gold);text-decoration:none;font-size:13px;font-weight:bold;border:1px solid var(--gold);padding:9px 14px;border-radius:2px;white-space:nowrap;display:inline-block}.guide-link:hover{background:rgba(223,183,94,.15)}#app{display:flex;flex-direction:column;flex:1;min-height:0;gap:9px}.stepbar{display:flex;justify-content:space-between;align-items:center;gap:12px}.stepbar nav{display:flex;align-items:center;gap:10px}.step{background:transparent;border:1px solid var(--line);padding:9px 15px;color:var(--muted);font-weight:bold}.step.current{border-color:var(--gold);color:var(--gold);background:#302e23}.points{font-size:16px}.points strong{font-size:26px}.profession-layout{display:grid;grid-template-columns:1.7fr 1fr;gap:14px;flex:1;min-height:0}.profession-grid{display:grid;grid-template-columns:1fr 1fr;align-content:start;gap:6px 12px;padding:12px}.profession-grid .row{border:1px solid var(--line);min-height:44px}.profession-grid .choose{padding:11px}.profession-detail .detail-content{padding:0 18px;overflow:auto;flex:1}.profession-description{line-height:1.6;white-space:pre-line}.primary{color:#171b1c;background:var(--gold);margin:16px;font-weight:bold}.panel h2{padding:12px 14px;font-size:18px}.panel h3{font-size:16px;margin:18px 0 12px}.trait-toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;font-size:14px}.trait-toolbar .reset{padding:8px 10px}.trait-toolbar input[type=search]{flex:1;min-width:160px;background:#202627;color:var(--text);border:1px solid var(--line);padding:10px 12px;font-size:16px}.trait-toolbar label{display:flex;align-items:center;gap:6px}.trait-layout{display:grid;grid-template-columns:1fr 1fr 1.08fr;gap:12px;flex:1;min-height:0}.trait-layout .list{padding:3px 7px}.trait-layout .row{min-height:36px}.trait-layout .choose{padding:8px;font-size:16px}.positive h2,.positive .choose{color:var(--green)}.negative h2,.negative .choose{color:var(--red)}.summary-content{overflow:auto;padding:0 14px 14px;flex:1}.chips{display:flex;flex-wrap:wrap;gap:8px;align-content:start;min-height:110px}.chips .chip{border:1px solid #59645c;border-radius:4px;min-height:0;max-width:100%;background:#202627}.chips .choose{font-size:14px;gap:8px;padding:9px}.chips .info{font-size:14px;padding:5px}.chip.positive{border-color:#426e48}.chip.negative{border-color:#874944}.chip.included .choose{color:var(--gold)}.chip small{font-size:12px;color:var(--muted)}.skills-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px}.skills-grid .skill{display:grid;grid-template-columns:1fr auto;padding:8px 0;gap:7px;font-size:14px}.skills-grid .bars{grid-column:1/-1;height:10px}.skills-grid .bar{flex:1;width:auto}.status{flex:none;font-size:13px;min-height:16px}.bottom{padding:0;gap:10px;flex:none;justify-content:flex-end}.bottom .reset{font-size:14px;padding:10px 12px}.random-controls{margin-right:auto;flex-direction:row;align-items:center;gap:12px}.random-controls label{font-size:13px}footer{margin-top:7px;font-size:12px}.info{padding:6px}input[type=checkbox]{accent-color:var(--gold)}
@media(max-width:1050px){body{padding:12px}.trait-layout{grid-template-columns:1fr 1fr 1.1fr}.skills-grid{grid-template-columns:1fr}.random-controls{flex-direction:column;align-items:flex-start;gap:5px}.profession-grid{grid-template-columns:1fr 1fr}.trait-layout .choose{font-size:14px}.chips .choose{font-size:14px}}
@media(max-width:720px){body{height:auto;min-height:100dvh;overflow:auto}header h1{font-size:21px}.stepbar{position:sticky;top:0;z-index:3;background:#111415;padding:8px 0;flex-wrap:wrap}.step{padding:8px;font-size:14px}.profession-layout{display:flex;flex-direction:column}.profession-grid{max-height:none;overflow:visible;grid-template-columns:1fr 1fr}.profession-detail .detail-content{overflow:visible}.trait-layout{display:grid;grid-template-columns:1fr 1fr;min-height:0}.trait-layout>.panel:not(.summary){height:65dvh;min-height:340px}.summary{grid-column:1/-1}.summary-content{overflow:visible}.skills-grid{grid-template-columns:1fr 1fr}.trait-toolbar input[type=search]{flex-basis:100%}.trait-layout .choose{font-size:14px}.bottom{position:sticky;bottom:0;background:#111415;padding:10px 0;flex-wrap:wrap;z-index:2}.random-controls{flex-direction:row;flex-basis:100%}.bottom .reset{flex:1;padding:10px 6px}.chips{min-height:0}.points{font-size:14px}.panel h2{font-size:16px;padding:10px}.stepbar .points strong{font-size:22px}.status{line-height:1.5}.profession-grid .choose{font-size:14px}}