/* Life DNAInfoPanel, direction popup and routine artwork adapted for the web. */
:root{--paper:#edf0f9;--ink:#252a43;--muted:#717993;--line:#dfe4f0;--coral:#5682e8;--purple:#7758c0;--green:#46986b}body{background:radial-gradient(ellipse at 12% 10%,#d9e5ff,transparent 55%),linear-gradient(130deg,#f0f4fb,#e8e4f7);min-height:100vh}header{background:#ffffffdc;border-bottom:2px solid #d7dff0;height:70px}.brand{color:#3e5084}.local-badge{color:#6e7fb0}.setup{gap:5%;padding:38px 0;align-items:start}.setup-copy{padding-top:20px}.setup h1{font-size:clamp(29px,3.1vw,46px);line-height:1.35;letter-spacing:-1.8px;margin-bottom:0}.setup h1 span{color:#5576cf;font-size:1.3em}.setup .lead{font-size:15px;margin-top:10px}.setup-steps{margin:18px 0;font-size:12px}.setup-steps b{color:#597ace}.game-character{position:relative;height:290px;overflow:hidden;margin:12px 0 8px;border-radius:24px;background:radial-gradient(ellipse at 50% 80%,#c5cce3 0%,#edf2ff 45%,transparent 70%)}.game-character img{position:absolute;height:390px;width:auto;max-width:none;left:50%;bottom:0;transform:translateX(-50%);filter:drop-shadow(0 8px 7px #55658d22)}.game-character span{position:absolute;bottom:8px;left:50%;transform:translateX(-50%);background:#fffdf5e8;border:1px solid #dbd5bd;border-radius:20px;padding:6px 18px;white-space:nowrap;font-size:11px;color:#55556b}.dna-panel,.stage,.character{border-radius:22px;border:1px solid #d5dcee;background:#fff;box-shadow:0 7px 0 #cbd3e54d,0 16px 45px #4a609014}.dna-panel{padding:24px}.panel-top{background:linear-gradient(110deg,#798cdf,#a49bdc);color:white;margin:-24px -24px 0;padding:17px 24px;border-radius:21px 21px 0 0;font-size:10px}.dna-title{margin:20px 0 10px;gap:14px}.dna-title h2{font-size:23px}.dna-orb{width:65px;height:65px;object-fit:contain;border:0;background:none;box-shadow:none;border-radius:0}.dna-overview{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:16px}.dna-radar{width:100%;height:auto;overflow:visible}.dna-groups{gap:12px}.meter{height:6px;background:#edf0f8}.meter i{background:linear-gradient(90deg,#7b91ec,#4687f2)}.factors{margin-top:8px}.factors>div{gap:8px;grid-template-columns:repeat(5,1fr)}.factors p{flex-direction:column;gap:4px;margin:0;background:#f4f4f7;border-radius:8px;border-left:3px solid #b59add;padding:10px 6px;font-size:10px}.factors b{font-size:24px;color:#8b61bb;font-weight:500}.factors small{font-size:8px;color:#9799a7}.primary,.secondary{border-radius:10px;border-width:1px;padding:13px 18px}.primary{background:linear-gradient(#ffeab3,#f5cd70);color:#6e501a;border-color:#dbb35d;box-shadow:0 3px 0 #cfab61}.primary:not(:disabled):hover{background:linear-gradient(#fff1ce,#f8d883);transform:translateY(-2px)}.secondary{background:#fff;border-color:#cbd6ee;color:#5e77af}.secondary:not(:disabled):hover{background:#edf2ff}.character{padding:20px;top:14px}.character .game-character{height:195px;margin:12px -4px}.character .game-character img{height:270px}.character-head h2{color:#607acc}.week{justify-content:space-between}.week i{border-radius:8px;background:#e9edfa;color:#8792b0}.week i.done{background:#8095d7}.week i.today{outline-color:#7289da;color:#536bbb;background:#edf0ff}.stage{padding:30px}.stage>.eyebrow{padding:12px 16px;background:linear-gradient(100deg,#818ed9,#a8a1db);color:#fff;border-radius:11px;margin-bottom:22px}.stage h1{font-size:29px}.pick{background:#fff;border:2px solid #e1e5f1;border-radius:15px;min-height:180px;padding:20px;box-shadow:0 4px 0 #e9edf5}.pick.selected{border:2px solid #6b94e7;background:#f3f7ff;padding:20px;box-shadow:0 4px 0 #c5d8f6}.pick:not(:disabled):hover{border-color:#7e9edb}.choice-art{width:65px;height:65px;object-fit:contain;float:right;margin-left:8px}.pick>strong{color:#46845f;background:#edf8ee;border-radius:6px;padding:6px 9px}.pick>i{color:#6891db}.augments{grid-template-columns:repeat(3,1fr);gap:12px}.augments .pick{min-height:300px;text-align:center;padding:18px 12px;border-color:#81ad89}.augments .pick:nth-child(2){border-color:#aa81ce}.augments .pick:nth-child(3){border-color:#87a7df}.augments .choice-art{float:none;display:block;width:90px;height:90px;margin:5px auto 20px}.augments .pick h3{font-size:18px}.augments .pick>strong{max-width:100%;text-align:left;font-size:11px}.queue button{background:#f4f6fc;border:1px solid #cdd7ef;border-radius:13px;position:relative;min-height:135px}.queue-icon{width:44px;height:44px;object-fit:contain;position:absolute;right:8px;top:8px}.queue .running{background:#fff1c7;border-color:#e0bc69}.routines>button{border-radius:13px;border-color:#dbe1ef;padding:12px 17px;box-shadow:0 3px 0 #edf0f6}.routines>button:hover:not(:disabled){background:#f0f5ff}.routine-icon{width:52px;height:52px;background:none;object-fit:contain}.routines b{border:1px solid #c8d3ec;border-radius:8px;background:#edf2ff;color:#7390cd;width:28px;text-align:center}.feedback{background:#edf3ff;color:#5b73a5;border-color:#85a4e9;border-radius:10px}.event-badge{color:#8b6aa7;background:#f2eafa;border-radius:20px}.consent{background:#f0f3fb;border-radius:14px}.report{border-radius:16px}.report .reflection{background:#455d8e}.report .bar i{background:#7594d5}.report .result-grid>div{background:#f1f4fb}.report-heading h1{color:#354e81}.sample-link{border-color:#b8c8e6}.character .dna-overview{grid-template-columns:1fr}.character .dna-radar{max-height:150px}.character .factors>div{grid-template-columns:repeat(3,1fr)}
@media(max-width:1000px){.factors>div{grid-template-columns:repeat(3,1fr)}.augments{grid-template-columns:1fr}.augments .pick{min-height:140px;text-align:left}.augments .choice-art{float:right;margin:0 0 0 15px;width:70px;height:70px}.augments .pick>strong{max-width:75%}.setup .game-character{height:250px}.setup .game-character img{height:340px}}
@media(max-width:700px){.setup{padding:20px 0;gap:20px}.setup-copy{padding-top:0}.setup h1{font-size:30px}.setup .game-character{height:210px}.setup .game-character img{height:290px}.setup-steps{display:none}.setup .lead{font-size:13px}.dna-panel{padding:20px}.panel-top{margin:-20px -20px 0;padding:14px 20px}.character{position:relative;padding:18px;overflow:hidden}.character .game-character{height:150px;width:115px;position:absolute;right:5px;top:0;background:none}.character .game-character img{height:185px}.character .game-character span{display:none}.character-head,.week{max-width:65%}.character .stats{margin-top:26px}.stage{padding:22px 16px}.stage h1{font-size:24px}.pick,.pick.selected{padding:15px 11px}.choice-art{width:44px;height:44px;float:none;margin:0 0 10px}.pick h3{font-size:15px}.factors>div{grid-template-columns:repeat(5,1fr);gap:5px}.factors p{font-size:9px;padding:8px 4px}.factors b{font-size:20px}.queue-icon{width:31px;height:31px;top:28px}.queue strong{margin-top:30px}.queue small{margin-top:6px}.dna-overview{gap:10px}.dna-group>div:first-child{font-size:11px}}
@media print{body{background:white}.report{border-radius:0}}
/* Keep the complete head visible; gameplay uses the centre character pose. */
.setup .game-character img{height:320px}
.character .game-character img{height:250px;clip-path:inset(0 33.4% 0 33.4%)}
@media(max-width:1000px){.setup .game-character img{height:310px}}
@media(max-width:700px){.setup .game-character img{height:260px}.character .game-character img{height:185px}}
@media(max-width:700px){.character .stats{margin-top:50px}}
@media(max-width:700px){.character .stats{margin-top:64px}}