:root{
  --bg:#0a0b0f;--panel:#12141a;--panel2:#171a22;--line:#2a2d37;--text:#f4f6fb;--muted:#8b909d;
  --yellow:#ffd84a;--pink:#ff6d9d;--green:#64dda1;--blue:#75a9ff;--orange:#ff9a5c;--purple:#b98cff;--red:#ff7078;--cyan:#71d8ef;
  --b4:#26d7a0;--b5:#55d8ff;--b6:#ff9b2f;--b8:#7c5cff;
}
*{box-sizing:border-box}html{background:var(--bg);color:var(--text);font-family:Pretendard,"Noto Sans KR",Arial,sans-serif}body{margin:0;background:radial-gradient(circle at 50% -220px,rgba(255,216,74,.08),transparent 480px),var(--bg)}button,input{font:inherit}.hidden{display:none!important}.life-shell{width:min(1200px,calc(100% - 32px));margin:0 auto}.life-header{height:72px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.back-link,.header-mark{font-size:11px;color:#7d828e;text-decoration:none;letter-spacing:.08em}.header-mark{font-weight:900}main{padding:50px 0 84px}

/* intro */
.intro-view{max-width:1080px;margin:0 auto;display:grid;grid-template-columns:1.25fr .75fr;gap:52px;align-items:center;min-height:650px}.kicker,.preview-label,.micro-label,.section-title-inline>div>span,.result-kicker{font-size:10px;font-weight:1000;letter-spacing:.16em;color:#9298a5}.hero-copy h1{font-size:clamp(58px,8vw,98px);line-height:.92;letter-spacing:-.07em;margin:13px 0 24px}.hero-copy h1 em{font-style:normal;color:var(--yellow)}.hero-desc{max-width:660px;font-size:18px;line-height:1.7;color:#bdc1cb}.setup-card{margin-top:34px;padding:20px;border:1px solid var(--line);border-radius:18px;background:rgba(255,255,255,.025)}.setup-row{display:flex;align-items:center;justify-content:space-between;gap:20px}.setup-row strong{display:block;margin-top:4px}.setup-label{font-size:9px;letter-spacing:.13em;color:#747985}.first-button-picker{display:flex;flex-wrap:wrap;gap:6px}.first-button-picker button,.time-controls button{border:1px solid #343844;background:#151820;color:#adb2bd;border-radius:9px;padding:9px 11px;cursor:pointer}.first-button-picker button.selected,.time-controls button.selected{border-color:rgba(255,216,74,.65);background:rgba(255,216,74,.12);color:#ffe982}.setup-facts{display:flex;flex-wrap:wrap;gap:8px;margin-top:17px;padding-top:15px;border-top:1px solid #242832}.setup-facts span{font-size:11px;color:#8a909c;padding:6px 8px;border-radius:999px;background:#0f1117}.setup-facts b{color:#e1e4eb}.hero-actions{display:flex;gap:9px;margin-top:20px}.primary-btn,.secondary-btn{border-radius:12px;padding:13px 18px;cursor:pointer;font-weight:900}.primary-btn{border:1px solid var(--yellow);background:var(--yellow);color:#151515}.secondary-btn{border:1px solid #3a3e49;background:#151820;color:#eee}.small-note{font-size:10px;color:#676d78;line-height:1.55}.preview-card{padding:26px;border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#151820,#0f1116)}.preview-card strong{display:block;font-size:25px;line-height:1.35;margin:10px 0}.preview-card p{font-size:12px;line-height:1.75;color:#949aa6}.preview-foot{margin-bottom:0}.mini-flow{display:flex;align-items:center;gap:7px;margin:24px 0}.mini-flow span{font-size:10px;padding:7px 9px;border:1px solid #353945;border-radius:999px}.mini-flow i{height:1px;flex:1;background:#3b404b}

/* top/time */
.game-view,.result-view{max-width:1080px;margin:0 auto}.sim-head{display:grid;grid-template-columns:1fr minmax(410px,470px);gap:32px;align-items:end;padding-bottom:22px;border-bottom:1px solid var(--line)}.sim-title-block h2{font-size:31px;margin:5px 0 7px}.sim-age{display:flex;align-items:baseline;gap:10px}.sim-age strong{font-size:23px;color:var(--yellow)}.sim-age span{font-size:12px;color:#7d828e}.origin-line{margin-top:10px;display:flex;gap:8px;align-items:center}.origin-line span{font-size:9px;color:#707681}.origin-line b{font-size:10px;color:#d7dbe4;font-weight:800}.calendar-line{display:flex;align-items:baseline;justify-content:flex-end;gap:8px;margin-bottom:8px}.calendar-line strong{font-size:20px}.calendar-line span{font-size:12px;color:#8c929e}.time-controls{display:flex;justify-content:flex-end;gap:5px}.time-controls button{min-width:44px;padding:7px 9px}.day-progress-card{margin-top:10px;padding:12px 13px;border:1px solid #303541;border-radius:13px;background:#10131a}.day-progress-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px}.day-progress-head>div{display:flex;align-items:baseline;gap:7px}.day-progress-head span{font-size:9px;color:#7d838f}.day-progress-head strong{font-size:23px;color:#fff}.day-progress-head em{font-style:normal;font-size:10px;color:#626874}.day-progress-head>b{font-size:10px;color:var(--cyan)}.day-track{position:relative;height:11px;margin-top:9px;border-radius:999px;background:#252a34;overflow:visible}.day-track>i{display:block;height:100%;min-width:3%;border-radius:999px;background:linear-gradient(90deg,#4ca9ff,#70e0e7);box-shadow:0 0 18px rgba(76,169,255,.22);transition:width .18s linear}.day-marks{position:absolute;inset:15px 0 auto;display:flex;justify-content:space-between;color:#575d68;font-size:8px;padding:0 1px}.next-line{display:flex;justify-content:flex-end;align-items:center;gap:8px;margin-top:22px;color:#727884;font-size:10px}.next-line button{border:0;background:none;color:#b7bdc8;cursor:pointer}.auto-toggle{display:flex;justify-content:flex-end;gap:6px;align-items:center;margin-top:7px;color:#707682;font-size:10px}

/* headings */
.section-title-inline{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:12px}.section-title-inline h3{font-size:20px;margin:3px 0 0}.section-title-inline h3 small{font-size:10px;color:#737985;font-weight:500;margin-left:6px}.compact-title{align-items:center}.text-btn{border:1px solid #333843;background:#13161d;color:#8f96a2;font-size:10px;cursor:pointer;padding:6px 9px;border-radius:8px}.small-meta{font-size:10px;color:#747b87}.small-meta b{color:#d6dae3}

/* dashboard */
.top-dashboard{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:14px;margin-top:28px;align-items:start}.records-column{min-width:0}.button-section,.skill-section,.focus-section,.record-section,.life-map-section,.result-section{margin-top:0}.skill-section{margin-top:18px}.button-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.button-card{position:relative;min-height:214px;padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--panel);overflow:hidden}.button-card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:#555}.button-card.b4:before{background:var(--b4)}.button-card.b5:before{background:var(--b5)}.button-card.b6:before{background:var(--b6)}.button-card.b8:before{background:var(--b8)}.button-card.active{border-color:#606875;box-shadow:0 0 0 1px rgba(255,255,255,.02) inset}.button-card.b4.active{background:linear-gradient(145deg,rgba(38,215,160,.14),#12141a 60%)}.button-card.b5.active{background:linear-gradient(145deg,rgba(85,216,255,.14),#12141a 60%)}.button-card.b6.active{background:linear-gradient(145deg,rgba(255,155,47,.14),#12141a 60%)}.button-card.b8.active{background:linear-gradient(145deg,rgba(124,92,255,.14),#12141a 60%)}.button-card.locked{opacity:.42}.rank-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.rank-emblem-wrap{width:58px;height:58px;display:grid;place-items:center}.rank-emblem{max-width:58px;max-height:58px;object-fit:contain}.rank-fallback{width:45px;height:45px;border:1px solid #4a5060;transform:rotate(45deg);display:grid;place-items:center}.rank-fallback i{transform:rotate(-45deg);font-style:normal;font-weight:1000}.button-name{font-size:26px;font-weight:1000}.button-state{font-size:9px;color:#777e8a}.button-power{font-size:29px;font-weight:1000;margin-top:10px;letter-spacing:-.03em}.button-power .daily-delta{font-size:9px;color:var(--green);font-weight:800;margin-left:5px}.button-class{font-size:10px;color:#ffe578;font-weight:900;min-height:15px}.button-stats{display:flex;gap:7px;flex-wrap:wrap;color:#7e8591;font-size:9px;margin-top:9px}.button-bar{height:4px;background:#292e38;border-radius:999px;overflow:hidden;margin-top:11px}.button-bar i{display:block;height:100%}.button-card.b4 .button-bar i{background:var(--b4)}.button-card.b5 .button-bar i{background:var(--b5)}.button-card.b6 .button-bar i{background:var(--b6)}.button-card.b8 .button-bar i{background:var(--b8)}.button-season{margin-top:7px;font-size:9px;color:#626975}
.skill-grid{display:block}.skill-radar-card{padding:10px 0 2px;border:1px solid var(--line);border-radius:16px;background:#0f1218;overflow:hidden}.skill-radar{width:100%;height:auto;display:block}.radar-ring{fill:none;stroke:#2f3540;stroke-width:1;stroke-dasharray:8 10}.radar-axis{stroke:#434a57;stroke-width:1}.radar-fill{fill:rgba(31,183,95,.28)}.radar-line{fill:none;stroke:#31e07a;stroke-width:3}.radar-label-title{fill:#f2f4f8;font-size:13px;font-weight:900}.radar-label-value{fill:#f2f4f8;font-size:11px;font-weight:800}

/* status distinct cards in one box */
.status-panel{border:1px solid #303541;border-radius:18px;background:linear-gradient(160deg,#141720,#0e1117);padding:15px;position:sticky;top:12px}.status-stack{display:flex;flex-direction:column;gap:8px}.status-card{display:flex;gap:10px;align-items:center;border:1px solid #2c313c;border-radius:12px;padding:10px;background:#10131a}.status-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;font-weight:1000}.status-body{min-width:0;flex:1}.status-line{display:grid;grid-template-columns:1fr auto auto;align-items:baseline;gap:6px}.status-line span{font-size:10px}.status-line span small{display:block;margin-top:1px;font-size:8px;color:#686f7b;font-weight:500}.status-line b{font-size:20px}.status-line em{font-style:normal;font-size:8px;color:#6e7581}.status-line em.up{color:var(--green)}.status-line em.down{color:var(--red)}.meter{height:5px;border-radius:99px;background:#272c35;overflow:hidden;margin-top:6px}.meter i{display:block;height:100%;transition:width .22s}.status-interest .status-icon{background:rgba(255,109,157,.12);color:#ff8bb1}.status-interest .meter i{background:linear-gradient(90deg,#ff5e92,#ff9cbc)}.status-health .status-icon{background:rgba(100,221,161,.12);color:#7ce8b5}.status-health .meter i{background:linear-gradient(90deg,#56ce91,#93efbd)}.status-mental .status-icon{background:rgba(117,169,255,.12);color:#93bdff}.status-mental .meter i{background:linear-gradient(90deg,#659bff,#a7c7ff)}.status-energy .status-icon{background:rgba(255,154,92,.13);color:#ffb17f}.status-energy .meter i{background:linear-gradient(90deg,#ff9454,#ffd071)}.status-help{margin-top:9px;padding:11px;border:1px solid #2b303a;border-radius:10px;background:#0d1015}.status-help p{margin:0 0 7px;color:#858c98;font-size:9px;line-height:1.55}.status-help p:last-child{margin-bottom:0}.status-help b{color:#d6dae3}.risk-chip{margin-top:10px;text-align:center;font-size:10px;padding:7px 9px;border:1px solid #343a45;border-radius:999px;color:#9aa1ad}.risk-chip.mid{border-color:rgba(255,216,74,.45);color:#ffe47c}.risk-chip.high{border-color:rgba(255,112,120,.48);color:#ff9ba0}

/* focus */
.focus-section{margin-top:28px}.focus-grid{display:grid;grid-template-columns:1fr;gap:10px}.focus-group{display:grid;gap:8px}.focus-group-label{font-size:10px;font-weight:900;letter-spacing:.18em;color:#858c98;text-transform:uppercase}.focus-button-pack,.focus-method-pack{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.focus-btn{position:relative;min-height:0;padding:10px 9px;text-align:left;border:1px solid var(--line);border-radius:14px;background:#12151c;color:#eee;cursor:pointer;transition:.15s;display:flex;gap:8px;align-items:flex-start}.focus-btn:hover{transform:translateY(-1px);border-color:#525967}.focus-btn.selected{border-color:rgba(255,216,74,.58);background:rgba(255,216,74,.055)}.focus-btn:before{content:'';position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:#727986}.focus-btn[data-focus='4B']:before{background:var(--b4)}.focus-btn[data-focus='5B']:before{background:var(--b5)}.focus-btn[data-focus='6B']:before{background:var(--b6)}.focus-btn[data-focus='8B']:before{background:var(--b8)}.focus-btn[data-focus='weakness']:before{background:var(--red)}.focus-btn[data-focus='classwork']:before{background:#ffd24a}.focus-btn[data-focus='community']:before{background:#d57bf7}.focus-btn[data-focus='rest']:before{background:var(--green)}.focus-icon{width:30px;height:30px;object-fit:contain;flex:0 0 auto;border-radius:10px;background:#0e1117;padding:4px;border:1px solid #303641}.focus-copy{min-width:0;flex:1}.focus-title{display:flex;align-items:center;justify-content:space-between;gap:6px}.focus-title b{font-size:12px;white-space:nowrap}.focus-title i{font-style:normal;font-size:7px;padding:3px 5px;border-radius:999px;background:rgba(255,216,74,.14);color:#ffe66c}.focus-effects,.choice-effects{display:flex;flex-wrap:wrap;gap:5px;margin-top:7px}.focus-effects span,.choice-effects span{display:inline-flex;align-items:center;gap:4px;border:1px solid #363b46;border-radius:7px;padding:4px 6px;font-size:8px;background:#0e1117}.focus-effects span b,.choice-effects span b{color:#b1b6c0}.focus-effects span em,.choice-effects span em{font-style:normal;font-weight:1000}.up{border-color:rgba(100,221,161,.34)!important;color:#7de6b5!important;background:rgba(100,221,161,.06)!important}.down{border-color:rgba(255,112,120,.34)!important;color:#ff969b!important;background:rgba(255,112,120,.06)!important}.warn{border-color:rgba(255,216,74,.32)!important;color:#ffe577!important;background:rgba(255,216,74,.05)!important}.special{border-color:rgba(185,140,255,.35)!important;color:#cdb1ff!important;background:rgba(185,140,255,.06)!important}.neutral{color:#a5abb6}.focus-effect-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding:10px 12px;border:1px solid #2b303a;border-radius:11px;background:#0e1116}.focus-effect-summary>strong{font-size:9px;color:#ddd}.focus-current-pair{display:inline-flex;align-items:center;gap:6px;border:1px solid #323844;border-radius:999px;padding:5px 9px;background:#10141b}.focus-current-pair img{width:20px;height:20px;object-fit:contain}.focus-current-pair b{font-size:10px}.focus-section.collapsed{padding-bottom:0}.focus-section.collapsed .focus-section-head{margin-bottom:0}

@media(max-width:980px){
  .focus-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .focus-button-pack{min-height:158px}
}
@media(max-width:580px){
  #gameView:not(.hidden){display:flex;flex-direction:column}
  #gameView>.sim-head{order:0}
  #gameView>.focus-section{order:1}
  #gameView>.top-dashboard{order:2}
  #gameView>.record-section{order:3}
  #gameView>.life-map-section{order:4}
  #gameView>.event-overlay{order:99}
  .focus-section{margin-top:16px;padding:10px;border:1px solid #2f3540;border-radius:14px;background:rgba(10,11,15,.96)}
  .focus-section.collapsed{position:sticky;top:8px;z-index:60;box-shadow:0 8px 26px rgba(0,0,0,.32)}
  .focus-section-head .section-title-inline h3 small{display:none}
  .focus-grid{grid-template-columns:1fr}
  .focus-button-pack,.focus-method-pack{grid-template-columns:repeat(2,minmax(0,1fr))}
  .focus-collapsed-summary em{display:none}
}

@media(max-width:980px){.skill-radar-card{padding:6px 0}.radar-label-title{font-size:11px}.radar-label-value{font-size:10px}.focus-button-pack,.focus-method-pack{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:580px){.focus-button-pack,.focus-method-pack{grid-template-columns:repeat(2,minmax(0,1fr))}.focus-btn{padding:9px 8px}.focus-icon{width:26px;height:26px}.focus-title b{font-size:11px}.radar-label-title{font-size:10px}.radar-label-value{font-size:9px}}


.focus-section-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.focus-toggle{border:1px solid #313745;background:#121722;color:#d6dbea;border-radius:10px;padding:7px 12px;font-size:11px;font-weight:800;cursor:pointer}
.focus-toggle:hover{border-color:#4a5264;background:#161c29}
.focus-collapsed-summary{width:100%;border:1px solid #313745;background:#10151f;color:#e6eaf2;border-radius:12px;padding:10px 12px;display:flex;align-items:center;gap:8px;cursor:pointer}
.focus-collapsed-summary.hidden{display:none}
.focus-collapsed-summary img{width:20px;height:20px;object-fit:contain}
.focus-collapsed-summary span{display:flex;flex-direction:column;gap:1px}
.focus-collapsed-summary small{font-size:9px;color:#8a93a4}
.focus-collapsed-summary b{font-size:11px}
.focus-collapsed-summary em{margin-left:auto;font-style:normal;font-size:10px;color:#97a2b5}
.skill-radar-card{max-width:720px;margin:0 auto;padding:8px 0 0}
.skill-radar{max-width:720px;margin:0 auto}
.radar-label-title{font-size:11px}.radar-label-value{font-size:10px}
.button-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
@media(max-width:1100px){
  .sim-head{grid-template-columns:minmax(0,1fr) minmax(320px,420px)}
}
@media(max-width:920px){
  .sim-head{grid-template-columns:1fr;gap:18px;align-items:start}
  .calendar-line,.time-controls,.next-line,.auto-toggle{justify-content:flex-start}
  .top-dashboard{grid-template-columns:1fr}
  .status-panel{position:static;top:auto;max-width:none}
  .button-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:680px){
  .game-view,.result-view,.intro-view{max-width:100%;overflow-x:hidden}
  .sim-head{padding-bottom:16px}
  .sim-title-block h2{font-size:22px;line-height:1.12;word-break:keep-all}
  .calendar-line strong{font-size:18px}
  .time-controls{flex-wrap:wrap}
  .day-progress-card{padding:11px 10px}
  .button-grid{grid-template-columns:1fr}
  .button-card{min-height:188px;padding:12px}
  .button-name{font-size:23px}.button-power{font-size:24px}
  .rank-emblem-wrap,.rank-emblem{width:48px;height:48px;max-width:48px;max-height:48px}
  .top-dashboard{gap:12px}
  .status-panel{padding:12px}
  .skill-radar-card{max-width:100%;padding:0}
  .focus-section{margin-top:14px}
}
@media(max-width:560px){
  .focus-section-head{align-items:center}
  .focus-toggle{padding:7px 10px;font-size:10px}
  .focus-collapsed-summary{padding:9px 10px}
  .focus-grid{gap:8px}
  .focus-button-pack,.focus-method-pack{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .focus-btn{padding:8px 7px}
  .focus-effects span{font-size:7px;padding:4px 5px}
  .day-progress-head strong{font-size:20px}
}

/* restored modal and result surfaces */
.event-overlay{position:fixed;z-index:9999;inset:0;padding:24px;display:grid;place-items:center;background:rgba(3,4,8,.84);backdrop-filter:blur(9px)}.event-modal{width:min(760px,100%);max-height:calc(100vh - 48px);overflow:auto;border:1px solid #3b414e;border-radius:22px;background:#12151c;padding:24px;box-shadow:0 28px 80px rgba(0,0,0,.58);position:relative}.event-modal:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:#81899a}.event-special-label{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.05);color:#a2a7b0;font-size:8px;letter-spacing:.12em;font-weight:1000}.event-head{display:flex;justify-content:space-between;gap:20px;margin-top:17px}.event-head span{font-size:9px;letter-spacing:.14em;color:#a5acb7;font-weight:1000}.event-head h3{font-size:25px;margin:5px 0 0}.event-head small{display:block;margin-top:6px;color:#6c7380;font-size:9px}.event-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);color:#bcc2cd;font-weight:1000}.event-modal>p{margin:17px 0;color:#b7bcc6;line-height:1.72;font-size:13px}.event-guide{padding-top:13px;border-top:1px solid #292f39;color:#727986;font-size:9px}.event-choices{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:10px}.event-choice{min-height:138px;padding:15px;border:1px solid #343a46;background:#171a22;color:#eee;border-radius:13px;text-align:left;cursor:pointer}.event-choice:hover{border-color:#687181;background:#1a1e27}.choice-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.choice-top>b{font-size:14px}.choice-top>i{font-style:normal;color:#626a76;font-size:8px}.choice-desc{display:block;margin-top:10px;color:#7f8692;font-size:10px;line-height:1.55}.event-modal.tone-danger:before{background:var(--red)}.event-modal.tone-danger .event-icon,.event-modal.tone-danger .event-head span{color:#ff9298}.event-modal.tone-health:before{background:var(--green)}.event-modal.tone-health .event-icon,.event-modal.tone-health .event-head span{color:#83e9b9}.event-modal.tone-community:before{background:var(--purple)}.event-modal.tone-community .event-icon,.event-modal.tone-community .event-head span{color:#d0b3ff}.event-modal.tone-special:before{background:var(--yellow)}.event-modal.tone-special .event-icon,.event-modal.tone-special .event-head span{color:#ffe477}.event-modal.tone-positive:before{background:var(--cyan)}.event-modal.tone-positive .event-icon,.event-modal.tone-positive .event-head span{color:#8be4f1}


.record-section,.life-map-section,.result-section{margin-top:0}.skill-section{margin-top:18px}.button-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.button-card{position:relative;min-height:214px;padding:14px;border-radius:16px;border:1px solid var(--line);background:var(--panel);overflow:hidden}.button-card:before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:#555}.button-card.b4:before{background:var(--b4)}.button-card.b5:before{background:var(--b5)}.button-card.b6:before{background:var(--b6)}.button-card.b8:before{background:var(--b8)}.button-card.active{border-color:#606875;box-shadow:0 0 0 1px rgba(255,255,255,.02) inset}.button-card.b4.active{background:linear-gradient(145deg,rgba(94,168,255,.12),#12141a 60%)}.button-card.b5.active{background:linear-gradient(145deg,rgba(178,122,255,.12),#12141a 60%)}.button-card.b6.active{background:linear-gradient(145deg,rgba(255,123,114,.12),#12141a 60%)}.button-card.b8.active{background:linear-gradient(145deg,rgba(101,214,155,.12),#12141a 60%)}.button-card.locked{opacity:.42}.rank-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.rank-emblem-wrap{width:58px;height:58px;display:grid;place-items:center}.rank-emblem{max-width:58px;max-height:58px;object-fit:contain}.rank-fallback{width:45px;height:45px;border:1px solid #4a5060;transform:rotate(45deg);display:grid;place-items:center}.rank-fallback i{transform:rotate(-45deg);font-style:normal;font-weight:1000}.button-name{font-size:26px;font-weight:1000}.button-state{font-size:9px;color:#777e8a}.button-power{font-size:29px;font-weight:1000;margin-top:10px;letter-spacing:-.03em}.button-power .daily-delta{font-size:9px;color:var(--green);font-weight:800;margin-left:5px}.button-class{font-size:10px;color:#ffe578;font-weight:900;min-height:15px}.button-stats{display:flex;gap:7px;flex-wrap:wrap;color:#7e8591;font-size:9px;margin-top:9px}.button-bar{height:4px;background:#292e38;border-radius:999px;overflow:hidden;margin-top:11px}.button-bar i{display:block;height:100%}.button-card.b4 .button-bar i{background:var(--b4)}.button-card.b5 .button-bar i{background:var(--b5)}.button-card.b6 .button-bar i{background:var(--b6)}.button-card.b8 .button-bar i{background:var(--b8)}.button-season{margin-top:7px;font-size:9px;color:#626975}
.skill-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.skill-card{padding:11px 10px;border:1px solid var(--line);border-radius:11px;background:#11141a;text-align:left}.skill-card>div{display:flex;align-items:baseline;justify-content:space-between;gap:5px}.skill-card b{font-size:17px}.skill-card span{font-size:9px;color:#7c838f}.skill-card>i{display:block;height:4px;margin-top:9px;background:#282d36;border-radius:99px;overflow:hidden}.skill-card>i>em{display:block;height:100%;background:#77808d;border-radius:99px}.skill-card.strong{border-color:rgba(100,221,161,.34)}.skill-card.strong>i>em{background:var(--green)}.skill-card.weak{border-color:rgba(255,112,120,.34)}.skill-card.weak>i>em{background:var(--red)}.skill-card.strong:after,.skill-card.weak:after{display:block;margin-top:5px;font-size:8px}.skill-card.strong:after{content:"강점";color:var(--green)}.skill-card.weak:after{content:"약점";color:#ff969b}

/* status distinct cards in one box */
.status-panel{border:1px solid #303541;border-radius:18px;background:linear-gradient(160deg,#141720,#0e1117);padding:15px;position:sticky;top:12px}.status-stack{display:flex;flex-direction:column;gap:8px}.status-card{display:flex;gap:10px;align-items:center;border:1px solid #2c313c;border-radius:12px;padding:10px;background:#10131a}.status-icon{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;flex:0 0 auto;font-weight:1000}.status-body{min-width:0;flex:1}.status-line{display:grid;grid-template-columns:1fr auto auto;align-items:baseline;gap:6px}.status-line span{font-size:10px}.status-line span small{display:block;margin-top:1px;font-size:8px;color:#686f7b;font-weight:500}.status-line b{font-size:20px}.status-line em{font-style:normal;font-size:8px;color:#6e7581}.status-line em.up{color:var(--green)}.status-line em.down{color:var(--red)}.meter{height:5px;border-radius:99px;background:#272c35;overflow:hidden;margin-top:6px}.meter i{display:block;height:100%;transition:width .22s}.status-interest .status-icon{background:rgba(255,109,157,.12);color:#ff8bb1}.status-interest .meter i{background:linear-gradient(90deg,#ff5e92,#ff9cbc)}.status-health .status-icon{background:rgba(100,221,161,.12);color:#7ce8b5}.status-health .meter i{background:linear-gradient(90deg,#56ce91,#93efbd)}.status-mental .status-icon{background:rgba(117,169,255,.12);color:#93bdff}.status-mental .meter i{background:linear-gradient(90deg,#659bff,#a7c7ff)}.status-energy .status-icon{background:rgba(255,154,92,.13);color:#ffb17f}.status-energy .meter i{background:linear-gradient(90deg,#ff9454,#ffd071)}.status-help{margin-top:9px;padding:11px;border:1px solid #2b303a;border-radius:10px;background:#0d1015}.status-help p{margin:0 0 7px;color:#858c98;font-size:9px;line-height:1.55}.status-help p:last-child{margin-bottom:0}.status-help b{color:#d6dae3}.risk-chip{margin-top:10px;text-align:center;font-size:10px;padding:7px 9px;border:1px solid #343a45;border-radius:999px;color:#9aa1ad}.risk-chip.mid{border-color:rgba(255,216,74,.45);color:#ffe47c}.risk-chip.high{border-color:rgba(255,112,120,.48);color:#ff9ba0}

/* focus */
.focus-section{margin-top:28px}.focus-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.focus-btn{position:relative;min-height:138px;padding:14px 14px 13px 17px;text-align:left;border:1px solid var(--line);border-radius:14px;background:#12151c;color:#eee;cursor:pointer;transition:.15s}.focus-btn:hover{transform:translateY(-1px);border-color:#525967}.focus-btn.selected{border-color:rgba(255,216,74,.58);background:rgba(255,216,74,.055)}.focus-btn:before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:3px;border-radius:0 3px 3px 0;background:#727986}.focus-btn.focus-4B:before{background:var(--b4)}.focus-btn.focus-5B:before{background:var(--b5)}.focus-btn.focus-6B:before{background:var(--b6)}.focus-btn.focus-8B:before{background:var(--b8)}.focus-btn.focus-accuracy:before{background:var(--cyan)}.focus-btn.focus-weakness:before{background:var(--red)}.focus-btn.focus-variety:before{background:var(--purple)}.focus-btn.focus-community:before{background:#d57bf7}.focus-btn.focus-rest:before{background:var(--green)}.focus-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.focus-title b{font-size:13px}.focus-title i{font-style:normal;font-size:8px;padding:4px 6px;border-radius:999px;background:rgba(255,216,74,.14);color:#ffe66c}.focus-btn>span{display:block;margin-top:5px;color:#7d8490;font-size:10px;line-height:1.5}.focus-effects,.choice-effects{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px}.focus-effects span,.choice-effects span{display:inline-flex;align-items:center;gap:4px;border:1px solid #363b46;border-radius:7px;padding:4px 6px;font-size:8px;background:#0e1117}.focus-effects span b,.choice-effects span b{color:#b1b6c0}.focus-effects span em,.choice-effects span em{font-style:normal;font-weight:1000}.up{border-color:rgba(100,221,161,.34)!important;color:#7de6b5!important;background:rgba(100,221,161,.06)!important}.down{border-color:rgba(255,112,120,.34)!important;color:#ff969b!important;background:rgba(255,112,120,.06)!important}.warn{border-color:rgba(255,216,74,.32)!important;color:#ffe577!important;background:rgba(255,216,74,.05)!important}.special{border-color:rgba(185,140,255,.35)!important;color:#cdb1ff!important;background:rgba(185,140,255,.06)!important}.neutral{color:#a5abb6}.focus-effect-summary{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:10px;padding:10px 12px;border:1px solid #2b303a;border-radius:11px;background:#0e1116}.focus-effect-summary>strong{font-size:9px;color:#ddd}.focus-effect-summary .focus-effects{margin:0}.focus-effect-summary>small{margin-left:auto;color:#5d6470;font-size:8px}

/* modal */
.event-overlay{position:fixed;z-index:9999;inset:0;padding:24px;display:grid;place-items:center;background:rgba(3,4,8,.84);backdrop-filter:blur(9px)}.event-modal{width:min(760px,100%);max-height:calc(100vh - 48px);overflow:auto;border:1px solid #3b414e;border-radius:22px;background:#12151c;padding:24px;box-shadow:0 28px 80px rgba(0,0,0,.58);position:relative}.event-modal:before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:#81899a}.event-special-label{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,255,255,.05);color:#a2a7b0;font-size:8px;letter-spacing:.12em;font-weight:1000}.event-head{display:flex;justify-content:space-between;gap:20px;margin-top:17px}.event-head span{font-size:9px;letter-spacing:.14em;color:#a5acb7;font-weight:1000}.event-head h3{font-size:25px;margin:5px 0 0}.event-head small{display:block;margin-top:6px;color:#6c7380;font-size:9px}.event-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.06);color:#bcc2cd;font-weight:1000}.event-modal>p{margin:17px 0;color:#b7bcc6;line-height:1.72;font-size:13px}.event-guide{padding-top:13px;border-top:1px solid #292f39;color:#727986;font-size:9px}.event-choices{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-top:10px}.event-choice{min-height:138px;padding:15px;border:1px solid #343a46;background:#171a22;color:#eee;border-radius:13px;text-align:left;cursor:pointer}.event-choice:hover{border-color:#687181;background:#1a1e27}.choice-top{display:flex;align-items:center;justify-content:space-between;gap:10px}.choice-top>b{font-size:14px}.choice-top>i{font-style:normal;color:#626a76;font-size:8px}.choice-desc{display:block;margin-top:10px;color:#7f8692;font-size:10px;line-height:1.55}.event-modal.tone-danger:before{background:var(--red)}.event-modal.tone-danger .event-icon,.event-modal.tone-danger .event-head span{color:#ff9298}.event-modal.tone-health:before{background:var(--green)}.event-modal.tone-health .event-icon,.event-modal.tone-health .event-head span{color:#83e9b9}.event-modal.tone-community:before{background:var(--purple)}.event-modal.tone-community .event-icon,.event-modal.tone-community .event-head span{color:#d0b3ff}.event-modal.tone-special:before{background:var(--yellow)}.event-modal.tone-special .event-icon,.event-modal.tone-special .event-head span{color:#ffe477}.event-modal.tone-positive:before{background:var(--cyan)}.event-modal.tone-positive .event-icon,.event-modal.tone-positive .event-head span{color:#8be4f1}

/* timeline */
.record-section,.life-map-section{margin-top:30px}.timeline{display:flex;flex-direction:column;gap:6px}.timeline-item{display:grid;grid-template-columns:132px 1fr auto;gap:12px;align-items:start;padding:11px 12px;border:1px solid rgba(255,255,255,.065);border-radius:11px;background:rgba(255,255,255,.025)}.timeline-item .t-age{font-size:10px;color:#bfc5ce;font-weight:900}.timeline-item p{margin:0;color:#8e95a1;font-size:10px;line-height:1.5}.timeline-item.important{border-color:rgba(255,216,74,.23);background:rgba(255,216,74,.035)}.timeline-item.important p{color:#eceff5;font-weight:900;font-size:11px}.timeline-item .t-tag{font-size:8px;color:#696f7b;border:1px solid #343a45;border-radius:999px;padding:4px 6px}.life-map{display:grid;grid-template-columns:repeat(24,1fr);gap:3px}.month-cell{aspect-ratio:1;border-radius:3px;background:#222731;position:relative}.month-cell.b4{background:var(--b4)}.month-cell.b5{background:var(--b5)}.month-cell.b6{background:var(--b6)}.month-cell.b8{background:var(--b8)}.month-cell.rest{background:#525965}.month-cell:hover:after{content:attr(data-tip);position:absolute;z-index:5;bottom:120%;left:50%;transform:translateX(-50%);white-space:nowrap;background:#222731;border:1px solid #454c59;color:#ddd;font-size:9px;padding:5px 6px;border-radius:6px}.map-legend{display:flex;gap:8px;flex-wrap:wrap}.map-legend span{font-size:9px;color:#8b929e}.map-legend span:before{content:"";display:inline-block;width:7px;height:7px;border-radius:2px;margin-right:4px}.map-legend .b4:before{background:var(--b4)}.map-legend .b5:before{background:var(--b5)}.map-legend .b6:before{background:var(--b6)}.map-legend .b8:before{background:var(--b8)}.map-legend .rest:before{background:#525965}


.flashback-view{position:fixed;z-index:10000;inset:0;background:#050609;display:grid;place-items:center;padding:26px}.flashback-view:after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(255,216,74,.06),transparent 44%);pointer-events:none}.flashback-inner{position:relative;z-index:1;width:min(780px,100%);text-align:center}.flashback-kicker{font-size:9px;letter-spacing:.23em;color:#686e79;font-weight:900}.flashback-date{margin-top:28px;color:#8c929e;font-size:12px}.flashback-text{min-height:120px;margin-top:16px;display:grid;place-items:center;font-size:clamp(25px,4vw,44px);font-weight:900;line-height:1.4;letter-spacing:-.03em;opacity:0;transform:translateY(10px);transition:opacity .45s ease,transform .45s ease}.flashback-text.show{opacity:1;transform:translateY(0)}.flashback-progress{height:3px;margin:30px auto 0;max-width:430px;background:#1c2028;border-radius:99px;overflow:hidden}.flashback-progress i{display:block;height:100%;width:0;background:var(--yellow);transition:width .3s}.flashback-skip{margin-top:18px;border:0;background:none;color:#7f8590;font-size:10px;cursor:pointer}


.result-hero{padding:42px 0 28px;border-bottom:1px solid var(--line)}.result-hero h2{font-size:clamp(42px,7vw,76px);line-height:1.04;letter-spacing:-.055em;margin:11px 0 18px}.result-hero h2 b{color:#fff}.result-hero h2 em{font-style:normal;color:var(--yellow)}.result-hero p{max-width:760px;color:#a0a6b1;line-height:1.7}.result-summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:18px}.result-summary-grid article,.result-status article{padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}.result-summary-grid span,.result-status span{display:block;font-size:9px;color:#777e8a}.result-summary-grid b,.result-status b{display:block;margin-top:6px;font-size:17px}.result-summary-grid .accent{border-color:rgba(255,216,74,.4);background:rgba(255,216,74,.05)}.result-section{margin-top:28px}.result-status{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.result-buttons{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.result-button{padding:16px;border:1px solid var(--line);border-radius:15px;background:var(--panel);text-align:center}.result-button .rank-emblem-wrap{margin:0 auto}.result-button.unplayed{opacity:.4}.rb-name{font-size:22px;font-weight:1000;margin-top:8px}.rb-class{font-size:9px;color:#ffe578;font-weight:900}.rb-power{font-size:24px;font-weight:1000;margin-top:4px}.rb-sub{font-size:9px;color:#727985;line-height:1.55;margin-top:7px}.result-tags{display:flex;flex-wrap:wrap;gap:7px}.result-tags span{padding:8px 10px;border:1px solid rgba(185,140,255,.28);background:rgba(185,140,255,.06);border-radius:999px;color:#d2baff;font-size:10px;font-weight:800}.result-tags span.warn{border-color:rgba(255,112,120,.32);background:rgba(255,112,120,.06);color:#ff9ea3}.result-tags span.role-jjuddak{border-color:rgba(255,153,51,.55);background:rgba(255,153,51,.12);color:#ffad5c;box-shadow:inset 0 0 0 1px rgba(255,153,51,.05)}.result-tags span.role-ppadak{border-color:rgba(70,150,255,.55);background:rgba(70,150,255,.11);color:#82baff}.result-tags span.tag-danger{border-color:rgba(255,92,105,.48);background:rgba(255,92,105,.10);color:#ff8f99}.result-tags span.tag-gold{border-color:rgba(255,216,74,.48);background:rgba(255,216,74,.09);color:#ffe36e}.result-tags span.tag-purple{border-color:rgba(190,120,255,.48);background:rgba(190,120,255,.10);color:#d5adff}.result-tags span.tag-comeback{border-color:rgba(71,211,218,.46);background:rgba(71,211,218,.09);color:#80e7eb}.result-tags span.tag-health{border-color:rgba(100,221,161,.46);background:rgba(100,221,161,.09);color:#7de6b5}.result-tags span.tag-admin{border-color:rgba(158,166,181,.38);background:rgba(158,166,181,.07);color:#c3c9d3}.result-timeline{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.result-log-item{padding:11px 12px;border:1px solid #292f39;border-radius:11px;background:#10131a;color:#858c98;font-size:10px;line-height:1.5}.result-log-item>b{display:block;color:#c5cad3;font-size:9px;margin-bottom:4px}.result-log-item.important{border-color:rgba(255,216,74,.25);background:rgba(255,216,74,.035);color:#eef1f6;font-weight:900}.result-actions{display:flex;gap:8px;margin-top:28px}.copy-toast{min-height:20px;margin-top:8px;color:#8f96a2;font-size:10px}


/* v21 compact chart + mobile + modal fixes */
.skill-grid{display:flex;justify-content:center;align-items:center}
.skill-radar-card{width:min(100%,440px)!important;max-width:440px!important;margin:0 auto!important;padding:4px 0!important}
.skill-radar{width:100%!important;max-width:440px!important;height:auto!important;margin:0 auto!important}
.radar-label-title{font-size:10px!important}.radar-label-value{font-size:9px!important}
.event-overlay{position:fixed!important;z-index:9999!important;inset:0!important;display:grid!important;place-items:center!important;background:rgba(3,4,8,.86)!important;padding:18px!important;backdrop-filter:blur(9px)}
.event-overlay.hidden{display:none!important}
.event-modal{width:min(760px,100%)!important;max-height:calc(100vh - 36px)!important;overflow:auto!important}
@media(max-width:920px){
  .life-shell{width:min(100% - 24px,1200px)}
  .sim-head{grid-template-columns:1fr!important;gap:16px!important;align-items:start!important}
  .time-panel{min-width:0!important;width:100%!important}
  .top-dashboard{grid-template-columns:1fr!important}
  .status-panel{position:static!important;width:100%!important}
  .button-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:620px){
  .life-shell{width:calc(100% - 20px)!important;max-width:100%!important;overflow-x:hidden}
  main{padding-top:24px!important}
  .sim-head{width:100%;min-width:0}
  .sim-title-block,.time-panel,.records-column,.button-section,.skill-section,.status-panel{min-width:0!important;max-width:100%!important}
  .sim-title-block h2{font-size:26px!important;line-height:1.15!important;word-break:keep-all!important}
  .time-controls{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;width:100%!important;gap:5px!important}
  .time-controls button{min-width:0!important;width:100%!important;padding:8px 4px!important}
  .button-grid{grid-template-columns:1fr!important;width:100%!important}
  .button-card{width:100%!important;min-width:0!important;min-height:174px!important;padding:12px!important}
  .button-stats{gap:5px!important}.button-season{white-space:normal!important;word-break:keep-all!important}
  .status-stack{grid-template-columns:1fr!important}
  .skill-radar-card{width:min(100%,330px)!important;max-width:330px!important;border-radius:13px!important}
  .skill-radar{max-width:330px!important}
  .radar-label-title{font-size:9px!important}.radar-label-value{font-size:8px!important}
  .focus-section{width:100%!important;min-width:0!important}
  .focus-section-head{align-items:center!important}
  .focus-button-pack,.focus-method-pack{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .focus-btn{min-width:0!important}
  .focus-copy,.focus-title{min-width:0!important}.focus-title b{white-space:normal!important;word-break:keep-all!important}
  .focus-effects{gap:3px!important}.focus-effects span{font-size:7px!important;padding:3px 4px!important}
  .record-section,.life-map-section{min-width:0!important;width:100%!important}
  .timeline-item{grid-template-columns:74px minmax(0,1fr)!important;gap:8px!important}.timeline-item .t-tag{display:none!important}
  .event-overlay{padding:10px!important}.event-modal{max-height:calc(100vh - 20px)!important;padding:17px!important;border-radius:17px!important}.event-choices{grid-template-columns:1fr!important}
}

/* v21 final compact radar */
.skill-radar-card{width:min(100%,380px)!important;max-width:380px!important}
.skill-radar{max-width:380px!important}
@media(max-width:620px){.skill-radar-card{width:min(100%,290px)!important;max-width:290px!important}.skill-radar{max-width:290px!important}}

/* v22 focus layout hard override */
.focus-section{width:100%!important;min-width:0!important}
.focus-grid{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;width:100%!important;min-width:0!important}
.focus-group{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;width:100%!important;min-width:0!important}
.focus-group-label{display:block!important;width:100%!important;margin:0 0 2px!important}
.focus-button-pack,.focus-method-pack{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:10px!important;width:100%!important;min-width:0!important;min-height:0!important}
.focus-btn{min-width:0!important;width:100%!important;min-height:96px!important;height:auto!important;padding:11px 10px!important;display:flex!important;align-items:flex-start!important;gap:9px!important;overflow:hidden!important}
.focus-copy{min-width:0!important;width:100%!important}
.focus-title{min-width:0!important;gap:5px!important}
.focus-title b{font-size:12px!important;white-space:normal!important;word-break:keep-all!important;line-height:1.25!important}
.focus-effects{display:flex!important;flex-wrap:wrap!important;gap:4px!important;margin-top:7px!important;min-width:0!important}
.focus-effects span{max-width:100%!important;white-space:nowrap!important;font-size:7.5px!important;padding:3px 5px!important}
.focus-icon{width:30px!important;height:30px!important;flex:0 0 30px!important}
.focus-effect-summary{width:100%!important;min-width:0!important}

@media(max-width:860px){
  .focus-button-pack,.focus-method-pack{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .focus-btn{min-height:92px!important}
}
@media(max-width:460px){
  .focus-button-pack,.focus-method-pack{grid-template-columns:1fr!important}
  .focus-btn{min-height:82px!important}
}

/* v42: Lucky Lope event — coral typography */
.event-modal.tone-lope:before{background:#ff7f6f!important}
.event-modal.tone-lope .event-special-label,
.event-modal.tone-lope .event-head span,
.event-modal.tone-lope .event-head h3,
.event-modal.tone-lope .event-head small,
.event-modal.tone-lope .event-icon,
.event-modal.tone-lope>p,
.event-modal.tone-lope .event-guide,
.event-modal.tone-lope .choice-top>b,
.event-modal.tone-lope .choice-top>i{color:#ff7f6f!important}
.event-modal.tone-lope .event-choice{border-color:rgba(255,127,111,.34)}
.event-modal.tone-lope .event-choice:hover{border-color:#ff7f6f;background:rgba(255,127,111,.07)}
.event-modal.tone-lope .choice-desc:empty{display:none}


/* v46: mobile intro rebuild + capture */
.capture-btn{border-color:rgba(113,216,239,.5);color:#bceefa;background:rgba(113,216,239,.07)}
@media(max-width:760px){
  html,body{width:100%;max-width:100%;overflow-x:hidden}
  .life-shell{width:100%!important;max-width:100%!important;margin:0!important;padding:0 16px!important;overflow:visible!important}
  .life-header{height:58px!important;width:100%!important;min-width:0!important;gap:10px!important}
  .back-link,.header-mark{font-size:9px!important;letter-spacing:.055em!important;white-space:nowrap!important}
  .header-mark{text-align:right;overflow:hidden;text-overflow:ellipsis;max-width:52vw}
  main{padding:28px 0 60px!important;width:100%!important;min-width:0!important}
  .intro-view{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;min-height:0!important;margin:0!important;padding:18px 0 26px!important}
  .hero-copy{width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;transform:none!important}
  .kicker{font-size:8.5px!important;letter-spacing:.11em!important;white-space:normal!important}
  .hero-copy h1{font-size:clamp(44px,13.2vw,66px)!important;line-height:.94!important;letter-spacing:-.065em!important;margin:13px 0 20px!important;max-width:100%!important;overflow:visible!important;word-break:keep-all!important}
  .hero-desc{font-size:14px!important;line-height:1.65!important;max-width:100%!important;margin-right:0!important;word-break:keep-all!important}
  .setup-card{width:100%!important;max-width:100%!important;margin-top:24px!important;padding:15px!important;border-radius:15px!important}
  .setup-row{display:block!important;width:100%!important;min-width:0!important}
  .first-button-picker{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important;width:100%!important;margin-top:14px!important}
  .first-button-picker button{min-width:0!important;width:100%!important;padding:10px 3px!important}
  .first-button-picker button[data-first="RANDOM"]{grid-column:1/-1!important}
  .setup-facts{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  .setup-facts span{min-width:0!important;text-align:center!important;font-size:9px!important;padding:7px 5px!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important;width:100%!important;gap:8px!important}
  .hero-actions button{width:100%!important;min-width:0!important}
  .small-note{font-size:9px!important;line-height:1.55!important;word-break:keep-all!important}
  .result-actions{display:grid!important;grid-template-columns:1fr!important}.result-actions button{width:100%!important}
}
@media(max-width:390px){
  .life-shell{padding:0 12px!important}.hero-copy h1{font-size:43px!important}.hero-desc{font-size:13px!important}.setup-card{padding:13px!important}
}

/* v57: mobile HUD — keep desktop order semantics, compress core controls into first screen */
@media(max-width:760px){
  /* Flatten the desktop dashboard only on mobile so core sections can be reordered without duplicating controls. */
  #gameView:not(.hidden){display:flex!important;flex-direction:column!important;max-width:100%!important}
  #gameView>.top-dashboard,
  #gameView>.top-dashboard>.records-column{display:contents!important}
  #gameView>.sim-head{order:1}
  #gameView .button-section{order:2}
  #gameView>#focusSection{order:3}
  #gameView .status-panel{order:4}
  #gameView .skill-section{order:5}
  #gameView>.record-section{order:6}
  #gameView>.life-map-section{order:7}
  #gameView>.event-overlay{order:99}

  .life-header{height:46px!important}
  main{padding-top:10px!important;padding-bottom:72px!important}

  /* Compact top information while preserving pause + 1x/2x/4x/8x/12x/16x/32x controls. */
  .sim-head{display:grid!important;grid-template-columns:1fr!important;gap:6px!important;padding:7px 0 8px!important;margin:0!important}
  .sim-title-block{display:grid!important;grid-template-columns:auto 1fr!important;align-items:center!important;column-gap:8px!important;row-gap:2px!important}
  .sim-title-block .micro-label,.sim-title-block h2{display:none!important}
  .sim-age{grid-column:1!important;gap:6px!important;white-space:nowrap!important}
  .sim-age strong{font-size:17px!important}.sim-age span{font-size:9px!important}
  .origin-line{grid-column:2!important;margin:0!important;justify-self:end!important;min-width:0!important;max-width:100%!important}
  .origin-line span{display:none!important}.origin-line b{font-size:9px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;max-width:48vw!important}
  .time-panel{display:grid!important;grid-template-columns:1fr!important;gap:5px!important;width:100%!important}
  .calendar-line{margin:0!important;justify-content:flex-start!important;gap:5px!important}
  .calendar-line strong{font-size:13px!important}.calendar-line span{font-size:9px!important}
  .time-controls{display:grid!important;grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:4px!important;width:100%!important;margin:0!important}
  .time-controls button{min-width:0!important;width:100%!important;height:30px!important;padding:0 2px!important;border-radius:7px!important;font-size:9px!important;line-height:1!important}
  .day-progress-card{padding:6px 8px!important;border-radius:9px!important;margin:0!important}
  .day-progress-head{margin-bottom:4px!important}.day-progress-head span,.day-progress-head em,.day-progress-head b{font-size:8px!important}.day-progress-head strong{font-size:10px!important}
  .day-track{height:3px!important}.day-marks{display:none!important}
  .next-line{display:grid!important;grid-template-columns:1fr auto!important;align-items:center!important;gap:6px!important;margin:0!important}
  .next-line span{font-size:8px!important;white-space:nowrap!important}.next-line button{padding:6px 10px!important;font-size:9px!important;border-radius:8px!important}
  .auto-toggle{font-size:8px!important;margin:0!important;min-height:18px!important}

  /* Four DJ CLASS cards stay on one row. Only the information needed for quick decisions remains visible. */
  .button-section{margin-top:7px!important;width:100%!important;min-width:0!important}
  .button-section .section-title-inline{margin-bottom:5px!important;align-items:center!important}
  .button-section .section-title-inline>div>span{font-size:7px!important;letter-spacing:.1em!important}
  .button-section .section-title-inline h3{font-size:12px!important;margin:1px 0 0!important}
  .button-section .small-meta{font-size:7px!important;white-space:nowrap!important}
  .button-grid{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;width:100%!important}
  .button-card{min-width:0!important;width:100%!important;min-height:70px!important;height:70px!important;padding:6px 5px!important;border-radius:9px!important;overflow:hidden!important}
  .button-card:before{height:2px!important}
  .rank-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:3px!important}
  .rank-head>div:first-child{min-width:0!important}
  .rank-emblem-wrap{display:grid!important;width:25px!important;height:25px!important;flex:0 0 25px!important;place-items:center!important}
  .rank-emblem{display:block;max-width:25px!important;max-height:25px!important;object-fit:contain!important}
  .rank-fallback{width:19px!important;height:19px!important;font-size:7px!important}
  .button-name{font-size:15px!important;line-height:1!important}.button-state{display:none!important}
  .button-power{font-size:15px!important;line-height:1.1!important;margin-top:3px!important;white-space:nowrap!important;letter-spacing:-.04em!important}
  .button-power .daily-delta{display:none!important}
  .button-class{font-size:7px!important;line-height:1.1!important;min-height:8px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;margin-top:2px!important}
  .button-stats,.button-season{display:none!important}
  .button-bar{height:2px!important;margin-top:5px!important}

  /* Keep the exact desktop focus order: 4B/5B/6B/8B first row, methods second row. */
  #focusSection{margin-top:8px!important;padding:7px!important;border:1px solid #2f3540!important;border-radius:11px!important;background:rgba(10,11,15,.96)!important;position:static!important;box-shadow:none!important}
  .focus-section-head{margin-bottom:5px!important;min-height:20px!important}
  .focus-section-head .section-title-inline>div>span{display:none!important}
  .focus-section-head .section-title-inline h3{font-size:11px!important;margin:0!important}
  .focus-toggle{display:none!important}
  #focusCollapsedSummary{display:none!important}
  #focusBody,#focusBody.hidden{display:block!important}
  .focus-grid{display:grid!important;grid-template-columns:1fr!important;gap:4px!important}
  .focus-group{display:grid!important;grid-template-columns:1fr!important;gap:3px!important}
  .focus-group-label{display:none!important}
  .focus-button-pack,.focus-method-pack{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:4px!important;min-height:0!important}
  .focus-btn{min-width:0!important;width:100%!important;height:43px!important;min-height:43px!important;padding:5px 4px!important;border-radius:8px!important;display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:4px!important;overflow:hidden!important}
  .focus-btn:before{top:5px!important;bottom:5px!important;width:2px!important}
  .focus-icon{width:18px!important;height:18px!important;flex:0 0 18px!important;padding:2px!important;border-radius:5px!important}
  .focus-copy{min-width:0!important;width:auto!important}.focus-title{display:block!important;min-width:0!important}
  .focus-title b{display:block!important;font-size:8px!important;line-height:1.1!important;white-space:normal!important;word-break:keep-all!important;text-align:left!important}
  .focus-title i{display:none!important}.focus-effects{display:none!important}
  .focus-effect-summary{display:none!important}

  /* Only the four visible life stats. Hidden community/reputation values remain hidden. */
  .status-panel{margin-top:8px!important;padding:7px!important;border-radius:11px!important;position:static!important;width:100%!important}
  .status-panel .compact-title{margin-bottom:5px!important}.status-panel .compact-title>div>span{display:none!important}.status-panel .compact-title h3{font-size:11px!important;margin:0!important}
  #statusHelpBtn{display:none!important}
  .status-stack{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:4px!important}
  .status-card{min-width:0!important;gap:5px!important;padding:6px!important;border-radius:8px!important}
  .status-icon{width:20px!important;height:20px!important;border-radius:6px!important;font-size:9px!important}
  .status-line{grid-template-columns:1fr auto!important;gap:3px!important;align-items:center!important}
  .status-line span{font-size:8px!important}.status-line span small{display:none!important}
  .status-line b{font-size:13px!important}.status-line em{display:none!important}
  .meter{height:3px!important;margin-top:3px!important}
  .status-help{display:none!important}
  .risk-chip{margin-top:5px!important;padding:4px 6px!important;font-size:8px!important}

  /* Less frequently used information follows below the first-screen HUD. */
  .skill-section{margin-top:16px!important}
  .record-section,.life-map-section{margin-top:18px!important}
}
@media(max-width:380px){
  .life-shell{padding:0 9px!important}
  .time-controls{gap:3px!important}.time-controls button{font-size:8px!important}
  .focus-btn{padding:4px 3px!important;gap:3px!important}.focus-icon{width:16px!important;height:16px!important;flex-basis:16px!important}.focus-title b{font-size:7.4px!important}
  .button-card{padding-left:4px!important;padding-right:4px!important}.button-name{font-size:14px!important}.button-power{font-size:14px!important}
}