/* Source: styles.css */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{color-scheme:dark;--bg:#171824;--surface:#212332;--surface-raised:#2b2d40;--ink:#fff9f2;--muted:#aaaabc;--line:#ffffff1c;--accent:#ff8bae;--accent-light:#ffb1c9;--mint:#ceef9b;--purple:#baa9ff;--negative:#ffabb5;--radius:20px}
*{box-sizing:border-box}html{min-width:320px;scrollbar-gutter:stable}body{margin:0;background:var(--bg);color:var(--ink);font:600 16px/1.6 'Noto Sans KR','Malgun Gothic',system-ui,sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit;touch-action:manipulation}button,input,select{-webkit-tap-highlight-color:transparent}button{transition:background .16s,transform .16s,border-color .16s,box-shadow .16s}button:disabled{cursor:not-allowed;opacity:.45}button:focus-visible,summary:focus-visible{outline:3px solid var(--mint);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:900;letter-spacing:-.055em;line-height:1.3;word-break:keep-all}p{word-break:keep-all}h2{font-size:28px}h3{font-size:20px}a{color:inherit}.icon{width:22px;height:22px;flex-shrink:0;vertical-align:middle;stroke-width:2}.eyebrow{font-size:12px;letter-spacing:2.4px;font-weight:900;color:var(--accent)}.positive{color:var(--mint)}.negative{color:var(--negative)}.full-width{width:100%}.small-note{font-size:14px;color:var(--muted);margin-top:20px}.primary-btn,.secondary-btn{display:inline-flex;align-items:center;justify-content:center;gap:16px;min-height:60px;padding:15px 25px;border-radius:12px;font-size:19px;font-weight:900;line-height:1.4}.primary-btn{background:var(--accent);color:#281824;box-shadow:0 5px 0 #99516a}.primary-btn .icon{margin-left:auto}.primary-btn:not(:disabled):hover{background:var(--accent-light);transform:translateY(-2px);box-shadow:0 7px 0 #99516a}.primary-btn:not(:disabled):active{transform:translateY(3px);box-shadow:0 2px 0 #99516a}.secondary-btn{background:var(--surface-raised);border:1px solid var(--line);font-size:15px;min-height:48px;gap:9px;padding:10px 17px}.secondary-btn:hover{background:#393b50;border-color:#ffffff50}.text-button{display:inline-flex;align-items:center;gap:7px;padding:9px 0;min-height:44px;font-weight:800;font-size:15px;color:var(--muted)}.text-button:hover{color:var(--ink)}.text-button .icon{width:18px;height:18px}
.game-shell{min-height:100dvh;background:radial-gradient(ellipse at 92% 5%,#46334433,transparent 50%),var(--bg)}.game-header{max-width:1320px;margin:auto;min-height:100px;padding:24px 30px;display:flex;justify-content:space-between;align-items:center;gap:30px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:9px;font-size:22px;font-weight:900;letter-spacing:-1px;white-space:nowrap}.brand>.icon{color:var(--accent);width:27px;height:27px;fill:#ff8bae22}.brand-edition{font-size:14px;letter-spacing:-.5px;background:var(--accent);color:#281824;border-radius:6px;padding:0 6px;transform:rotate(-7deg);margin-left:2px}.stepper{list-style:none;display:flex;gap:26px;margin:0;padding:0}.stepper li{display:flex;gap:9px;align-items:center;color:#8b8b9c;font-size:14px;font-weight:800;position:relative}.stepper li:not(:last-child):after{content:'';width:12px;height:1px;background:#ffffff25;position:absolute;right:-19px}.stepper li>span{width:29px;height:29px;display:grid;place-items:center;border:1px solid #ffffff22;border-radius:50%;font-size:11px;font-weight:900}.stepper li .icon{width:15px;height:15px}.stepper .current{color:var(--ink)}.stepper .current>span{background:var(--accent);border-color:var(--accent);color:#281824;box-shadow:0 0 0 4px #ff8bae14}.stepper .done>span{color:var(--mint);background:#ceef9b15;border-color:#ceef9b35}.stepper .done{color:#bfc4b7}.player-status{display:flex;align-items:center;background:#ffffff05;border:1px solid var(--line);border-radius:15px;padding:17px 24px;margin-bottom:30px;gap:35px}.player-identity{display:flex;gap:14px;align-items:center;min-width:0;margin-right:auto}.player-avatar{width:46px;height:46px;background:#baa9ff16;color:var(--purple);border:1px solid #baa9ff30;border-radius:13px;display:grid;place-items:center;flex-shrink:0}.player-identity strong{display:block;font-size:20px;font-weight:900;overflow-wrap:anywhere}.player-identity small{display:block;font-size:13px;color:var(--muted);overflow-wrap:anywhere}.status-cell{min-width:115px;border-left:1px solid var(--line);padding-left:27px}.status-cell>span{display:flex;gap:4px;align-items:center;font-size:11px;font-weight:900;color:var(--muted);letter-spacing:1px}.status-cell>span .icon{width:13px;height:13px}.status-cell strong{display:block;font-size:27px;line-height:1.5;font-weight:900;letter-spacing:-1px}.status-cell strong small{font-size:13px;color:var(--muted);font-weight:700;letter-spacing:0}.status-cell:nth-child(3) strong{color:var(--mint)}
/* Player creation */
.setup-screen{min-height:100dvh;display:grid;grid-template-columns:1.05fr 1fr;max-width:1600px;margin:auto}.setup-art{position:relative;isolation:isolate;overflow:hidden;padding:46px 55px 32px;min-height:780px;display:flex;flex-direction:column;background:radial-gradient(ellipse at 50% 70%,#8d5362,transparent 70%),linear-gradient(140deg,#303046,#252233);border-right:1px solid var(--line)}.setup-art:after{content:'';position:absolute;inset:0;z-index:-1;opacity:.25;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:32px 32px;mask-image:linear-gradient(black,transparent)}.setup-brand{font-size:12px;letter-spacing:3px;font-weight:900;display:flex;align-items:center;gap:9px}.setup-brand .icon{color:var(--accent)}.setup-art h1{font-size:clamp(70px,7.7vw,112px);line-height:1.02;margin-top:34px;letter-spacing:-9px;position:relative;z-index:2}.setup-art h1>span{color:var(--accent)}.setup-art h1>i{font-style:normal;font-size:.5em;display:inline-block;vertical-align:top;margin:15px 0 0 20px;letter-spacing:-4px;color:transparent;-webkit-text-stroke:1px var(--accent);transform:rotate(-10deg)}.portrait{background-image:var(--atlas);background-size:var(--sx) var(--sy);background-position:var(--px) var(--py);background-repeat:no-repeat;aspect-ratio:4/5;background-color:#46404b}.portrait-collage{position:relative;min-height:330px;flex:1;margin:-12px -18px 12px;display:flex;align-items:center;justify-content:center}.portrait-collage .portrait{position:relative;width:36%;border:5px solid #f5e9e6;border-radius:15px;box-shadow:0 20px 45px #100d2277}.portrait-collage .portrait:first-child{transform:rotate(-12deg) translate(15px,24px);z-index:1}.portrait-collage .portrait:nth-child(2){width:41%;transform:translateY(-8px);z-index:3}.portrait-collage .portrait:last-child{transform:rotate(12deg) translate(-15px,34px);z-index:2}.setup-numbers{display:flex;gap:45px;padding-top:10px;border-top:1px solid #ffffff2b}.setup-numbers span{font-size:14px;color:#e5d2d5;display:flex;align-items:baseline;gap:10px}.setup-numbers b{font-size:34px;font-weight:900;color:var(--ink)}.setup-form-panel{align-self:center;padding:65px clamp(30px,5vw,85px);width:100%;max-width:700px;margin:auto}.setup-form-panel h2{font-size:clamp(30px,3.2vw,45px);margin:17px 0 18px}.intro{color:var(--muted);font-size:15px;margin-bottom:35px}.setup-form-panel label{display:flex;justify-content:space-between;font-size:15px;font-weight:800;margin:24px 0 10px}.setup-form-panel label>span{font-size:11px;font-weight:500;color:var(--muted)}input,select{border:1px solid #ffffff28;background:#262836;color:var(--ink);border-radius:10px;min-height:54px;padding:12px 16px;min-width:0}input::placeholder{color:#8d8e9e;font-weight:500}input:focus,input:focus-visible,select:focus,select:focus-visible,textarea:focus,textarea:focus-visible{outline:none;box-shadow:none}.setup-form-panel input{width:100%;font-size:18px;font-weight:800}.setup-fields{display:grid;grid-template-columns:110px 1fr;gap:20px}.input-suffix{position:relative}.input-suffix input{padding-right:35px;appearance:textfield;-moz-appearance:textfield}.input-suffix input::-webkit-inner-spin-button{appearance:none}.input-suffix>span{position:absolute;right:15px;top:15px;font-size:14px;color:var(--muted)}.setup-rules{display:flex;flex-direction:column;gap:10px;border:1px solid var(--line);border-radius:12px;margin:27px 0 18px;padding:16px;background:#ffffff03}.setup-rules>span{display:flex;gap:9px;align-items:center;font-size:13px;color:#c2c2d0}.setup-rules .icon{color:var(--purple);width:18px;height:18px}.save-note{display:block;text-align:center;font-size:11px;line-height:1.8;font-weight:500;color:var(--muted);margin:25px 0 0}.save-note .icon{width:13px;height:13px;margin-right:4px}.form-error{color:var(--negative);font-size:13px;margin-bottom:12px}.form-error:empty{display:none}
/* Step 1: location selection */
.hunt-layout{display:grid;grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);gap:30px}.section-label{display:flex;justify-content:space-between;font-size:11px;font-weight:900;letter-spacing:1.4px;color:var(--muted);margin-bottom:15px}.section-label>span{color:#707180;font-size:10px}.location-option{display:flex;align-items:center;gap:17px;width:100%;text-align:left;min-height:95px;border:1px solid var(--line);background:var(--surface);border-radius:14px;padding:18px;margin-bottom:12px}.location-number{font-size:14px;font-weight:900;color:#797b90}.location-option-copy{flex:1}.location-option strong{font-size:23px;font-weight:900;display:block;letter-spacing:-1px}.location-option small{font-size:12px;color:var(--muted);display:block;margin-top:4px;font-weight:500}.selection-dot{border:1px solid #ffffff40;border-radius:50%;width:23px;height:23px;display:grid;place-items:center}.selection-dot .icon{width:15px;height:15px}.location-option.selected{background:#332935;border:2px solid var(--accent);padding:17px;box-shadow:0 0 0 4px #ff8bae07}.location-option.selected .selection-dot{background:var(--accent);color:#281824;border-color:var(--accent)}.location-option.selected .location-number{color:var(--accent)}.location-option:not(.selected):hover{border-color:#ffffff60;transform:translateX(3px)}.rule-note{display:flex;gap:9px;align-items:flex-start;color:var(--muted);font-size:12px;font-weight:500;margin:18px 2px 6px;max-width:340px;line-height:1.8}.rule-note .icon{width:16px;height:16px;margin-top:3px}.skip-button{font-size:13px;margin-top:1px}.hunting-scene{position:relative;min-height:438px;overflow:hidden;border-radius:var(--radius);isolation:isolate;border:1px solid #ffffff25;box-shadow:0 14px 40px #0002}.scene-art{position:absolute;inset:0;z-index:-3;background-image:url('./assets/locations.png');background-size:auto 300%;background-repeat:no-repeat;background-position:center 100%;transition:filter .3s}.pocha .scene-art{background-position:center 0}.bar .scene-art{background-position:center 50%}.scene-overlay{position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#10132136 0%,#15172700 25%,#121623dd 100%)}.scene-top{display:flex;justify-content:space-between;align-items:center;padding:23px 25px;font-size:11px;letter-spacing:1px}.scene-top>b{text-shadow:0 1px 4px #000}.scene-tag{display:flex;align-items:center;gap:7px;background:#181c2ba3;backdrop-filter:blur(12px);padding:7px 11px;border-radius:7px;font-size:10px}.scene-tag .icon{width:15px;height:15px}.scene-content{position:absolute;inset:auto 0 0;padding:30px}.scene-caption{font-size:12px;color:#ffffffcf}.scene-content h2{font-size:40px;letter-spacing:-2px;margin:7px 0 24px;text-shadow:0 2px 18px #0007}.hunt-launch{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:20px;border-top:1px solid #ffffff4a}.success-chance>span{display:block;font-size:12px}.success-chance strong{display:block;font-size:37px;font-weight:900;line-height:1.3;color:var(--mint);letter-spacing:-2px}.hunt-launch .primary-btn{min-width:210px}
/* Step 2: dating */
.dating-rule{display:flex;align-items:center;gap:12px;background:#ff8bae0b;border:1px solid #ff8bae28;border-radius:12px;padding:16px 20px;margin-bottom:28px;font-size:14px}.dating-rule>.icon{color:var(--accent);width:19px;height:19px}.dating-rule strong{font-size:14px}.dating-rule>span{margin-left:auto;font-size:12px;color:var(--muted)}.dating-rule b{color:var(--accent);margin-right:5px}.date-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:18px}.card-number{position:absolute;top:13px;left:12px;background:#191b2ab0;color:#fff;padding:3px 6px;border-radius:4px;font-size:9px;font-weight:900;letter-spacing:1px;line-height:1.5}.relation-bar{height:5px;background:#ffffff12;border-radius:4px;overflow:hidden}.relation-bar i{display:block;height:100%;background:var(--accent);border-radius:4px}.date-footer{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:30px;padding-top:25px;border-top:1px solid var(--line)}.date-odds{display:flex;gap:18px;align-items:center;font-size:12px;color:var(--muted)}.date-odds b{display:block;font-size:20px;font-weight:900}.date-actions{display:flex;align-items:center;gap:25px}.date-actions .primary-btn{min-width:240px}.growth-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:20px}.growth-card{position:relative;text-align:left;border:1px solid var(--line);border-radius:18px;padding:23px 21px 22px;background:linear-gradient(145deg,#343244,#242637);min-width:0;overflow:hidden}.growth-card:hover{transform:translateY(-8px);border-color:var(--purple);box-shadow:0 15px 30px #0004}.growth-top{display:flex;justify-content:space-between;align-items:center;color:var(--muted);font-size:9px;font-weight:900;letter-spacing:1px}.growth-top>.icon{width:18px}.activity-symbol{width:78px;height:78px;border-radius:24px;margin:35px auto 38px;display:grid;place-items:center;transform:rotate(-8deg);color:var(--purple);background:#baa9ff17;border:1px solid #baa9ff55;box-shadow:0 12px 0 #15172755}.activity-symbol .icon{width:38px;height:38px;transform:rotate(8deg);stroke-width:1.8}.growth-card h2{font-size:24px;min-height:62px;display:flex;align-items:flex-end}.growth-card p{font-size:12px;font-weight:500;line-height:1.8;color:var(--muted);min-height:66px;margin-top:12px}.growth-gain{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #ffffff15;margin-top:22px;padding-top:15px}.growth-gain span{font-size:11px;color:var(--mint);font-weight:900}.growth-gain strong{font-size:37px;font-weight:900;line-height:1;color:var(--mint);letter-spacing:-2px}.growth-exercise .activity-symbol{color:var(--mint);background:#ceef9b15;border-color:#ceef9b50}.growth-shopping .activity-symbol{color:var(--accent);background:#ff8bae15;border-color:#ff8bae50}.growth-work .activity-symbol{color:#ffd19b;background:#ffd19b15;border-color:#ffd19b50}
/* Step 4: weekly results */
.complete-seal{font-size:13px;display:flex;align-items:center;gap:10px;font-weight:900;letter-spacing:1px;color:var(--mint);background:#ceef9b11;border:1px solid #ceef9b40;padding:10px 16px;border-radius:8px;transform:rotate(-4deg)}.summary-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr);gap:24px}.weekly-results,.collection-summary{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:25px}.weekly-results>h2,.collection-summary>h2{font-size:21px;margin-bottom:10px}.summary-entry{display:flex;gap:14px;padding:20px 0;border-bottom:1px solid var(--line)}.summary-entry:last-child{border:0;padding-bottom:0}.summary-symbol{background:#ffffff08;border:1px solid var(--line);border-radius:10px;display:grid;place-items:center;width:38px;height:38px;flex-shrink:0;color:var(--purple)}.summary-symbol .icon{width:19px;height:19px}.summary-entry>div{flex:1;min-width:0}.summary-entry h3{font-size:17px;letter-spacing:-.4px}.summary-entry p{font-size:12px;color:var(--muted);margin-top:5px;line-height:1.8;font-weight:500}.summary-delta{font-size:22px;flex-shrink:0;line-height:1.3}.collection-summary>.eyebrow{font-size:10px;margin-bottom:10px}.collection-summary>div:not(.eyebrow):not(.summary-collection-tools){display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);font-size:14px;color:var(--muted)}.collection-summary strong{font-size:27px;font-weight:900;line-height:1;color:var(--ink)}.collection-summary strong small{font-size:12px;color:var(--muted);font-weight:500}.summary-collection-tools{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.summary-collection-tools .secondary-btn{flex:1;font-size:13px;padding:10px}.summary-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;border-top:1px solid var(--line);margin-top:30px;padding-top:25px}.summary-tools{display:flex;gap:23px;flex-wrap:wrap}.summary-tools .text-button{font-size:12px}.summary-bottom>.primary-btn{min-width:250px}.deadline-note{color:var(--accent);font-size:13px;text-align:right;margin-top:20px}.neglect-report{font-size:12px;border:1px solid #ff8bae22;border-radius:9px;background:#ff8bae06;margin-top:15px;text-align:left;overflow:hidden}.neglect-report summary{cursor:pointer;list-style:none;padding:10px 12px;color:#d4bdc8;display:flex;align-items:center;gap:5px;flex-wrap:wrap}.neglect-report summary::-webkit-details-marker{display:none}.neglect-report summary:after{content:'+';margin-left:auto;font-size:18px;line-height:1}.neglect-report[open] summary:after{content:'−'}.neglect-report summary>.icon{width:14px;height:14px}.neglect-report summary b{font-size:11px;font-weight:800;color:var(--accent);margin-left:2px}.neglect-report>div{display:grid;gap:0;padding:0 12px 8px;max-height:195px;overflow:auto}.neglect-report>div>span{display:flex;align-items:center;gap:12px;padding:6px 0;border-top:1px solid var(--line);font-size:12px}.neglect-report strong{font-weight:600;margin-right:auto}.neglect-report small{font-size:11px;color:var(--muted);min-width:61px;text-align:right}.contacts-modal,.journal-modal{padding:32px;max-width:1100px}.inventory-toolbar{display:flex;flex-direction:column;gap:20px;margin-bottom:24px}.filter-tabs{display:flex;gap:8px;flex-wrap:wrap}.filter-tabs button{font-size:13px;font-weight:800;border-radius:8px;padding:8px 15px;min-height:40px;background:#ffffff08;color:var(--muted);border:1px solid transparent}.filter-tabs .active{background:var(--accent);color:#291821}.inventory-controls{display:flex;gap:12px}.search-field{flex:1;display:flex;align-items:center;gap:8px;background:#2a2c3c;border:1px solid var(--line);border-radius:9px;padding-left:13px;color:var(--muted)}.search-field input{width:100%;border:0;min-height:46px;background:none;font-size:13px}.search-field .icon{width:17px;height:17px}.inventory-controls select{min-height:46px;font-size:13px;font-weight:700;padding:8px 12px}.inventory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:16px}.portrait-name{position:absolute;bottom:14px;left:13px;right:10px;z-index:1}.portrait-name h3{font-size:22px;display:flex;align-items:baseline;gap:7px}.portrait-name h3>span{font-size:11px;font-weight:500;letter-spacing:0}.portrait-name p{font-size:11px;font-weight:500;color:#eeeaed;margin-top:4px}.card-info{padding:12px}.card-relationship{display:flex;justify-content:space-between;align-items:center;font-size:10px;gap:5px;margin-bottom:9px;color:var(--muted)}.card-relationship>b{font-size:19px;font-weight:900;color:var(--accent)}
.ending-art {position:relative;overflow:hidden;min-width:0;background:#33303d}
.ending-art>.portrait {position:absolute;top:0;left:50%;transform:translateX(-50%);height:100%;width:auto;min-width:100%;aspect-ratio:4/5}.album-caption{font-size:12px;color:var(--muted);margin:25px 0 20px}.locked-memory{display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;border:1px dashed #ffffff25;border-radius:12px;text-align:center;padding:25px 10px;min-height:200px;color:var(--muted)}.locked-memory strong{font-size:13px}.locked-memory span{font-size:10px}.memory-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}.memory-card{padding:0;border-radius:12px;border:1px solid var(--line);overflow:hidden;background:#2a2c3d;text-align:left}.memory-art{position:relative;aspect-ratio:5/4;overflow:hidden}.memory-art>.portrait{width:100%}.memory-art>span{position:absolute;bottom:10px;left:10px;font-size:9px;letter-spacing:1px;background:#1c1e2a90;padding:4px 8px;border-radius:4px}.memory-card>div:last-child{padding:15px}.memory-card small{font-size:11px;color:var(--accent)}.memory-card h3{font-size:19px;margin-top:6px}.memory-card p{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:11px;margin-top:10px;color:var(--muted)}.memory-card p .icon{width:15px;height:15px}.night .portrait{filter:brightness(.65) saturate(.8)}.memory-modal{max-width:620px;padding-bottom:20px;text-align:center}.memory-scene{position:relative;min-height:600px;overflow:hidden}.memory-scene>.portrait{width:100%;position:absolute;min-height:100%;aspect-ratio:4/5;top:0}.memory-scene-copy{position:relative;z-index:1;padding:330px 32px 30px;background:linear-gradient(transparent 30%,#141622b0 55%,#141622 90%);text-align:left;min-height:600px}.memory-scene-copy h2{font-size:32px;margin:10px 0 17px}.memory-scene-copy p{font-size:15px;font-weight:500;line-height:1.9}.memory-modal>.secondary-btn{margin-top:18px}
.ending-modal {display:flex;max-width:840px}
.ending-art {width:40%;flex-shrink:0;min-height:500px}
.ending-content {flex:1;padding:44px 32px 32px;min-width:0}
.ending-content>p {font-size:14px;color:var(--muted);line-height:1.9}
.ending-content>.primary-btn {width:100%;margin-top:28px;font-size:17px}.result-symbol{width:66px;height:66px;display:grid;place-items:center;background:#ff8bae15;color:var(--accent);border:1px solid #ff8bae30;border-radius:19px;margin:25px 0}.result-symbol .icon{width:30px;height:30px}.result-change{display:flex;align-items:baseline;gap:12px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:15px 0;margin-top:22px}.result-change>span{font-size:15px}.result-change>b{font-size:42px;font-weight:900;letter-spacing:-2px;line-height:1.2}.result-change>small{margin-left:auto;font-size:12px;color:var(--muted)}.unlock-notice{background:#ceef9b11;border:1px solid #ceef9b30;color:var(--mint);padding:12px;border-radius:9px;margin-top:15px;font-size:12px;display:flex;align-items:center;gap:7px}.unlock-notice .icon{width:17px;height:17px}.confess-modal,.restart-modal{max-width:560px;padding:40px 32px}
.confess-modal h2 {font-size:31px;margin-top:15px}.confess-modal p,.restart-modal p{font-size:14px;color:var(--muted);margin-top:20px;line-height:1.9}.confirm-actions{display:flex;gap:12px;margin-top:30px}.confirm-actions>button{flex:1;font-size:16px;padding:13px 17px}.ending-modal:not(:has(.ending-art)){max-width:540px}.ending-content{padding:55px 35px 35px}.ending-content>.text-button{display:flex;margin:14px auto 0;font-size:12px}.ending-stats{display:flex;justify-content:space-between;gap:15px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin-top:27px}.ending-stats span{font-size:11px;color:var(--muted)}.ending-stats b{display:block;font-size:30px;color:var(--ink);line-height:1.4}.end-page-actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:40px}.ended-stage{padding-top:15vh}.help-modal{max-width:640px;padding:40px 32px}.help-rules{padding-left:22px;font-size:14px;font-weight:500;color:var(--muted);line-height:1.9}.help-rules li{margin-bottom:15px;padding-left:4px}.help-rules b{color:var(--ink);font-weight:900}.journal{display:flex;flex-direction:column}.journal>article{display:flex;gap:20px;padding:22px 0;border-bottom:1px solid var(--line)}.journal>article>b{color:var(--accent);font-size:14px;min-width:45px}.journal>article>div{flex:1}.journal h3{font-size:19px}.journal p{font-size:13px;color:var(--muted);margin-top:5px}.empty-state{padding:55px 25px;text-align:center;color:var(--muted);grid-column:1/-1;font-size:15px}.empty-state h2{font-size:24px;color:var(--ink);margin-bottom:15px}.empty-state p{font-size:14px}#toast:empty{display:none}@keyframes modal-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1500px){.hunt-layout{gap:36px}.hunting-scene{min-height:470px}}
@media(max-width:1100px){.game-header{padding:22px 25px;min-height:90px}.brand{font-size:20px}.stepper{gap:20px}.stepper li{font-size:12px;gap:6px}.stepper li:not(:last-child):after{width:8px;right:-14px}.hunt-layout{grid-template-columns:330px 1fr;gap:22px}.scene-content{padding:23px}.hunt-launch{gap:14px}.hunt-launch .primary-btn{min-width:160px;padding:14px 20px;font-size:17px}.status-cell{min-width:100px;padding-left:20px}.player-status{gap:22px}.growth-grid{gap:12px}.growth-card{padding:20px 14px}.growth-card h2{font-size:21px}.growth-card p{font-size:11px}.growth-top{font-size:8px}.setup-art{padding:40px;min-height:740px}.setup-art h1{letter-spacing:-6px}.setup-form-panel{padding:45px 35px}.dating-rule{flex-wrap:wrap}.dating-rule>span{margin-left:31px;width:100%}.date-grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr))}.summary-layout{grid-template-columns:1.3fr 1fr}.summary-collection-tools{flex-direction:column}.summary-tools{gap:15px}}
@media(max-width:820px){.game-header{flex-direction:column;gap:20px;align-items:flex-start;padding:22px 24px 20px}.stepper{width:100%;justify-content:space-between}.stepper li{font-size:12px}.stepper li:not(:last-child):after{display:none}.brand{font-size:19px}.brand>.icon{width:23px;height:23px}.hunt-layout{grid-template-columns:1fr}.location-picker{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.section-label{grid-column:1/-1;margin-bottom:0}.location-option{flex-direction:column;align-items:flex-start;position:relative;padding:15px;min-height:125px;margin-bottom:0;gap:7px}.location-option.selected{padding:14px}.location-option strong{font-size:21px}.location-option small{font-size:10px;word-break:keep-all}.location-number{font-size:11px}.selection-dot{position:absolute;right:12px;top:13px;width:19px;height:19px}.selection-dot .icon{width:13px;height:13px}.rule-note{grid-column:1/3;font-size:11px;margin:3px 0 0;max-width:none}.skip-button{grid-column:3;justify-self:end;font-size:11px;align-self:start;padding-top:0;min-height:30px;margin:0}.hunting-scene{min-height:360px}.scene-content h2{font-size:35px;margin-bottom:18px}.hunt-launch .primary-btn{min-width:230px}.player-status{gap:18px;padding:15px 20px}.status-cell.remaining{display:none}.player-identity strong{font-size:19px}.status-cell strong{font-size:25px}.date-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.date-footer{flex-direction:column;align-items:stretch;gap:20px}.date-odds{gap:28px}.date-odds b{display:inline;margin-left:5px;font-size:17px}.date-actions{justify-content:space-between}.date-actions .primary-btn{min-width:270px}.growth-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:16px;margin-top:0}.growth-card{grid-column:span 2;padding:20px}.growth-card:nth-child(n+4){grid-column:span 3}.growth-card h2{min-height:0;font-size:24px}.growth-card p{font-size:12px;min-height:50px}.activity-symbol{margin:23px auto 25px;width:65px;height:65px;border-radius:20px}.activity-symbol .icon{width:31px;height:31px}.growth-top{font-size:9px}.growth-gain{margin-top:15px}.growth-gain strong{font-size:31px}.summary-layout{grid-template-columns:1fr}.summary-collection-tools{flex-direction:row}.collection-summary>div:not(.eyebrow):not(.summary-collection-tools){padding:13px 0}.setup-screen{grid-template-columns:1fr}.setup-art{min-height:425px;padding:30px 45px;border-right:0;border-bottom:1px solid var(--line)}.setup-art h1{font-size:77px;position:absolute;top:80px;left:45px;margin:0;letter-spacing:-6px}.setup-art h1 i{margin-left:15px}.portrait-collage{position:absolute;width:54%;right:16px;top:90px;bottom:75px;min-height:0;margin:0}.portrait-collage .portrait{border-width:3px;border-radius:10px}.setup-numbers{margin-top:auto;gap:35px;padding-top:15px}.setup-numbers b{font-size:27px}.setup-numbers span{font-size:12px}.setup-form-panel{padding:40px;max-width:600px}.setup-form-panel h2 br{display:none}.setup-form-panel h2{font-size:31px}.intro{margin-bottom:25px}.setup-form-panel label{margin-top:20px}.inventory-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:540px){body{font-size:15px}.game-header{padding:18px 20px 16px;gap:17px}.brand{font-size:18px}.brand-edition{font-size:12px}.brand>.icon{width:21px;height:21px}.stepper{gap:7px}.stepper li{gap:6px;font-size:10px}.stepper li>span{width:23px;height:23px;font-size:9px}.stepper .current>span{box-shadow:none}.stepper .done>span .icon{width:12px;height:12px}.eyebrow{font-size:10px;letter-spacing:2px}.player-status{padding:16px;gap:13px;display:grid;grid-template-columns:1fr 1fr;border-radius:12px;margin-bottom:25px}.player-identity{grid-column:1/-1;padding-bottom:13px;border-bottom:1px solid var(--line);margin:0}.player-avatar{width:36px;height:36px;border-radius:10px}.player-avatar .icon{width:18px;height:18px}.player-identity strong{font-size:17px}.player-identity small{font-size:11px}.status-cell{padding:0;min-width:0;border:0;display:flex;align-items:center;justify-content:space-between;gap:5px}.status-cell:nth-child(3){padding-left:13px;border-left:1px solid var(--line)}.status-cell>span{font-size:9px;letter-spacing:.5px}.status-cell strong{font-size:23px;line-height:1.3}.status-cell strong small{font-size:10px}.section-label{font-size:9px}.section-label>span{font-size:9px}.location-picker{gap:8px}.location-option{padding:12px 10px;min-height:114px;border-radius:11px}.location-option.selected{padding:11px 9px}.location-option strong{font-size:18px;letter-spacing:-.7px}.location-option small{font-size:9px;line-height:1.7;margin-top:3px}.location-option-copy{flex:0}.selection-dot{top:10px;right:10px;width:16px;height:16px}.selection-dot .icon{width:11px;height:11px}.location-number{font-size:10px}.rule-note{font-size:10px;grid-column:1/-1}.rule-note .icon{width:13px;height:13px;margin-top:3px}.skip-button{grid-column:1/-1;font-size:11px;justify-self:end;margin-top:-2px}.hunting-scene{min-height:330px;border-radius:15px}.scene-top{padding:17px 18px;font-size:10px}.scene-tag{font-size:8px;padding:6px 8px}.scene-content{padding:22px}.scene-caption{font-size:10px}.scene-content h2{font-size:31px;margin-bottom:18px}.hunt-launch{padding-top:17px;gap:15px}.success-chance>span{font-size:10px}.success-chance strong{font-size:30px}.hunt-launch .primary-btn{min-width:0;flex:1;max-width:190px;font-size:17px;min-height:55px;padding:12px 17px}.hunt-launch .icon{width:19px}.hunt-layout{gap:15px}.dating-rule{padding:13px 14px;gap:8px;margin-bottom:24px}.dating-rule>strong{font-size:12px;flex:1;line-height:1.7}.dating-rule>.icon{width:16px;height:16px}.dating-rule>span{font-size:10px;line-height:1.8;margin-left:24px}.date-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.card-number{top:10px;left:9px;font-size:8px;padding:2px 4px}.date-footer{margin-top:24px;padding-top:20px;gap:18px}.date-odds{justify-content:space-between;gap:10px;font-size:11px}.date-odds b{font-size:16px;margin-left:3px}.date-actions{gap:10px;flex-direction:column-reverse;align-items:stretch}.date-actions .primary-btn{min-width:0;font-size:18px;width:100%}.date-actions .text-button{justify-content:center;font-size:12px;padding:8px}.small-note{font-size:11px;line-height:1.9;margin-top:12px}.growth-grid{grid-template-columns:1fr;gap:12px;margin-top:0}.growth-card,.growth-card:nth-child(n+4){grid-column:auto;display:grid;grid-template-columns:64px 1fr auto;column-gap:15px;row-gap:4px;padding:19px 17px;border-radius:13px}.growth-top{position:absolute;top:11px;right:15px;font-size:8px}.growth-top>span{display:none}.growth-top .icon{width:16px;height:16px}.activity-symbol{grid-column:1;grid-row:1/3;width:54px;height:54px;border-radius:16px;margin:8px 0 5px;align-self:center;box-shadow:0 6px 0 #15172755}.activity-symbol .icon{width:26px;height:26px}.growth-card h2{grid-column:2;grid-row:1;font-size:21px;align-self:end;margin-top:3px}.growth-card p{grid-column:2;grid-row:2;font-size:10px;min-height:0;margin:0;line-height:1.8;align-self:start}.growth-gain{grid-column:3;grid-row:1/3;display:flex;flex-direction:column-reverse;justify-content:center;gap:6px;border:0;margin:6px 0 0;padding:0;min-width:42px}.growth-gain span{font-size:8px}.growth-gain strong{font-size:29px}.complete-seal{display:inline-flex;font-size:10px;padding:6px 10px;transform:none}.complete-seal .icon{width:16px;height:16px}.weekly-results,.collection-summary{padding:20px 16px;border-radius:13px}.weekly-results>h2,.collection-summary>h2{font-size:20px}.summary-entry{gap:10px;padding:18px 0}.summary-symbol{width:30px;height:30px;border-radius:8px}.summary-symbol .icon{width:15px;height:15px}.summary-entry h3{font-size:16px;line-height:1.5}.summary-entry p{font-size:10px;line-height:1.9}.summary-delta{font-size:18px}.summary-layout{gap:18px}.collection-summary strong{font-size:23px}.collection-summary>div:not(.eyebrow):not(.summary-collection-tools){font-size:12px}.summary-bottom{flex-direction:column-reverse;align-items:stretch;padding-top:22px;gap:23px}.summary-bottom>.primary-btn{width:100%;min-width:0;font-size:18px}.summary-tools{justify-content:center;gap:21px}.summary-tools .text-button{font-size:10px}.summary-tools .icon{width:14px;height:14px}.deadline-note{text-align:left;font-size:11px}.neglect-report{font-size:10px}.neglect-report summary{padding:9px 10px}.neglect-report summary b{font-size:9px}.neglect-report>div>span{font-size:11px;gap:9px}.neglect-report small{font-size:10px}.setup-art{min-height:340px;padding:25px}.setup-brand{font-size:9px;letter-spacing:2px}.setup-brand .icon{width:17px;height:17px}.setup-art h1{top:82px;left:25px;font-size:64px;letter-spacing:-5px}.setup-art h1>i{margin:8px 0 0 12px;font-size:.45em;letter-spacing:-1px}.portrait-collage{right:4px;width:54%;top:78px;bottom:80px}.portrait-collage .portrait{border-width:3px;border-radius:8px}.portrait-collage .portrait:first-child{transform:rotate(-12deg) translate(9px,18px)}.portrait-collage .portrait:last-child{transform:rotate(12deg) translate(-9px,25px)}.setup-numbers{padding-top:11px;gap:23px}.setup-numbers b{font-size:25px}.setup-numbers span{font-size:10px;gap:6px}.setup-form-panel{padding:30px 24px 35px}.setup-form-panel h2{font-size:28px;margin:12px 0}.setup-form-panel h2 br{display:block}.intro{font-size:12px;margin-bottom:25px}.setup-form-panel label{font-size:13px;margin:17px 0 9px}.setup-form-panel input{font-size:15px;min-height:52px}.setup-fields{grid-template-columns:90px 1fr;gap:13px}.setup-form-panel .primary-btn{font-size:18px;min-height:57px}.setup-rules{padding:14px;margin:22px 0}.setup-rules>span{font-size:11px}.save-note{font-size:10px;margin-top:22px}.contacts-modal,.journal-modal{padding:25px 17px}.inventory-toolbar{gap:15px}.filter-tabs{gap:5px}.filter-tabs button{font-size:10px;padding:7px 10px;min-height:35px;border-radius:6px}.inventory-controls{gap:8px}.search-field{padding-left:9px}.search-field input{font-size:11px;padding:10px 7px;min-height:42px}.search-field .icon{width:14px;height:14px}.inventory-controls select{font-size:10px;padding:6px;max-width:105px;min-height:42px}.inventory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.portrait-name{bottom:11px;left:11px}.portrait-name h3{font-size:20px;gap:5px}.portrait-name h3>span{font-size:10px}.portrait-name p{font-size:10px}.card-info{padding:10px}.card-relationship{font-size:9px;margin-bottom:7px}.card-relationship>b{font-size:17px}.locked-memory{min-height:170px}.locked-memory strong{font-size:12px}.locked-memory span{font-size:9px}.memory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.memory-card>div:last-child{padding:12px}.memory-card h3{font-size:16px;line-height:1.5}.memory-card p{font-size:10px}.memory-card small{font-size:10px}.memory-art>span{font-size:8px;padding:3px 5px;left:7px;bottom:7px}.memory-scene{min-height:540px}.memory-scene-copy{padding:280px 24px 30px;min-height:540px}.memory-scene-copy h2{font-size:29px}.memory-scene-copy p{font-size:13px;line-height:2}
.ending-modal {display:block}
.ending-art {width:100%;height:230px;min-height:0}
.ending-art>.portrait {height:auto;width:100%;aspect-ratio:4/5;top:-40px}
.ending-content {padding:27px 23px}.result-change{margin-top:17px;padding:13px 0}.result-change>span{font-size:13px}.result-change>b{font-size:36px}.result-change>small{font-size:11px}
.ending-content>.primary-btn {font-size:17px;min-height:54px;margin-top:22px}.result-symbol{width:53px;height:53px;margin:20px 0;border-radius:15px}.result-symbol .icon{width:26px;height:26px}.confess-modal,.restart-modal,.help-modal{padding:30px 23px}
.confess-modal h2 {font-size:27px}.confess-modal p,.restart-modal p{font-size:12px}.confirm-actions{gap:10px;margin-top:25px}.confirm-actions>button{font-size:14px;min-height:51px;padding:12px}.confirm-actions .icon{width:16px;height:16px}.ending-content>p{font-size:12px}.ending-stats{gap:12px;margin-top:22px}.ending-stats b{font-size:27px}.ending-stats span{font-size:10px}.help-rules{font-size:12px;line-height:2;padding-left:20px}.help-rules li{margin-bottom:13px}.journal>article{gap:12px;padding:18px 0}.journal>article>b{font-size:12px;min-width:30px}.journal h3{font-size:17px}.journal p{font-size:11px}.empty-state{padding:40px 15px;font-size:13px}.empty-state h2{font-size:20px}.empty-state p{font-size:12px}.ended-stage{padding-top:60px}.end-page-actions{flex-direction:column;margin-top:28px}}


/* Source: settings.css */
/* Player setup, the persistent game menu, and appearance settings. */
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.title-actions{position:absolute;top:16px;right:24px;z-index:30;display:flex;align-items:center;gap:10px}
.title-action-trigger{display:grid;place-items:center;width:40px;height:40px;padding:0;border:0;border-radius:10px;background:transparent;color:var(--muted);transition:color 180ms,background-color 180ms}
.title-action-trigger:hover{color:var(--accent);background:var(--surface-raised)}
.title-action-trigger .icon{width:23px;height:23px;stroke-width:1.8}
@media(max-width:820px){.title-actions{right:20px;gap:8px}.title-action-trigger{width:36px;height:36px}}
.title-screen{--title-footer-space:calc(64px + env(safe-area-inset-bottom));position:relative;min-height:100dvh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:76px 24px var(--title-footer-space);background:radial-gradient(ellipse at 50% 12%,#aa52752b,transparent 48%),radial-gradient(ellipse at 80% 95%,#7e65c512,transparent 45%),var(--bg)}
.title-version{display:grid;gap:5px;position:absolute;bottom:calc(12px + env(safe-area-inset-bottom));left:0;right:0;text-align:center;font-size:11px;line-height:1.4;font-weight:500;letter-spacing:.08em;color:var(--muted)}
.title-credit,.title-version-links{display:flex;align-items:baseline;justify-content:center;gap:8px}.title-credit strong{font-size:14px;font-weight:700;letter-spacing:.04em;color:var(--ink)}.title-credit small{font-size:10px;letter-spacing:.02em}.title-version-links{gap:6px}
.title-version a{text-decoration:none;letter-spacing:0}.title-version a:hover{text-decoration:underline}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.player-setup input:focus,.player-setup select:focus{outline:none;border-color:#ffffff28;box-shadow:none}
[data-theme="light"] .player-setup input:focus,[data-theme="light"] .player-setup select:focus{border-color:#42273f2a}
.title-heading{width:min(620px,100%);text-align:center;margin:0 0 32px}.title-heading h1{margin:0;line-height:0}.title-logo{display:block;width:100%;height:auto}
.player-setup{width:100%;max-width:460px;padding:28px 32px 25px;background:var(--surface);border:1px solid var(--line);border-radius:22px;box-shadow:0 24px 65px #0002}.player-setup h2{font-size:17px;letter-spacing:-.5px;margin:0 0 24px}.player-setup label{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:800;margin:0 0 10px}.player-setup label>span{font-size:10px;font-weight:500;color:var(--muted)}.player-setup input,.player-setup select{width:100%;font-size:16px;font-weight:700;min-height:54px}.player-setup select{cursor:pointer;padding:12px}.player-setup .setup-fields{display:grid;grid-template-columns:110px 1fr;gap:16px;margin:20px 0 27px}.player-setup .primary-btn{min-height:56px;font-size:18px}.player-setup .save-note{font-size:10px;margin-top:22px}.player-setup .form-error{margin-bottom:15px}
.game-header{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:auto 1fr 46px;gap:27px;background:var(--bg);box-shadow:0 8px 20px #0000000a}.game-header .stepper{justify-self:end}.menu-trigger{display:grid;place-items:center;width:46px;height:46px;background:var(--surface-raised);border:1px solid var(--line);border-radius:12px;color:var(--ink);padding:0;justify-self:end}.menu-trigger:hover{border-color:var(--accent);color:var(--accent)}.menu-trigger .icon{width:23px;height:23px}
.menu-backdrop{justify-content:flex-end;align-items:flex-start;padding:88px max(24px,calc((100vw - 1260px)/2)) 24px;background:#08091280;backdrop-filter:blur(4px)}.menu-modal{max-width:355px;padding:28px 22px 18px;max-height:calc(100dvh - 112px);border-radius:18px}.menu-modal .eyebrow{font-size:10px}.menu-items{display:flex;flex-direction:column;gap:4px}.menu-items>button{width:100%;display:flex;align-items:center;gap:12px;min-height:78px;padding:13px 10px;border-radius:11px;text-align:left}.menu-items>button:hover{background:var(--surface-raised)}.menu-item-symbol{width:38px;height:38px;display:grid;place-items:center;flex-shrink:0;color:var(--accent);background:#ff8bae0c;border:1px solid #ff8bae1b;border-radius:11px}.menu-item-symbol .icon{width:19px;height:19px}.menu-items>button>span:nth-child(2){flex:1}.menu-items strong{display:block;font-size:14px;font-weight:900;letter-spacing:-.3px}.menu-items small{display:block;font-size:10px;color:var(--muted);font-weight:500;margin-top:5px}.menu-items>button>.icon{width:15px;height:15px;color:var(--muted)}.settings-description{color:var(--muted);font-size:14px;font-weight:500;line-height:1.9}.coffee-modal{text-align:center}.coffee-account{border:1px solid var(--line);background:var(--surface-raised);border-radius:13px;margin:25px 0 0;padding:20px}.coffee-account>span{display:block;font-size:12px;color:var(--muted);margin-bottom:8px}.coffee-account>strong{display:block;font-size:24px;font-weight:900}
/* Light appearance retains contrast in all play, collection and story surfaces. */
:root[data-theme="light"]{color-scheme:light;--bg:#f7f3f5;--surface:#ffffff;--surface-raised:#eee7ee;--ink:#302634;--muted:#746878;--line:#42273f21;--accent:#c63b6b;--accent-light:#d64c7b;--mint:#356539;--purple:#7450ae;--negative:#b5304c}
[data-theme="light"] .game-shell{background:radial-gradient(ellipse at 92% 5%,#ead6e24d,transparent 50%),var(--bg)}[data-theme="light"] .title-screen{background:radial-gradient(ellipse at 50% 10%,#eebdd642,transparent 53%),var(--bg)}[data-theme="light"] .player-setup{box-shadow:0 20px 65px #68495e12}[data-theme="light"] input,[data-theme="light"] select{background:#faf7fa;border-color:#42273f2a}[data-theme="light"] input::placeholder,[data-theme="light"] textarea::placeholder{color:#827386}[data-theme="light"] .primary-btn{color:white;box-shadow:0 5px 0 #862d4d}[data-theme="light"] .primary-btn:not(:disabled):hover{box-shadow:0 7px 0 #862d4d}[data-theme="light"] .primary-btn:not(:disabled):active{box-shadow:0 2px 0 #862d4d}[data-theme="light"] .secondary-btn:hover{background:#e2d8e3;border-color:#bfa5bb}[data-theme="light"] .brand-edition,[data-theme="light"] .stepper .current>span{color:white}[data-theme="light"] .stepper li{color:#746879}[data-theme="light"] .stepper .current{color:var(--ink)}[data-theme="light"] .stepper li>span{border-color:#42273f30}[data-theme="light"] .stepper li:not(:last-child):after{background:#42273f30}[data-theme="light"] .stepper .done{color:#4f6550}[data-theme="light"] .stepper .done>span{border-color:#35653944;background:#3565390a}[data-theme="light"] .stepper .current>span{border-color:var(--accent)}
[data-theme="light"] .player-status{background:#ffffffbf}[data-theme="light"] .player-avatar{background:#7450ae0d;border-color:#7450ae30}[data-theme="light"] .section-label>span{color:var(--muted)}[data-theme="light"] .location-number{color:var(--muted)}[data-theme="light"] .location-option.selected{background:#fceaf1}[data-theme="light"] .location-option.selected .selection-dot{color:white}[data-theme="light"] .location-option:not(.selected):hover{border-color:#bfa5bb}[data-theme="light"] .selection-dot{border-color:#b9a7b6}[data-theme="light"] .hunting-scene{color:#fff9f2;border-color:#42273f35}[data-theme="light"] .hunting-scene .success-chance strong{color:#ceef9b}[data-theme="light"] .relation-bar{background:#42273f12}
[data-theme="light"] .growth-card{background:linear-gradient(145deg,#fff,#f0eaf6)}[data-theme="light"] .growth-card:hover{box-shadow:0 15px 30px #624c6915}[data-theme="light"] .growth-top{color:var(--muted)}[data-theme="light"] .activity-symbol{color:var(--purple);background:#7450ae10;border-color:#7450ae30;box-shadow:0 9px 0 #7450ae0b}[data-theme="light"] .growth-exercise .activity-symbol{color:#3f7045;background:#3f704510;border-color:#3f704535}[data-theme="light"] .growth-shopping .activity-symbol{color:var(--accent);background:#c63b6b10;border-color:#c63b6b30}[data-theme="light"] .growth-work .activity-symbol{color:#936025;background:#93602510;border-color:#93602530}[data-theme="light"] .growth-gain{border-color:var(--line)}
[data-theme="light"] .complete-seal, [data-theme="light"] .unlock-notice {background:#3565390b;border-color:#35653935}[data-theme="light"] .summary-symbol{background:#7450ae0b}[data-theme="light"] .neglect-report{background:#c63b6b05;border-color:#c63b6b25}[data-theme="light"] .neglect-report summary{color:var(--muted)}[data-theme="light"] .menu-backdrop{background:#28203340}[data-theme="light"] .filter-tabs button{background:#eee7ee;color:var(--muted)}[data-theme="light"] .filter-tabs .active{background:var(--accent);color:white}[data-theme="light"] .search-field{background:#faf7fa}[data-theme="light"] .search-field input{background:transparent}
[data-theme="light"] .memory-card {background:#fff}
[data-theme="light"] .portrait-name, [data-theme="light"] .memory-scene-copy {color:#fff9f2}[data-theme="light"] .memory-scene-copy .eyebrow{color:#ff8bae}[data-theme="light"] .memory-art>span{color:#fff9f2}[data-theme="light"] .locked-memory{border-color:#42273f35}
@media(max-width:1100px){.game-header{gap:18px;grid-template-columns:auto 1fr 42px}.menu-trigger{width:42px;height:42px}.game-header .stepper{gap:18px}}
@media(max-width:820px){.game-header{display:grid;grid-template-columns:1fr 42px;gap:17px;align-items:center}.game-header .brand{grid-column:1;grid-row:1}.game-header .menu-trigger{grid-column:2;grid-row:1}.game-header .stepper{grid-column:1/-1;grid-row:2;justify-self:stretch;gap:12px}.menu-backdrop{padding-top:76px}.title-screen{padding-top:76px;padding-bottom:var(--title-footer-space)}}
@media(max-width:540px){.game-header{padding:15px 20px;gap:15px;grid-template-columns:1fr 39px}.menu-trigger{width:39px;height:39px;border-radius:10px}.menu-trigger .icon{width:21px;height:21px}.game-header .stepper{gap:7px}.menu-backdrop{padding:72px 13px 15px}.menu-modal{max-width:355px;max-height:calc(100dvh - 90px);padding:25px 18px 16px}.menu-items>button{padding:12px 7px;min-height:75px}.menu-items strong{font-size:13px}.menu-items small{font-size:10px}.menu-item-symbol{width:35px;height:35px}.title-screen{padding:76px 22px var(--title-footer-space);justify-content:center}.title-heading{margin-bottom:28px}.player-setup{padding:24px 22px 22px;border-radius:18px;max-width:420px}.player-setup h2{font-size:16px;margin-bottom:23px}.player-setup label{font-size:12px;margin-bottom:9px}.player-setup label>span{font-size:9px}.player-setup input,.player-setup select{font-size:16px;min-height:52px}.player-setup select{padding:10px 8px;font-size:14px}.player-setup .setup-fields{grid-template-columns:85px minmax(0,1fr);gap:12px;margin:19px 0 25px}.player-setup .save-note{font-size:9px;margin-top:22px}.player-setup .primary-btn{font-size:17px;min-height:54px}.settings-description{font-size:12px}.coffee-account{padding:19px}.coffee-account>strong{font-size:22px}}
@media(max-width:350px){.player-setup{padding:22px 17px}.title-screen{padding:76px 18px 30px}.player-setup .setup-fields{grid-template-columns:74px minmax(0,1fr);gap:9px}.player-setup select{font-size:12px}}

/* Fit the title and setup into shorter viewports without clipping the form. */
@media (max-height:800px) {
  .title-screen { --setup-panel-height:354px; padding-top:64px; padding-bottom:var(--title-footer-space); }
  .title-screen .title-heading { width:min(530px,100%); margin-bottom:20px; }
  .title-logo { max-height:clamp(100px,calc(100dvh - 518px),212px); object-fit:contain; }
  .player-setup { padding:22px 24px; }
  .player-setup h2 { margin-bottom:16px; }
  .player-setup label { margin-bottom:8px; }
  .player-setup input,.player-setup select { min-height:48px; padding-top:10px; padding-bottom:10px; }
  .player-setup .setup-fields { margin:16px 0 20px; }
  .player-setup .primary-btn { min-height:52px; }
}
/* Narrow phones stack the age/job fields, so reserve the same space while loading. */
@media (max-width:360px) and (max-height:800px) {
  .title-screen { --setup-panel-height:430px; padding-top:60px; padding-bottom:var(--title-footer-space); }
  .title-screen .title-heading { margin-bottom:12px; }
  .title-logo { max-height:clamp(100px,calc(100dvh - 584px),212px); }
  .player-setup { padding-inline:18px; }
}

/* Spending decisions and the four-week salary settlement. */
.player-status{gap:24px}.status-cell.money-cell{min-width:158px;padding-left:20px}.money-cell strong{font-size:24px;white-space:nowrap;color:var(--accent)}
.hunt-cost{font-size:12px;line-height:1.7;color:#fff9f2;margin:10px 0 0}.activity-cost{display:block;margin-top:12px;font-size:13px;font-weight:900;color:var(--accent)}.growth-card:disabled:hover{transform:none;box-shadow:none;border-color:var(--line)}
.money-change{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 14px;margin-top:14px;font-size:12px;line-height:1.7}.money-change>span,.money-change>small{color:var(--muted);font-weight:500}.money-change>strong{font-size:16px;white-space:nowrap}.money-change>small{font-size:11px}.summary-entry>div{min-width:0}
@media(max-width:1100px){.player-status{flex-wrap:wrap}.status-cell.money-cell{flex-basis:100%;display:flex;align-items:center;justify-content:space-between;border-left:0;border-top:1px solid var(--line);padding:12px 0 0}}
@media(max-width:540px){.player-status{gap:13px}.status-cell.money-cell{grid-column:1/-1;min-width:0}.money-cell strong{font-size:22px}.hunt-cost{font-size:10px}.growth-card .activity-cost{grid-column:2;grid-row:3;font-size:11px;margin:3px 0 0}.money-change{gap:5px 10px}.money-change>strong{font-size:14px}.money-change>small{width:100%}.summary-entry{gap:10px}}


/* Source: hunting.css */

.hunt-place-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.hunt-place-card {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: flex-end;
  width: 100%;
  padding: 16px;
  aspect-ratio: 4 / 3;
  min-width: 0;
  overflow: hidden;
  border-radius: 16px;
  border: 2px solid transparent;
  background: #27232f;
  color: #fff9f2;
  text-align: left;
  box-shadow: 0 8px 24px #0002;
  transition: box-shadow .18s;
}
.hunt-place-card:focus, .hunt-place-card:focus-visible { outline: none; }
.hunt-place-card:disabled { cursor: not-allowed; opacity: .45; filter: saturate(.4); }
.hunt-place-card:not(:disabled):focus .hunt-place-art, .hunt-place-card:not(:disabled):active .hunt-place-art { transform: scale(1.06); }
.hunt-place-art {
  position: absolute;
  inset: 0;
  z-index: -2;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform .3s ease;
}
.hunt-place-fallback { background: url('./assets/hunting-places.png') var(--place-x) var(--place-y) / 300% 200%; }
.hunt-place-card::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, #11101c30 0%, transparent 30%, #14121d9c 57%, #14121df5 88%); pointer-events: none; }
.hunt-place-copy { display: block; width: 100%; padding-top: 12px; text-shadow: 0 2px 12px #0007; }
.hunt-place-copy strong { display: block; font-size: clamp(20px, 1.8vw, 25px); font-weight: 900; letter-spacing: -.8px; line-height: 1.25; }
.hunt-place-copy small { display: block; margin-top: 6px; font-size: 12px; font-weight: 500; line-height: 1.5; color: #e8e2e9; word-break: keep-all; }
.my-profile-modal { max-width: 460px; padding: 38px 32px 30px; }
.my-profile-emblem { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 18px; background: #ff8bae16; color: var(--accent); margin-bottom: 22px; }
.my-profile-emblem .icon { width: 30px; height: 30px; }
.my-profile-facts { margin: 0 0 28px; }
.my-profile-facts > div { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; padding: 17px 0; border-bottom: 1px solid var(--line); }
.my-profile-facts dt { color: var(--muted); font-size: 13px; flex-shrink: 0; }
.my-profile-facts dd { margin: 0; font-size: 18px; font-weight: 800; text-align: right; overflow-wrap: anywhere; }
@media (hover: hover) {
  .hunt-place-card:not(:disabled):hover .hunt-place-art { transform: scale(1.06); }
}
@media (max-width: 1000px) {
  .hunt-place-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
  .hunt-place-card { padding: 14px; }
  .hunt-place-copy small { font-size: 11px; }
  .hunt-place-copy strong { font-size: 22px; }
}
@media (max-width: 680px) {
  .hunt-place-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hunt-place-copy small { min-height: 3em; }
}
@media (max-width: 540px) {
  .hunt-place-card { aspect-ratio: 4 / 5; }
  .hunt-place-grid { gap: 12px; }
  .hunt-place-card { padding: 12px; border-radius: 14px; }
  .hunt-place-copy { padding-top: 8px; }
  .hunt-place-copy strong { font-size: 18px; letter-spacing: -.5px; }
  .hunt-place-copy small { margin-top: 5px; }
  .my-profile-modal { padding: 30px 24px 24px; }
}
@media (min-width: 1001px) and (max-height: 800px) {
  .hunt-place-card { aspect-ratio: auto; height: clamp(176px, calc((100dvh - 280px) / 2), 238px); }
}
@media (max-width: 360px) {
  .hunt-place-grid { gap: 9px; }
  .hunt-place-card { padding: 9px; }
  .hunt-place-copy strong { font-size: 17px; }
}


/* Source: progress.css */
/* A compact, persistent HUD shared by every gameplay step. */
html { min-width: 0; scroll-padding-top: 112px; }
.game-header {
  position: sticky;
  top: 0;
  z-index: 30;
  min-height: 0;
  padding: 12px 30px 10px;
  grid-template-columns: auto 1fr auto;
  grid-template-areas: 'brand steps menu' 'status status status';
  gap: 8px 24px;
  align-items: center;
}
.game-header .brand { grid-area: brand; color: var(--accent); font-size: 22px; font-weight: 800; letter-spacing: -.045em; line-height: 1.3; white-space: nowrap; }
.game-header .stepper { grid-area: steps; }
.header-actions { grid-area: menu; display: flex; align-items: center; gap: 10px; }
.brand-calendar { flex-shrink: 0; filter: drop-shadow(0 2px 3px #0002); }
.sound-toggle { display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--muted); transition: color 180ms, background-color 180ms; }
.sound-toggle.is-audible { color: var(--accent); }
.sound-toggle:hover { background: var(--surface-raised); }
.sound-toggle .icon { width: 23px; height: 23px; stroke-width: 1.8; }
.sound-controls { position: relative; }
.sound-controls .sound-toggle { position: relative; z-index: 2; }
.sound-dismiss { position: fixed; inset: 0; z-index: 1; border: 0; padding: 0; background: transparent; cursor: default; }
.sound-popover { position: absolute; z-index: 2; top: calc(100% + 10px); right: 0; width: min(252px,calc(100vw - 40px)); display: grid; gap: 17px; padding: 20px; border: 1px solid var(--line); border-radius: 15px; background: var(--bg); box-shadow: 0 12px 35px #0003; animation: sound-panel-in 160ms ease-out both; }
.sound-level { display: grid; grid-template-columns: 46px minmax(0,1fr); align-items: center; gap: 15px; margin: 0; color: var(--ink); font-size: 12px; font-weight: 700; }
.sound-controls .sound-range { display: block; appearance: none; -webkit-appearance: none; width: 100%; height: 24px; min-height: 0; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; cursor: pointer; touch-action: pan-y; }
.sound-range::-webkit-slider-runnable-track { height: 4px; border-radius: 99px; background: linear-gradient(to right,var(--accent) var(--volume),var(--line) var(--volume)); }
.sound-range::-webkit-slider-thumb { appearance: none; -webkit-appearance: none; width: 14px; height: 14px; margin-top: -5px; border: 0; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--bg); }
.sound-range::-moz-range-track { height: 4px; border-radius: 99px; background: var(--line); }
.sound-range::-moz-range-progress { height: 4px; border-radius: 99px; background: var(--accent); }
.sound-range::-moz-range-thumb { width: 14px; height: 14px; border: 0; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 3px var(--bg); }
@keyframes sound-panel-in { from { opacity: 0; transform: translateY(-4px); } to { opacity: 1; transform: translateY(0); } }
.header-contacts { display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 9px 12px; min-height: 40px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-raised); color: var(--ink); font-size: 12px; font-weight: 800; white-space: nowrap; }
.header-contacts .icon { width: 16px; height: 16px; }
.header-contacts:hover { border-color: var(--accent); color: var(--accent); }
.game-header .menu-trigger { width: 40px; height: 40px; border-radius: 10px; }
.progress-status {
  grid-area: status;
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 26px;
  margin: 0;
  padding: 8px 0 0;
  border-top: 1px solid var(--line);
  font-variant-numeric: tabular-nums;
}
.progress-status > div { display: flex; align-items: baseline; gap: 9px; min-width: 0; }
.progress-status dt { display: flex; align-items: center; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 600; white-space: nowrap; }
.progress-status dt .icon { width: 13px; height: 13px; align-self: center; }
.progress-status dd { margin: 0; color: var(--ink); font-size: 15px; font-weight: 900; line-height: 1.3; white-space: nowrap; }
.progress-status dd small { color: var(--muted); font-size: 10px; font-weight: 500; }
.progress-status .progress-money dd { color: var(--balance-color); }
.stage-note { margin: -10px 0 22px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.stage-note strong { color: var(--accent); font-weight: 800; }
@media (max-width: 1100px) {
  .game-header { padding-right: 25px; padding-left: 25px; column-gap: 18px; }
}
@media (max-width: 820px) {
  html { scroll-padding-top: 144px; }
  .game-header {
    padding: 10px 24px;
    grid-template-columns: 1fr auto;
    grid-template-areas: 'brand menu' 'steps steps' 'status status';
    row-gap: 9px;
  }
  .game-header .menu-trigger { width: 36px; height: 36px; }
  .header-actions { gap: 8px; }
  .sound-toggle { width: 36px; height: 36px; }
  .brand-calendar { width: 30px; height: 30px; }
  .header-contacts { min-height: 36px; padding: 8px 10px; font-size: 11px; }
  .progress-status { justify-content: space-between; gap: 16px; }
}
@media (max-width: 540px) {
  .game-header { padding: 10px 20px 9px; row-gap: 8px; column-gap: 10px; }
  .game-header .brand { font-size: 19px; }
  .header-contacts { gap: 5px; padding: 8px; }
  .header-contacts .icon { width: 14px; height: 14px; }
  .progress-status { gap: 10px; padding-top: 8px; }
  .progress-status > div { gap: 5px; }
  .progress-status dt { font-size: 10px; }
  .progress-status dt .icon { display: none; }
  .progress-status dd { font-size: 12px; }
  .progress-status dd small { font-size: 9px; }
  .stage-note { font-size: 11px; margin: -8px 0 18px; }
}
@media (max-width: 360px) {
  .game-header .brand { font-size: 17px; }
  .progress-status { gap: 7px; }
  .progress-status > div { gap: 4px; }
  .progress-status dt { font-size: 9px; }
  .progress-status dd { font-size: 11px; }
  .progress-status dd small { font-size: 8px; }
}


/* Source: relationships.css */

.relationship-help { display: grid; place-items: center; width: 46px; height: 46px; padding: 0; border: 1px solid var(--line); border-radius: 50%; background: var(--surface); color: var(--ink); font-size: 23px; font-weight: 900; }
.relationship-help:hover { border-color: var(--accent); color: var(--accent); }
.relationship-state { display: block; margin-top: 8px; font-size: 11px; font-weight: 800; }
.relationship-state.negative { color: #ff9aab; }
.relationship-state.positive { color: #d3eeaf; }
@media (max-width: 1100px) {
  .game-header .stepper { gap: 12px; }
  .game-header .stepper li { gap: 7px; }
  .game-header .stepper b { font-size: 12px; }
}
@media (max-width: 540px) {
  .game-header .stepper { gap: 5px; }
  .game-header .stepper li { gap: 4px; flex-wrap: wrap; justify-content: center; }
  .game-header .stepper b { font-size: 10px; white-space: nowrap; }
  .relationship-help { width: 42px; height: 42px; font-size: 21px; }
}


/* Source: menu.css */
/* Inline preferences and persistent navigation for long guides. */
.developer-notes { display: grid; gap: 22px; margin-top: 22px; }
.patch-note { border-top: 1px solid var(--line); padding-top: 18px; }
.patch-note h3 { margin: 0 0 12px; color: var(--accent); font-size: 17px; font-weight: 800; }
.patch-note ul { margin: 0; padding-left: 20px; list-style: disc outside; color: var(--ink); font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
.patch-note li + li { margin-top: 7px; }
.menu-theme { border: 0; border-bottom: 1px solid var(--line); padding: 10px 0 18px; margin: 0 0 4px; min-width: 0; }
.menu-theme legend { padding: 0; font-size: 13px; font-weight: 800; }
.menu-theme-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; padding:5px; border:1px solid var(--line); border-radius:20px; background:color-mix(in srgb,var(--bg) 55%,var(--surface)); }
.menu-theme-option { --mode-color:var(--mint); position:relative; display:flex; align-items:center; justify-content:center; gap:8px; min-width:0; min-height:52px; padding:8px; border:1px solid transparent; border-radius:15px; color:var(--muted); cursor:pointer; font-size:12px; font-weight:800; white-space:nowrap; transition:background-color 180ms,border-color 180ms,box-shadow 180ms,color 180ms; }
.menu-theme-option.theme-light { --mode-color:#e8b65d; }
.menu-theme-option.theme-dark { --mode-color:#b9a2e8; }
.menu-theme-option > input { position:absolute; inset:0; z-index:1; width:100%; height:100%; min-height:0; opacity:0; margin:0; padding:0; cursor:pointer; }
.menu-theme-symbol { position:relative; display:grid; place-items:center; width:30px; height:30px; flex-shrink:0; border-radius:50%; background:color-mix(in srgb,var(--mode-color) 12%,var(--surface)); color:var(--mode-color); transition:background-color 180ms,color 180ms,transform 220ms; }
.menu-theme-symbol>.icon { width:17px; height:17px; }
.menu-theme-check { position:absolute; right:-3px; bottom:-2px; display:grid; place-items:center; width:13px; height:13px; border:2px solid var(--surface); border-radius:50%; background:var(--accent); color:var(--bg); opacity:0; transform:scale(.5); transition:opacity 180ms,transform 220ms; }
.menu-theme-check>.icon { width:8px; height:8px; stroke-width:3; }
.menu-theme-option:hover { background:var(--surface-raised); color:var(--ink); }
.menu-theme-option:hover .menu-theme-symbol { transform:translateY(-1px); }
.menu-theme-option:has(input:checked) { background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 14%,var(--surface)),var(--surface-raised)); border-color:color-mix(in srgb,var(--accent) 35%,var(--line)); box-shadow:0 3px 10px #00000012,inset 0 1px 0 #ffffff0d; color:var(--ink); }
.menu-theme-option:has(input:checked) .menu-theme-symbol { color:var(--accent); background:color-mix(in srgb,var(--accent) 15%,var(--surface)); }
.menu-theme-option:has(input:checked) .menu-theme-check { opacity:1; transform:scale(1); }
[data-theme="light"] .menu-theme-option.theme-light { --mode-color:#b57b24; }
[data-theme="light"] .menu-theme-option.theme-dark { --mode-color:#8563b4; }
[data-theme="light"] .menu-theme-check { color:white; }
.feedback-mail-actions { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.feedback-mail-actions > a { min-height:50px; padding:12px; font-size:14px; gap:8px; text-decoration:none; }
.feedback-mail-actions .icon { width:18px; height:18px; margin:0; }
@media (max-width:540px) {
  .feedback-mail-actions { grid-template-columns:1fr; gap:12px; }
}
.coffee-greeting { white-space: pre-line; }
.coffee-payment { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-top: 18px; }
.coffee-qr { display: block; width: auto; height: auto; max-width: 100%; max-height: min(300px,40dvh); border-radius: 12px; background: #fff; }
.coffee-instructions { text-align: center; color: var(--muted); font-size: 12px; line-height: 1.6; margin: 0; }
.coffee-pay-link { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 48px; padding: 12px 18px; border-radius: 12px; background: #fee500; color: #191919; text-decoration: none; font-size: 15px; font-weight: 800; }
.coffee-pay-link:hover { background: #f3da00; }
.coffee-pay-link .icon { width: 16px; height: 16px; }
@media (max-width: 540px) {
  .coffee-payment { gap: 10px; margin-top: 12px; }
  .coffee-qr { max-height: min(260px,35dvh); }
  .coffee-instructions { font-size: 11px; }
  .coffee-pay-link { min-height: 44px; font-size: 13px; }
}
.help-modal.dialog-list>.dialog-body { display:flex; flex-direction:column; height:min(660px,var(--dialog-max-height)); overflow:hidden; }
.guide-categories { display:flex; flex-wrap:wrap; flex-shrink:0; gap:7px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.guide-categories button { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:38px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; color:var(--muted); background:var(--surface-raised); font-size:12px; font-weight:800; }
.guide-categories button>span { font-size:10px; opacity:.7; }
.guide-categories button.is-selected { background:var(--accent); color:var(--bg); border-color:var(--accent); }
[data-theme="light"] .guide-categories button.is-selected { color:white; }
.guide-content { flex:1; min-height:0; padding:20px 8px 0 0; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.guide-content>h3 { margin:0 0 16px; font-size:18px; }
.guide-content .help-rules { display:grid; gap:16px; margin:0; padding:0; list-style:none; counter-reset:guide-rule; }
.guide-content .help-rules[start="3"] { counter-reset:guide-rule 2; }
.guide-content .help-rules>li { position:relative; margin:0; padding:0 0 0 32px; color:var(--muted); font-size:14px; font-weight:500; line-height:1.75; word-break:keep-all; }
.guide-content .help-rules>li::before { counter-increment:guide-rule; content:counter(guide-rule); position:absolute; left:0; top:1px; display:grid; place-items:center; width:23px; height:23px; border-radius:8px; color:var(--mint); background:color-mix(in srgb,var(--mint) 12%,transparent); font-size:12px; font-weight:800; }
.guide-content .help-rules>li>b { display:block; margin:0 0 4px; color:var(--ink); font-size:15px; }
.guide-details { margin:14px 0 18px 32px; font-size:13px; }
.guide-details>summary { width:fit-content; cursor:pointer; color:var(--accent); padding:7px 0; font-weight:700; }
.guide-details .location-affinities { margin:6px 0 0; padding:10px 12px; gap:0 16px; }
.guide-details .location-affinities>div { font-size:12px; }
.guide-overview { margin:0 0 20px; font-size:13px; line-height:1.8; color:var(--muted); word-break:keep-all; }
@media (max-width: 540px) {
  .menu-theme-options { gap:3px; padding:4px; border-radius:17px; }
  .menu-theme-option { gap:5px; min-height:48px; padding:6px 4px; border-radius:12px; font-size:11px; }
  .menu-theme-symbol { width:25px; height:25px; }
  .menu-theme-symbol>.icon { width:15px; height:15px; }
}


/* Source: relationship-meter.css */
/* One relationship language: a heart and a bar, without numeric scores. */
.relationship-meter { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; color: var(--accent); }
.relationship-track { display: block; position: relative; flex: 1; min-width: 0; height: 7px; overflow: hidden; border-radius: 99px; background: var(--line); }
.relationship-fill, .relationship-trail { position: absolute; inset: 0 auto 0 0; display: block; border-radius: inherit; }
.relationship-fill { width: var(--relation-to); background: currentColor; }
.relationship-trail { width: var(--relation-from); background: currentColor; opacity: .28; }
.relationship-meter > .icon { flex: 0 0 18px; width: 18px; height: 18px; fill: currentColor; }
.relationship-meter.is-animated .relationship-fill { animation: relationship-change 1.1s cubic-bezier(.2,.7,.25,1) .25s both; }
.relationship-meter.is-animated.increasing > .icon { animation: relationship-heart .7s ease-in-out .5s 2; }
.relationship-meter.is-animated.decreasing > .icon { animation: relationship-heart-fade 1.1s ease .25s both; }
@keyframes relationship-change { from { width: var(--relation-from); } to { width: var(--relation-to); } }
@keyframes relationship-heart { 50% { transform: scale(1.2); } }
@keyframes relationship-heart-fade { 40% { opacity: .35; } }
.summary-entry .relationship-meter, .journal .relationship-meter { max-width: 260px; margin: 12px 0; }
.neglect-report .neglect-person { display: grid; grid-template-columns: minmax(60px, auto) minmax(60px, 1fr); align-items: center; gap: 8px 14px; padding: 12px 0; border-top: 1px solid var(--line); }
.neglect-person > small { grid-column: 1 / -1; font-size: 11px; color: var(--muted); }
.neglect-person .relationship-meter { margin: 0; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.hunt-place-card:disabled { opacity: .45; cursor: not-allowed; filter: saturate(.4); }
.hunt-counts { align-items: center; flex-wrap: wrap; }
.hunt-counts p { margin: 0; font-size: 14px; color: var(--muted); }
@media (max-width: 540px) {
  .hunt-place-card { min-height: 180px; }
  .hunt-counts > span { flex: none; }
}


/* Source: stat-change-meters.css */
/* Result meters share real before/after values for both gains and losses. */
.stat-change-meters { --stat-start-delay:700ms; --stat-duration:1300ms; display:grid; gap:16px; width:100%; min-width:0; }
.stat-change-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px 22px; }
.stat-change-meter { --stat-color:var(--mint); display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:7px 10px; min-width:0; }
.stat-change-meter.decreasing { --stat-color:var(--accent); }
.stat-change-heading { grid-column:1 / -1; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.stat-change-heading>span { display:flex; align-items:center; gap:8px; color:var(--ink); font-size:15px; font-weight:700; white-space:nowrap; }
.stat-change-heading .icon { width:19px; height:19px; color:var(--stat-color); }
.stat-change-heading>strong { color:var(--stat-color); font-size:22px; font-weight:800; line-height:1.1; font-variant-numeric:tabular-nums; }
.stat-change-track { position:relative; height:10px; overflow:hidden; border-radius:999px; background:var(--line); isolation:isolate; }
.stat-change-fill,.stat-change-trail { position:absolute; inset:0 auto 0 0; border-radius:inherit; background:var(--stat-color); }
.stat-change-fill { width:var(--stat-to); overflow:hidden; }
/* A continuous underlay avoids a rounded seam between the moving fill and target. */
.stat-change-trail { width:max(var(--stat-from),var(--stat-to)); opacity:0; }
.stat-change-score { color:var(--muted); font-size:12px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
.stat-change-score small { font-size:10px; font-weight:400; }
.stat-change-meters:not(.is-animated) .stat-change-fill { width:var(--stat-from); }
.stat-change-meters.is-animated .stat-change-fill { animation:stat-meter-change var(--stat-duration) cubic-bezier(.2,.65,.3,1) both; animation-delay:calc(var(--stat-start-delay) + var(--stat-row-delay)); }
.stat-change-meters.is-animated .stat-change-fill::after { content:''; position:absolute; inset:0; background:linear-gradient(100deg,transparent 15%,#ffffffa0 50%,transparent 85%); animation:stat-meter-shine var(--stat-duration) ease-in-out both; animation-delay:calc(var(--stat-start-delay) + var(--stat-row-delay)); }
.stat-change-meters.is-animated .stat-change-heading .icon { animation:stat-icon-pulse var(--stat-duration) ease-in-out both; animation-delay:calc(var(--stat-start-delay) + var(--stat-row-delay)); }
.stat-change-meters.is-animated .stat-change-heading>strong { animation:stat-delta-arrive 650ms ease-out both; animation-delay:calc(var(--stat-start-delay) + var(--stat-row-delay)); }
.stat-change-meters.is-animated .stat-change-trail { animation:stat-trail-fade calc(var(--stat-duration) + 400ms) ease-out both; animation-delay:calc(var(--stat-start-delay) + var(--stat-row-delay)); }
.encounter-result .stat-change-meters { --stat-start-delay:1000ms; }
@keyframes stat-meter-change { from { width:var(--stat-from); } to { width:var(--stat-to); } }
@keyframes stat-delta-arrive { 0% { opacity:0; transform:translateY(6px) scale(.9); } 65% { opacity:1; transform:translateY(-1px) scale(1.08); } 100% { opacity:1; transform:none; } }
@keyframes stat-trail-fade { 0%,65% { opacity:.3; } to { opacity:0; } }
@keyframes stat-meter-shine { from { opacity:0; transform:translateX(-100%); } 35% { opacity:.85; } to { opacity:0; transform:translateX(100%); } }
@keyframes stat-icon-pulse { 0%,100% { transform:scale(1); filter:none; } 40% { transform:scale(1.2); filter:drop-shadow(0 0 5px var(--stat-color)); } }
@media(max-width:600px) {
 .stat-change-meters { gap:13px; }
 .stat-change-grid { gap:13px 18px; }
 .stat-change-heading>strong { font-size:20px; }
 .stat-change-heading>span { font-size:14px; gap:6px; }
 .stat-change-heading .icon { width:17px; height:17px; }
 .stat-change-grid .stat-change-meter { gap:6px; }
}
@media(max-height:650px) {
 .stat-change-meters { gap:10px; }
 .stat-change-heading>strong { font-size:20px; }
 .stat-change-track { height:8px; }
}


/* Source: flow.css */
/* Cover the complete viewport while the next step is rendered underneath. */
.stage-transition { position: fixed; inset: 0; z-index: 10000; background: var(--bg); opacity: 0; pointer-events: none; }
.stage-transition.is-active { pointer-events: all; cursor: wait; }

/* Keep native select interaction, with an inset custom chevron. */
:root select, :root .player-setup select, :root .inventory-controls select {
  appearance: none; padding-right: 40px; padding-left: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23b9afc3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-size: 16px 16px; background-position: right 14px center; background-repeat: no-repeat;
}
:root[data-theme="light"] select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2372637d' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
}
.inventory-controls select { max-width: none; }
.portrait-file { display: block; object-fit: cover; object-position: center top; background: #faf7ef; }
.ending-art { background: #faf7ef; }
.ending-art > .portrait-full {
  width: 100%; height: 100%; min-width: 0; top: 0; left: 0; transform: none; object-fit: contain; object-position: center;
}
.memory-scene > .portrait-full { height: 100%; object-fit: cover; object-position: center top; }
.new-badge { display: inline-flex; background: #ceef9b; color: #284527; padding: 3px 6px; font-size: 10px; font-weight: 900; border-radius: 4px; line-height: 1.3; }

/* Contact controls are shared by the phonebook and the relationship step. */
.contacts-trigger .icon { width: 20px; height: 20px; }
.step-1 .inventory-toolbar { flex-direction: row; align-items: center; justify-content: space-between; gap: 16px; }
.step-1 .inventory-controls { flex: 1; max-width: 560px; min-width: 0; }
.inventory-controls .search-field { min-width: 0; }
@media (max-width: 820px) {
  .step-1 .inventory-toolbar { flex-direction: column; align-items: stretch; }
  .step-1 .inventory-controls { max-width: none; }
}
.ending-content > p { white-space: pre-line; word-break: keep-all; }
.data-error { max-width: 560px; margin: clamp(24px, 10vh, 100px) auto; padding: 24px; }
.data-error h1 { font-size: clamp(23px, 5vw, 28px); }
.data-error p { margin: 18px 0; line-height: 1.8; }
.data-error pre { max-height: 32dvh; overflow: auto; padding: 18px; white-space: pre-wrap; overflow-wrap: anywhere; border: 1px solid var(--line); border-radius: 12px; font-size: 12px; }
.data-error .primary-btn { margin: 6px 0 24px; }
.data-error-details { color: var(--muted); font-size: 13px; }
.data-error-details summary { cursor: pointer; padding: 8px 0; }
@media (max-width: 600px) {
.ending-art > .portrait-full { object-fit: cover; object-position: center top; }
}
@media (max-width: 540px) {
  .player-setup .setup-fields { grid-template-columns: 100px minmax(0, 1fr); }
  :root .inventory-controls select { padding-left: 9px; padding-right: 35px; background-position: right 11px center; max-width: none; }
}
@media (max-width: 360px) { .player-setup .setup-fields { grid-template-columns: 1fr; gap: 15px; } }


/* Source: weekly-ui.css */
/* The HUD stays fixed; weekly navigation belongs to the page title. */
html { scroll-padding-top: 84px; }
.game-header { grid-template-columns: auto 1fr auto; grid-template-areas: 'brand status menu'; padding: 12px 30px; gap: 20px; }
.game-header .progress-status { padding: 0; border: 0; gap: 28px; align-items: center; }
.progress-status dd { font-size: 16px; }
.stage-steps { display: flex; flex-wrap: wrap; align-items: center; list-style: none; gap: 7px 15px; padding: 0; margin: 0 0 14px; }
.stage-steps li { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 11px; font-weight: 700; }
.stage-steps li>span { width: 19px; height: 19px; border: 1px solid var(--line); border-radius: 50%; display: grid; place-items: center; font-size: 9px; }
.stage-steps .icon { width: 12px; height: 12px; }
.stage-steps .current { color: var(--accent); }
.stage-steps .current>span { background: var(--accent); color: var(--bg); border-color: var(--accent); }
.stage-steps .done>span { color: var(--mint); }
.album-caption { margin: 0 0 12px; font-size: 11px; }

/* Memories use the same image-overlay language as the heroine cards. */
.memory-card { position: relative; isolation: isolate; background: #15121b; color: white; }
.memory-card .memory-art { aspect-ratio: 4/5; }
.memory-art>.portrait { height: 100%; object-fit: cover; object-position: center top; }
.memory-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 28%,#15121bd9 76%,#15121b); pointer-events: none; }
.memory-card>.memory-overlay { position: absolute; inset: auto 0 0; z-index: 1; padding: 16px; }
.memory-card .memory-overlay small { color: #ffbad1; font-size: 10px; }
.memory-card .memory-overlay h3 { margin: 4px 0; color: white; }
.memory-card .memory-overlay p { margin: 4px 0 0; color: #f1e8ed; }

/* Final result is a page: the chosen heroine, then the complete roster. */
.ended-stage { padding-top: 36px; }
.love-finale { display: flex; flex-direction: column; align-items: center; text-align: center; gap: 16px; }
.finale-portrait { position: relative; display: block; width: min(300px,70vw); aspect-ratio: 4/5; padding: 0; border: 1px solid var(--accent); border-radius: 20px; overflow: hidden; box-shadow: 0 12px 55px #ff8bae1a; }
.finale-portrait>.portrait { width: 100%; height: 100%; object-fit: cover; object-position: center top; }
.finale-portrait>span { position: absolute; inset: auto 0 0; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 8px; padding: 45px 16px 20px; background: linear-gradient(transparent,#15121bf0); color: white; font-size: 25px; font-weight: 900; }
.finale-portrait>span>.icon { color: #ff8bae; width: 20px; }
.finale-portrait small { flex-basis: 100%; font-size: 11px; font-weight: 600; }
.love-finale h1 { font-size: clamp(25px,3vw,38px); margin: 8px 0 0; word-break: keep-all; }
.love-finale>p { margin: 0; white-space: pre-line; line-height: 1.9; color: var(--muted); font-size: 14px; }
.finale-stats { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin:22px auto 0; font-size:12px; color:var(--muted); }
.finale-stats>span { display:flex; align-items:center; gap:12px; padding:12px 18px; border-radius:12px; background:var(--surface); border:1px solid var(--line); text-align:left; }
.finale-stats>span>.icon { width:24px; height:24px; color:var(--accent); }
.finale-stats>span>span { display:grid; gap:4px; }
.finale-stats strong { color:var(--mint); font-size:22px; font-variant-numeric:tabular-nums; }
.finale-stats small { margin-left:4px; color:var(--muted); font-size:12px; font-weight:400; }
@media(max-width:600px) { .finale-stats { gap:7px; } .finale-stats>span { gap:7px; padding:10px; font-size:11px; } .finale-stats>span>.icon { width:19px; height:19px; } }
.finale-roster { margin-top: 44px; padding-top: 28px; border-top: 1px solid var(--line); }
.finale-roster h2 { font-size: 23px; margin-bottom: 20px; }
.end-page-actions { justify-content: center; margin-top: 32px; }
@media(max-width:960px) {
  .game-header { grid-template-columns: auto 1fr auto; grid-template-areas: 'brand status menu'; padding: 12px 22px; gap: 16px; }
  .game-header .progress-status { gap: 14px; }
  .progress-status>div { flex-direction: column; align-items: flex-start; gap: 2px; }
  .progress-status dd { font-size: 13px; }
}
@media(max-width:600px) {
  html { scroll-padding-top: 116px; }
  .game-header { grid-template-columns: 1fr auto; grid-template-areas: 'brand menu' 'status status'; gap: 9px; padding: 10px 20px; }
  .game-header .progress-status { justify-content: space-between; gap: 10px; padding-top: 4px; }
  .progress-status>div { flex-direction: row; align-items: baseline; gap: 5px; }
  .stage-steps { gap: 6px 10px; margin-bottom: 12px; }
  .stage-steps li { font-size: 9px; gap: 4px; }
  .stage-steps li>span { width: 16px; height: 16px; font-size: 8px; }
}
@media(max-width:360px) {
  .stage-steps { gap: 6px; }
  .stage-steps li { font-size: 8px; }
  .stage-steps li>span { width: 14px; height: 14px; }
}


/* Source: growth.css */
/* A single typographic scale for HUD labels, icons and values. */
.game-header .progress-status { --hud-size: 14px; align-items: center; }
.game-header .progress-status>div { align-items: center; }
.game-header .progress-status dt, .game-header .progress-status dd { font-size: var(--hud-size); font-weight: 800; line-height: 1.4; }
.game-header .progress-status dt { color: var(--ink); }
.game-header .progress-status dt .icon { display: block; width: var(--hud-size); height: var(--hud-size); }
.game-header .progress-status dd small { font-size: var(--hud-size); font-weight: 400; }
.growth-grid { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 14px; margin: 0; }
.growth-grid .growth-card { position: relative; isolation: isolate; display: block; width: 100%; aspect-ratio: 1; min-height: 0; padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: #211d28; text-align: left; color: #fff; }
.growth-grid .growth-card::before { display: none; }
.growth-grid .growth-card::after { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(transparent 27%,#15121b80 55%,#15121bee 85%,#15121b 100%); }
.growth-card>img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 25%; transition: transform .35s ease; }
.growth-grid .growth-card:hover, .growth-grid .growth-card:focus-visible { transform: none; outline: 0; border-color: var(--line); }
.growth-card:not(:disabled):is(:hover,:focus-visible)>img { transform: scale(1.055); }
.growth-grid .growth-card:disabled { opacity: .38; cursor: not-allowed; filter: grayscale(.65); }
.growth-card-copy { position: absolute; z-index: 1; inset: auto 13px 13px; display: block; }
.growth-card-copy>strong { display: block; margin-bottom: 7px; font-size: clamp(16px,1.45vw,21px); line-height: 1.2; font-weight: 900; letter-spacing: -.5px; word-break: keep-all; }
.growth-card-description { display: block; font-size: 11px; line-height: 1.5; color: #ede7ef; word-break: keep-all; min-height: 32px; }
.charm-change { display: inline-flex; gap: 6px; align-items: center; font-size: 13px; font-weight: 800; margin: 8px 0; }
.charm-change .icon { width: 16px; height: 16px; }
.growth-summary-image { width: 100%; height: 100%; object-fit: cover; }
@media (max-width:1000px) {
  .growth-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .growth-card-copy>strong { font-size: 19px; }
}
@media (max-width:820px) {
  .game-header .progress-status { --hud-size: 12px; }
  .game-header .progress-status>div { align-items: flex-start; }
}
@media (max-width:600px) {
  .game-header .progress-status { display: grid; grid-template-columns: 1fr 1fr 1.3fr; --hud-size: 12px; gap: 9px; }
  .game-header .progress-status>div { flex-direction: column; gap: 3px; }
  .game-header .progress-status .progress-money { align-items: flex-end; }
  html { scroll-padding-top: 135px; }
  .growth-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
  .growth-grid .growth-card { aspect-ratio: 4/5.5; }
  .growth-card-copy { inset: auto 10px 12px; }
  .growth-card-copy>strong { font-size: 17px; margin-bottom: 5px; }
  .growth-card-description { font-size: 10px; min-height: 30px; }
}
@media (max-width:360px) {
  .game-header .progress-status { --hud-size: 11px; }
  .growth-card-copy>strong { font-size: 15px; }
  .growth-card-description { font-size: 9px; }
}


/* Source: card-effects.css */
/* Shared image-card effects: charm gains first, followed by the positive cost.
   Both themes use a dark image overlay, so these colors stay bright. */
.card-effects { --card-loss: #ffadc8; --card-gain: #ceef9b; display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; gap: 6px; margin-top: 8px; text-shadow: none; }
.card-effect { display: inline-flex; align-items: center; justify-content: center; gap: 4px; padding: 5px 8px; border: 1px solid; border-radius: 8px; background: #15131dd9; font-size: 12px; font-weight: 800; font-variant-numeric: tabular-nums; line-height: 1.3; white-space: nowrap; }
.card-effect.is-loss { justify-content:flex-start; padding:0; border:0; border-radius:0; background:none; color:var(--card-loss); }
.card-effect.is-gain { color: var(--card-gain); border-color: #ceef9b38; }
.card-effect .icon { width: 14px; height: 14px; flex-shrink: 0; }
@media (max-width: 600px) {
  .card-effect { padding: 5px 7px; border-radius: 6px; font-size: 11px; }
}
@media (max-width: 360px) {
  .card-effects { gap: 4px; }
  .card-effect { padding: 5px 4px; gap: 3px; font-size: 10px; }
  .card-effect .icon { width: 12px; height: 12px; }
}


/* Source: ui-polish.css */
/* Keep the four numbered stages visually connected. */
.stage-steps { gap: 6px 9px; flex-wrap: nowrap; }
.stage-steps li { white-space: nowrap; }
.stage-steps li:not(:last-child)::after { content: '−'; margin-left: 3px; color: var(--muted); opacity: .6; font-weight: 400; }

/* The same compact toolbar is used in the phonebook and relationship view. */
.contacts-modal .inventory-toolbar, .step-1 .inventory-toolbar { flex-direction: row; align-items: center; justify-content: space-between; gap: 14px; }
.contacts-modal .inventory-controls, .step-1 .inventory-controls { display:flex; flex:0 1 auto; justify-content:flex-end; min-width:0; gap:10px; }
.contact-filters { display:flex; flex-wrap:wrap; gap:6px 18px; }
.contact-filter { position:relative; display:inline-flex; align-items:center; gap:7px; min-height:42px; color:var(--muted); font-size:13px; font-weight:700; white-space:nowrap; cursor:pointer; }
.contact-filter>input { position:absolute; inset:0; width:100%; height:100%; min-height:0; margin:0; padding:0; opacity:0; cursor:pointer; }
.contact-filter-dot { display:grid; place-items:center; width:16px; height:16px; flex-shrink:0; border:1px solid var(--muted); border-radius:50%; transition:border-color 180ms; }
.contact-filter-dot::after { content:''; width:8px; height:8px; border-radius:50%; background:var(--accent); transform:scale(0); transition:transform 180ms; }
.contact-filter:has(input:checked) { color:var(--ink); }
.contact-filter input:checked+.contact-filter-dot { border-color:var(--accent); }
.contact-filter input:checked+.contact-filter-dot::after { transform:scale(1); }
.contact-search { position:relative; display:block; flex:0 1 auto; width:44px; min-width:44px; height:44px; border:1px solid var(--line); border-radius:9px; background:var(--surface-raised); color:var(--muted); overflow:hidden; transition:width 240ms var(--ui-motion-ease); }
.contact-search>.icon { position:absolute; top:13px; left:13px; width:17px; height:17px; pointer-events:none; }
.contact-search input { position:relative; display:block; width:100%; min-width:0; min-height:42px; height:42px; margin:0; padding:0; border:0; background:transparent; color:transparent; font-size:13px; cursor:pointer; }
.contact-search input::placeholder { color:transparent; }
.contact-search input::-webkit-search-cancel-button { display:none; }
.contact-search:focus-within { width:240px; }
.contact-search:focus-within input { padding:0 12px 0 39px; color:var(--ink); cursor:text; }
.contact-search:focus-within input::placeholder { color:var(--muted); }
.contact-search:focus-within input::-webkit-search-cancel-button { display:block; cursor:pointer; }
.contact-search.has-query>.icon { color:var(--accent); }
.inventory-toolbar:has(.contact-query) { flex-wrap:wrap; }
.contact-query { display:flex; align-items:center; gap:8px; max-width:100%; min-height:40px; padding:6px 12px; border:1px solid var(--line); border-radius:20px; color:var(--ink); background:var(--surface-raised); font-size:12px; }
.contact-query>.icon { width:14px; height:14px; flex-shrink:0; }
.contact-query>span:not(.contact-query-clear) { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.contact-query-clear { margin-left:auto; color:var(--accent); white-space:nowrap; }
.contact-sort { position: relative; flex-shrink: 0; }
.sort-trigger { position: relative; display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 44px; padding: 10px 13px; background: var(--surface-raised); color: var(--ink); border: 1px solid var(--line); border-radius: 9px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.sort-trigger .icon { width: 17px; height: 17px; }
.sort-trigger .sort-chevron { width: 12px; transform: rotate(90deg); }
.sort-dismiss { position: fixed; inset: 0; width: 100%; height: 100%; border: 0; background: transparent; cursor: default; z-index: 3; }
.sort-options { position: absolute; z-index: 4; right: 0; top: calc(100% + 8px); width: max-content; padding: 6px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); box-shadow: 0 12px 35px #0003; }
.sort-option { display: grid; grid-template-columns: 2.5em 60px; align-items: center; gap: 10px; padding: 5px 8px; color: var(--ink); font-size: 13px; font-weight: 800; }
.sort-switch { position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: center; height: 30px; border-radius: 99px; background: var(--surface-raised); box-shadow: inset 0 0 0 1px var(--line); transition: background-color 180ms; }
.sort-switch.is-selected { background: var(--accent); box-shadow: none; }
.sort-switch-thumb { position: absolute; left: 3px; top: 3px; width: 24px; height: 24px; border-radius: 50%; background: #fffaf5; box-shadow: 0 2px 4px #0002; opacity: 0; transform: translateX(0); transition: transform 180ms ease, opacity 120ms; }
.sort-switch.is-selected .sort-switch-thumb { opacity: 1; }
.sort-switch.is-descending .sort-switch-thumb { transform: translateX(30px); }
.sort-direction { position: relative; display: grid; place-items: center; width: 30px; height: 40px; margin: -5px 0; cursor: pointer; }
.sort-direction input { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; min-height: 0; margin: 0; padding: 0; border: 0; opacity: 0; cursor: pointer; }
.sort-direction>span { display: grid; place-items: center; width: 24px; height: 24px; color: var(--muted); transition: color 120ms; }
.sort-direction .icon { width: 16px; height: 16px; stroke-width: 2; }
.sort-switch.is-selected .sort-direction>span { color: var(--bg); }
.sort-switch .sort-direction input:checked+span { color: #b54565; }
.sort-direction input:checked+span .icon { stroke-width: 3; }
.sort-direction:hover>span { color: var(--accent); }

/* Used activities stay visible but cannot be charged again this week. */
.growth-grid .growth-card.is-complete:disabled { opacity: .72; filter: none; }
.growth-card.is-complete>img { filter: saturate(.35) brightness(.7); }
.growth-completed { position: absolute; top: 12px; right: 12px; z-index: 2; display: inline-flex; align-items: center; gap: 5px; border: 1px solid #ffffff50; border-radius: 20px; padding: 6px 10px; color: white; background: #292937de; font-size: 12px; font-weight: 800; }
.growth-completed .icon { width: 14px; height: 14px; color: #cce5af; }

.game-header .progress-status dd>strong { color: var(--ink); font-weight: inherit; }
.game-header .progress-status .progress-charm dd>strong { color: var(--mint); }
.stage-steps .done>span .icon { stroke-width: 3; }

@media(max-width:820px) {
  .contacts-modal .inventory-toolbar, .step-1 .inventory-toolbar { flex-direction: column; align-items: stretch; }
  .contacts-modal .inventory-controls, .step-1 .inventory-controls { max-width: none; }
  .contacts-modal:has(.sort-options) { min-height: min(480px,calc(100dvh - 24px)); }
}
@media(max-width:600px) {
  .contact-filters { gap:4px 13px; justify-content:space-between; }
  .contact-filter { font-size:11px; gap:5px; }
  .contact-search:focus-within { width:220px; }
  .stage-steps { gap: 4px; }
  .stage-steps li { gap: 3px; font-size: 9px; }
  .stage-steps li:not(:last-child)::after { margin-left: 1px; }
  .sort-trigger { min-height: 42px; padding: 8px 10px; gap: 6px; font-size: 11px; }
}
@media(max-width:360px) {
  .stage-steps { gap: 3px; }
  .stage-steps li { font-size: 8px; gap: 2px; }
  .stage-steps li>span { width: 13px; height: 13px; font-size: 8px; }
  .sort-trigger { padding: 8px; gap: 4px; }
  .sort-trigger .icon { width: 14px; }
  .sort-trigger .sort-chevron { width: 10px; }
}

/* The notice remains inside the game, with the shared sticky back control. */
.title-version button { border: 0; padding: 0; background: none; color: inherit; font: inherit; letter-spacing: 0; cursor: pointer; }
.title-version button:hover { text-decoration: underline; }
.licenses-modal { width: min(800px,100%); max-width: 800px; padding-top: 0; }
.license-content h3 { font-size: 18px; margin: 28px 0 10px; }
.license-content p { font-size: 13px; line-height: 1.8; color: var(--muted); }
.license-notice { margin: 10px 0; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-raised); }
.license-notice summary { padding: 14px; cursor: pointer; font-size: 13px; font-weight: 700; }
.license-notice pre { margin: 0; padding: 4px 14px 18px; white-space: pre-wrap; overflow-wrap: anywhere; font: 12px/1.7 ui-monospace,monospace; color: var(--muted); }
.license-notice>p { padding: 0 14px 14px; }
.license-content { padding: 0 28px 28px; }
@media(max-width:540px) { .license-content { padding: 0 20px 20px; } }


/* Source: hunt-reveal.css */

.hunt-reveal { --reveal-duration: 3000ms; position: relative; width: 100%; height: 100%; isolation: isolate; color: #fff7ef; overflow: hidden; }
.reveal-place { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.72); opacity: .65; }
.reveal-shade { position: absolute; inset: 0; background: radial-gradient(ellipse at center, #10122255 0%, #101222ab 62%, #0c0d18ed 100%), linear-gradient(0deg,#0e1023cc,transparent 65%); }
.reveal-heading { position: absolute; top: max(26px, 7dvh); left: 20px; right: 20px; text-align: center; }
.reveal-heading>span { display: block; font-family: Georgia, serif; font-size: 11px; letter-spacing: 5px; color: #e1d5c4; }
.reveal-heading h2 { font-size: clamp(23px,3vw,35px); margin: 14px 0 8px; letter-spacing: -.7px; }
.reveal-heading p { color: #ded6de; font-size: 13px; font-weight: 500; margin: 0; }
.reveal-stage { position: absolute; inset: 28px 0 0; display: grid; place-items: center; pointer-events: none; }
.reveal-halo { position: absolute; width: min(75vw,600px); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle,#ffb3d027,#ffb3d006 45%,transparent 70%); opacity: 0; }
.reveal-heartbeat { position: absolute; width: min(380px,74vw,52dvh); aspect-ratio: 1; }
.reveal-heartbeat i { position: absolute; inset: 0; border: 2px solid #ffc5de; border-radius: 50%; box-shadow: 0 0 15px #ff8bbb35, inset 0 0 12px #ff8bbb25; opacity: 0; transform: scale(.62); }
.reveal-heartbeat i:nth-child(2) { border-width: 1px; }
.reveal-heart-shell { position: relative; width: min(310px,61vw,43dvh); aspect-ratio: 240/230; }
.reveal-heart-beat { width: 100%; height: 100%; }
.reveal-heart-vessel { width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 10px 30px #0005); }
.heart-glass { fill: #ffd9e90a; }
.heart-outline { stroke-width: 4; stroke-linejoin: round; }
.heart-liquid { transform: translateY(100%); transform-box: fill-box; }
.heart-half { opacity: 0; transform-box: view-box; transform-origin: 50% 60%; }
.reveal-motes, .reveal-hearts { position: absolute; inset: 0; }
.reveal-motes i { position: absolute; top: 50%; left: 50%; width: var(--size); height: var(--size); border-radius: 50%; background: #ffe3ef; box-shadow: 0 0 9px #ffb3d08c; opacity: 0; }
.reveal-signal { position: absolute; width: min(95vw,700px); aspect-ratio: 1; opacity: 0; border-radius: 50%; mix-blend-mode: screen; }
[data-outcome="new"] .reveal-signal { background: radial-gradient(circle,transparent 28%,#ff70ab50 42%,transparent 68%); }
[data-outcome="reunion"] .reveal-signal { background: radial-gradient(circle,#6a8caf40,transparent 65%); }
.reveal-hearts span { position: absolute; left: 50%; top: 50%; width: var(--size); height: var(--size); opacity: 0; color: #ff8bb8; filter: drop-shadow(0 0 7px #ff66aa65); }
.reveal-hearts .icon { width: 100%; height: 100%; fill: currentColor; stroke-width: .8; }
.reveal-hearts span:nth-child(3n) { color: #ffd0e0; }
.reveal-rain { position: absolute; width: min(90vw,660px); height: min(70dvh,620px); overflow: hidden; mask-image: linear-gradient(transparent,#000 12%,#000 82%,transparent); }
.reveal-rain i { position: absolute; left: var(--left); top: var(--top); width: 1px; height: var(--size); opacity: 0; background: linear-gradient(transparent,#c0d5f1b3); transform: rotate(12deg); }
.reveal-footer { position: absolute; bottom: max(30px,7dvh); left: 20px; right: 20px; text-align: center; font-size: clamp(14px,1.2vw,16px); font-weight: 700; color: #fff7ef; letter-spacing: .3px; }
.reveal-footer>span { display: inline-block; padding: 10px 18px; border: 1px solid #ffffff38; border-radius: 999px; background: #121423b3; text-shadow: 0 1px 4px #0008; }
.reveal-skip { position: absolute; inset: 0; z-index: 10; width: 100%; height: 100%; border: 0; border-radius: 0; background: transparent; cursor: pointer; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.reveal-skip:focus-visible { outline: none; }
.is-playing .reveal-place { animation: reveal-place var(--reveal-duration) ease-out both; }
.is-playing .reveal-shade { animation: reveal-darken var(--reveal-duration) ease-out both; }
.is-playing .reveal-heading { animation: reveal-heading var(--reveal-duration) ease-out both; }
.is-playing .reveal-halo { animation: reveal-halo var(--reveal-duration) ease-in-out both; }
.is-playing .reveal-heartbeat i { animation: heartbeat-wave calc(var(--reveal-duration)*.38) cubic-bezier(.16,.55,.38,1) 3 both; animation-delay: calc(var(--reveal-duration)*.07); }
.is-playing .reveal-heartbeat i:nth-child(2) { animation-delay: calc(var(--reveal-duration)*.14); }
.is-playing .reveal-heart-beat { animation: heartbeat-body calc(var(--reveal-duration)*.38) ease-in-out 3 both; animation-delay: calc(var(--reveal-duration)*.07); }
.is-playing[data-outcome="miss"] .reveal-heartbeat, .is-playing[data-outcome="reunion"] .reveal-heartbeat { animation: heartbeat-cool var(--reveal-duration) linear both; }
.is-playing .reveal-motes i { animation: reveal-mote calc(var(--reveal-duration)*.7) ease-in both; animation-delay: var(--stagger); }
.is-playing .heart-liquid { animation: heart-fill var(--reveal-duration) linear both; }
.is-playing .reveal-heart-shell { animation: heart-breathe var(--reveal-duration) ease-in-out both; }
.is-playing[data-outcome="new"] .reveal-signal, .is-playing[data-outcome="reunion"] .reveal-signal { animation: reveal-signal calc(var(--reveal-duration)*.3) ease-out both; animation-delay: calc(var(--reveal-duration)*.7); }
.is-playing .reveal-hearts span { animation: reveal-heart calc(var(--reveal-duration)*.3) cubic-bezier(.16,.7,.25,1) both; animation-delay: calc(var(--reveal-duration)*.7 + var(--stagger)); }
.is-playing .reveal-rain i { animation: reveal-rain 650ms linear both; animation-delay: calc(var(--reveal-duration)*.7 + var(--stagger)); }
.is-playing[data-outcome="new"] .reveal-heart-vessel { animation: heart-bloom var(--reveal-duration) linear both; }
.is-playing[data-outcome="miss"] .reveal-heart-vessel, .is-playing[data-outcome="reunion"] .reveal-heart-vessel { animation: heart-grey var(--reveal-duration) linear both; }
.is-playing[data-outcome="miss"] .heart-left { animation: heart-break-left var(--reveal-duration) ease-in both; }
.is-playing[data-outcome="miss"] .heart-right { animation: heart-break-right var(--reveal-duration) ease-in both; }
.is-playing[data-outcome="miss"] .heart-whole { animation: heart-break-swap var(--reveal-duration) linear both; }
@keyframes heart-fill { 0%,6% { transform: translateY(100%); } 70% { transform: translateY(30%); } 88%,100% { transform: translateY(0); } }
@keyframes heart-breathe { 0% { opacity: 0; transform: scale(.94); } 12% { opacity: 1; transform: scale(1); } 36% { transform: scale(1.025); } 48% { transform: scale(1); } 70% { transform: scale(1.055); } 88%,100% { opacity: 1; transform: scale(1.04); } }
@keyframes heart-grey { 0%,70% { filter: grayscale(0) drop-shadow(0 10px 30px #0005); } 88%,100% { filter: grayscale(1) drop-shadow(0 10px 30px #0005); } }
@keyframes heart-bloom { 0%,70% { filter: drop-shadow(0 10px 30px #0005); } 88%,100% { filter: drop-shadow(0 0 24px #ff85b288); } }
@keyframes heart-break-swap { 0%,88% { opacity: 1; } 88.001%,100% { opacity: 0; } }
@keyframes heart-break-left { 0%,88% { opacity: 0; transform: none; } 88.001% { opacity: 1; transform: none; } 100% { opacity: 1; transform: translate(-10px,9px) rotate(-8deg); } }
@keyframes heart-break-right { 0%,88% { opacity: 0; transform: none; } 88.001% { opacity: 1; transform: none; } 100% { opacity: 1; transform: translate(10px,9px) rotate(8deg); } }
@keyframes reveal-place { 0% { transform: scale(1); } 15%,100% { transform: scale(1.09); } }
@keyframes reveal-darken { 0% { opacity: .45; } 14%,100% { opacity: 1; } }
@keyframes reveal-heading { 0% { opacity: 0; transform: translateY(9px); } 18%,100% { opacity: 1; transform: none; } }
@keyframes reveal-halo { 0%,10% { opacity: 0; transform: scale(.7); } 35% { opacity: .55; } 65%,70% { opacity: 1; transform: scale(1.12); } 100% { opacity: .35; transform: scale(1); } }
@keyframes heartbeat-wave { 0% { opacity: 0; transform: scale(.62); } 9% { opacity: .48; } 62% { opacity: .16; } 100% { opacity: 0; transform: scale(1.65); } }
@keyframes heartbeat-body { 0%,18%,40%,100% { transform: scale(1); } 8% { transform: scale(1.055); } 26% { transform: scale(1.035); } }
@keyframes heartbeat-cool { 0%,70% { filter: grayscale(0); } 88%,100% { filter: grayscale(1); } }
@keyframes reveal-mote { 0%,15% { opacity: 0; transform: translate(var(--x),var(--y)) scale(.5); } 40%,95% { opacity: .8; } 100% { opacity: 0; transform: translate(0,0) scale(.4); } }
@keyframes reveal-signal { 0% { opacity: 0; transform: scale(.65); } 25% { opacity: 1; } 100% { opacity: .45; transform: scale(1.15); } }
@keyframes reveal-heart { 0% { opacity: 0; transform: translate(-50%,-50%) scale(.2); } 17% { opacity: 1; } 80% { opacity: .9; } 100% { opacity: .15; transform: translate(var(--x),var(--y)) rotate(var(--turn)) scale(1); } }
@keyframes reveal-rain { 0% { opacity: 0; transform: translateY(-70px) rotate(12deg); } 15%,75% { opacity: .75; } 100% { opacity: 0; transform: translate(-55px,370px) rotate(12deg); } }
@keyframes reveal-result { from { opacity: 0; } to { opacity: 1; } }
@media(max-width:540px) { .reveal-heading { top: max(28px,9dvh); }.reveal-heading p { font-size: 12px; }.reveal-motes, .reveal-hearts { transform: scale(.8); }.reveal-footer { bottom: max(28px,10dvh); } }
@media(max-height:520px) { .reveal-heading { top: 18px; }.reveal-heading h2 { font-size: 20px; margin: 7px 0; }.reveal-heading p { display: none; }.reveal-heart-shell { width: min(230px,39dvh); }.reveal-footer { bottom: 16px; font-size: 14px; } }


/* Source: action-reveal.css */

/* Payment reveal starts with the result, after the shared action animation. */
.date-treat{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:32px minmax(0,1fr) auto;align-items:center;gap:10px;padding:12px;border:1px solid color-mix(in srgb,var(--mint) 30%,transparent);border-radius:12px;background:color-mix(in srgb,var(--mint) 8%,var(--surface));}
.date-treat-icon{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;color:var(--mint);background:color-mix(in srgb,var(--mint) 13%,transparent)}
.date-treat-icon .icon{width:20px;height:20px}
.date-treat-copy{min-width:0}.date-treat-copy>strong{font-size:13px;line-height:1.5;color:var(--mint)}
.date-treat-copy>p{margin:3px 0 0;font-size:11px;line-height:1.5;word-break:keep-all;color:var(--muted)}
.date-treat-amount{display:flex;flex-direction:column;align-items:flex-end;gap:3px;white-space:nowrap}
.date-treat-amount>span{font-size:9px;color:var(--muted)}.date-treat-amount>strong{font-size:24px;line-height:1.2;color:var(--mint)}
.date-treat.is-animated{animation:result-item-in 550ms 220ms ease-out both}
.date-treat.is-animated .date-treat-icon{animation:date-treat-pop 650ms 480ms ease-out both}
.date-treat.is-animated .date-treat-amount>strong{animation:date-treat-pop 600ms 660ms ease-out both}
.date-treat.is-animated::after{content:'';position:absolute;inset:-35% -70%;z-index:-1;pointer-events:none;background:linear-gradient(105deg,transparent 42%,color-mix(in srgb,var(--mint) 22%,transparent) 50%,transparent 58%);animation:date-treat-shine 1100ms 450ms ease-out both}
@keyframes date-treat-pop{from{opacity:0;transform:translateY(5px) scale(.85)}60%{opacity:1;transform:translateY(0) scale(1.06)}to{opacity:1;transform:none}}
@keyframes date-treat-shine{from{transform:translateX(-45%);opacity:0}20%{opacity:1}to{transform:translateX(45%);opacity:0}}
@media(max-width:600px){.date-treat{grid-template-columns:28px minmax(0,1fr) auto;gap:8px;padding:10px}.date-treat-icon{width:28px;height:28px}.date-treat-copy>strong{font-size:12px}.date-treat-copy>p{font-size:10px}.date-treat-amount>strong{font-size:21px}}
@media(max-width:800px) and (max-height:650px){.modal.relationship-result:has(.date-treat)>.result-content{gap:8px}}
.action-reveal { --action-duration: 1200ms; position: absolute; inset: 0; z-index: 3; isolation: isolate; color: var(--accent); overflow: hidden; }
.action-reveal::before { content: ''; position: absolute; inset: 0 0 0 44%; background: var(--surface); }
.action-reveal::after { content: ''; position: absolute; inset: 0 56% 0 0; pointer-events: none; background: linear-gradient(110deg,transparent 30%,#30223735); }
.action-reveal-panel { position: absolute; inset: 0 0 0 44%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; padding: 28px 20px; text-align: center; }
.action-reveal-heading .eyebrow { display: block; margin: 0 0 12px; font-size: 10px; letter-spacing: 2px; }
.action-reveal-heading h2 { margin: 0; color: var(--ink); font-size: clamp(20px,2vw,27px); line-height: 1.35; letter-spacing: -.7px; }
.action-reveal-heading p { margin: 8px 0 0; color: var(--muted); font-size: 13px; }
.action-reveal-stage { position: relative; display: grid; place-items: center; width: 200px; height: 155px; flex: 0 1 155px; min-height: 65px; }
.action-drawing { position: relative; width: 100%; height: 100%; overflow: visible; }
.action-aura { position: absolute; width: 160px; height: 160px; border-radius: 50%; background: radial-gradient(circle,color-mix(in srgb,currentColor 18%,transparent),transparent 69%); }
.action-reveal[data-action="growth"] { color: var(--mint); }
.action-sparkles { position: absolute; inset: 0; pointer-events: none; }
.action-sparkles>span { position: absolute; left: 50%; top: 50%; width: 13px; height: 13px; opacity: 0; }
.action-sparkles .icon { width: 100%; height: 100%; }
.action-reveal.is-playing .action-aura { animation: action-aura var(--action-duration) ease-in-out both; }
.action-reveal.is-playing .date-cup { animation: cup-arrive var(--action-duration) ease-out both; }
.cup-second { --cup-direction: 1; }
.cup-first { --cup-direction: -1; }
.action-reveal.is-playing .cup-steam { animation: steam-rise var(--action-duration) ease-out both; }
.action-reveal.is-playing .steam-second { animation-delay: 80ms; }
.gift-ribbon { transform-box: fill-box; transform-origin: center; }
.action-reveal.is-playing .gift-ribbon { animation: gift-open var(--action-duration) ease-in-out both; }
.action-reveal.is-playing .gift-glimmer { animation: gift-glimmer var(--action-duration) ease-out both; }
.action-reveal.is-playing .message-first { animation: message-in var(--action-duration) ease-out both; }
.action-reveal.is-playing .message-second { animation: message-reply var(--action-duration) ease-out both; }
.action-reveal.is-playing .message-dot { animation: message-dot 500ms ease-in-out 2 both; }
.action-reveal.is-playing .dot-two { animation-delay: 100ms; }
.action-reveal.is-playing .dot-three { animation-delay: 200ms; }
.growth-star { transform-origin: 100px 80px; }
.action-reveal.is-playing .growth-star { animation: growth-bloom var(--action-duration) ease-out both; }
.action-reveal.is-playing .growth-rays { animation: gift-glimmer var(--action-duration) ease-out both; }
.action-reveal.is-playing .action-sparkles>span { animation: action-sparkle var(--action-duration) ease-out both; animation-delay: var(--delay); }
.is-action-revealing .growth-result-art::after { content: ''; position: absolute; inset: -20% -50%; background: linear-gradient(105deg,transparent 35%,#ffffff60 50%,transparent 65%); animation: activity-light 900ms ease-in-out both; pointer-events: none; }
.action-result>.growth-result-art { position: relative; overflow: hidden; }
.action-result>.growth-result-art img { position: absolute; inset: 0; }
@keyframes action-result-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes action-aura { 0% { opacity: .3; transform: scale(.8); } 60% { opacity: 1; transform: scale(1.15); } 100% { opacity: .5; transform: scale(1); } }
@keyframes cup-arrive { 0% { opacity: 0; transform: translateX(calc(var(--cup-direction)*13px)); } 35%,100% { opacity: 1; transform: none; } }
@keyframes steam-rise { 0%,15% { opacity: 0; transform: translateY(9px); } 55% { opacity: .85; } 100% { opacity: .25; transform: translateY(-7px); } }
@keyframes gift-open { 0%,30% { transform: none; } 65%,100% { transform: translate(-5px,-20px) rotate(-8deg); } }
@keyframes gift-glimmer { 0%,38% { opacity: 0; } 70% { opacity: 1; } 100% { opacity: .4; } }
@keyframes message-in { 0% { opacity: 0; transform: translate(-10px,5px); } 25%,100% { opacity: 1; transform: none; } }
@keyframes message-reply { 0%,40% { opacity: 0; transform: translate(9px,8px); } 75%,100% { opacity: 1; transform: none; } }
@keyframes message-dot { 0%,100% { opacity: .3; } 50% { opacity: 1; } }
@keyframes growth-bloom { 0% { opacity: .15; transform: scale(.65) rotate(-10deg); } 65% { opacity: 1; transform: scale(1.08) rotate(0); } 100% { opacity: 1; transform: scale(1); } }
@keyframes action-sparkle { 0%,25% { opacity: 0; transform: translate(-50%,-50%) scale(.3); } 60% { opacity: .8; } 100% { opacity: 0; transform: translate(var(--x),var(--y)) rotate(var(--turn)) scale(.8); } }
@keyframes activity-light { from { transform: translateX(-70%); } to { transform: translateX(70%); } }
@media(max-width:800px) {
  .dialog-illustrated .action-reveal::before { inset: var(--result-art-height) 0 0; }
  .dialog-illustrated .action-reveal::after { inset: 0 0 auto; height: var(--result-art-height); }
  .dialog-illustrated .action-reveal-panel { inset: var(--result-art-height) 0 0; }
  .action-reveal-panel { gap: 12px; padding: 16px; }
  .action-reveal-stage { width: 140px; flex-basis: 105px; height: 105px; }
  .action-aura { width: 125px; height: 125px; }
  .action-reveal-heading .eyebrow { margin-bottom: 7px; font-size: 9px; }
  .action-reveal-heading h2 { font-size: 22px; }
  .action-reveal-heading p { margin-top: 5px; font-size: 12px; }
}
@media(max-width:600px) {
  .growth-result .action-reveal-panel { gap: 9px; padding: 12px; }
  .growth-result .action-reveal-stage { flex-basis: 80px; height: 80px; width: 110px; }
  .growth-result .action-reveal-heading .eyebrow { display: none; }
  .growth-result .action-reveal-heading h2 { font-size: 20px; }
}


/* Source: settlement.css */
/* One weekly chapter, with optional detail dialogs. */
.week-finale { max-width:1240px; margin:0 auto; }
.week-enter { animation:week-enter 620ms cubic-bezier(.2,.65,.3,1) both; animation-delay:var(--enter-delay,0ms); }
.week-kicker { display:inline-flex; align-items:center; gap:7px; font-size:10px; font-weight:800; letter-spacing:1.8px; color:var(--accent); }
.week-kicker .icon { width:15px; height:15px; }
.week-cover { position:relative; padding:20px 28px 24px; border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line)); border-radius:22px; background:radial-gradient(ellipse at 95% 0%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 60%),var(--surface); }
.week-cover-header { display:flex; align-items:center; justify-content:space-between; gap:24px; }
.week-cover-copy { min-width:0; }
.week-cover h2 { font-size:clamp(24px,2.4vw,34px); letter-spacing:-1.3px; margin:12px 0 8px; line-height:1.35; }
.week-cover-copy>p { font-size:13px; color:var(--muted); line-height:1.7; }
.week-gain,.week-gain .icon { color:var(--mint); }
.week-loss { color:var(--accent); }
.week-charm-button { display:inline-flex; align-items:center; gap:8px; margin-top:12px; padding:8px 12px; min-height:40px; border-radius:10px; background:color-mix(in srgb,var(--mint) 7%,transparent); border:1px solid color-mix(in srgb,var(--mint) 22%,var(--line)); font-size:12px; }
.week-charm-button.week-loss { background:color-mix(in srgb,var(--accent) 7%,transparent); border-color:color-mix(in srgb,var(--accent) 22%,var(--line)); }
.week-charm-button>span { color:var(--ink); }
.week-charm-button b { font-size:18px; }
.week-charm-button .icon { width:16px; height:16px; }
.week-charm-button:hover { background:color-mix(in srgb,var(--mint) 14%,var(--surface)); }
.week-charm-button.week-loss:hover { background:color-mix(in srgb,var(--accent) 14%,var(--surface)); }
.week-calendar-advance { flex:0 0 132px; display:flex; flex-direction:column; align-items:center; padding:10px 0 0; overflow:hidden; border:1px solid color-mix(in srgb,var(--accent) 50%,var(--line)); background:var(--surface); color:var(--ink); border-radius:12px; box-shadow:0 5px 16px #00000015; transition:transform 180ms,box-shadow 180ms; }
.week-calendar-label { width:calc(100% - 24px); padding-bottom:7px; border-bottom:1px dashed var(--line); font-size:8px; letter-spacing:1.5px; color:var(--accent); }
.week-calendar-advance strong { font-size:46px; line-height:1.1; letter-spacing:-2px; margin:5px 0; }
.week-calendar-advance small { font-size:10px; color:var(--muted); margin-bottom:10px; }
.week-calendar-next { display:flex; align-items:center; justify-content:center; gap:8px; width:100%; min-height:36px; padding:7px; background:var(--accent); color:#281824; font-size:12px; font-weight:800; }
.week-calendar-next .icon { width:17px; height:17px; }
.week-calendar-advance:hover { transform:translateY(-2px); box-shadow:0 7px 20px #00000022; }
.week-calendar-advance:hover .week-calendar-next { background:var(--accent-light); }
.week-calendar-advance:active { transform:translateY(1px); }
.week-section-heading { display:flex; align-items:end; justify-content:space-between; gap:14px; margin-bottom:15px; }
.week-cover .week-section-heading h2 { display:flex; align-items:center; gap:8px; font-size:20px; letter-spacing:-.5px; margin:6px 0 0; }
.week-section-heading h2 .icon { color:var(--accent); width:21px; height:21px; }
.week-section-heading p { color:var(--muted); font-size:12px; }
.week-story-layout { display:grid; grid-template-columns:minmax(0,1fr) 290px; align-items:start; gap:24px; margin-top:18px; padding-top:18px; border-top:1px solid var(--line); }
.week-new { position:absolute; top:10px; left:10px; padding:4px 6px; font-size:8px; letter-spacing:1px; border-radius:5px; }
.week-quiet { padding:35px 20px; color:var(--muted); background:var(--surface); border:1px dashed var(--line); border-radius:14px; font-size:13px; }
.week-footnote { color:var(--muted); font-size:12px; margin-top:12px; }
.week-wallet { border:1px solid var(--line); border-radius:18px; background:var(--surface); overflow:hidden; }
.week-wallet-body { padding:20px; }
.week-cover .week-wallet h2 { font-size:17px; margin:8px 0 16px; letter-spacing:-.4px; }
.week-payday { position:relative; overflow:hidden; display:flex; align-items:center; gap:10px; padding:18px; color:var(--mint); background:color-mix(in srgb,var(--mint) 8%,transparent); border-bottom:1px solid color-mix(in srgb,var(--mint) 20%,var(--line)); font-size:12px; }
.week-payday-icon { display:grid; place-items:center; width:32px; height:32px; flex-shrink:0; border-radius:50%; border:1px solid color-mix(in srgb,var(--mint) 40%,transparent); }
.week-payday-icon .icon { width:20px; height:20px; }
.week-payday>span:nth-child(2) { flex:1; }
.week-payday strong { display:block; font-size:23px; margin-top:5px; letter-spacing:-.7px; white-space:nowrap; }
.week-payday>.icon { width:16px; height:16px; }
.week-payday::after { content:''; position:absolute; inset:0; background:linear-gradient(110deg,transparent 30%,#ffffff30,transparent 70%); transform:translateX(-120%); animation:week-shine 850ms 1050ms both; pointer-events:none; }
.week-expense-button { display:flex; align-items:center; justify-content:space-between; width:calc(100% + 16px); margin:0 -8px; gap:8px; padding:8px; border-radius:9px; text-align:left; }
.week-expense-button:hover { background:var(--surface-raised); }
.week-expense-button>span { color:var(--muted); font-size:11px; }
.week-expense-button small { display:flex; align-items:center; gap:4px; margin-top:4px; font-size:10px; color:var(--ink); }
.week-expense-button small .icon { width:12px; height:12px; }
.week-expense-button strong { font-size:16px; white-space:nowrap; }
.week-wallet dl { margin:0; }
.week-wallet dt { color:var(--muted); font-size:11px; }
.week-wallet .week-wallet-total { margin-top:12px; padding-top:16px; border-top:1px dashed var(--line); }
.week-wallet-total dd { color:var(--balance-color); font-size:29px; font-weight:800; margin:7px 0 0; letter-spacing:-.8px; }
.week-number { animation:week-number 720ms both; animation-delay:calc(var(--enter-delay,0ms) + 420ms); font-variant-numeric:tabular-nums; }

/* Details share the game's sticky, upper-right back navigation. */
.week-details-modal { max-width:600px; padding:0 26px 26px; }
.week-details-intro { color:var(--muted); font-size:12px; line-height:1.7; }
.week-expense-total { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; padding:18px; margin-top:22px; border-radius:12px; background:color-mix(in srgb,var(--accent) 7%,transparent); border:1px solid color-mix(in srgb,var(--accent) 20%,var(--line)); }
.week-expense-total>span { font-size:12px; }
.week-expense-total>strong { font-size:24px; }
.week-expense-list,.week-charm-changes ul { list-style:none; padding:0; margin:12px 0 0; }
.week-expense-list li,.week-charm-changes li { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0; border-bottom:1px solid var(--line); font-size:12px; }
.week-expense-list li:last-child,.week-charm-changes li:last-child { border:0; }
.week-expense-list li>span { display:flex; align-items:center; gap:9px; }
.week-expense-list li>span>.icon { width:16px; height:16px; color:var(--muted); }
.week-expense-list strong,.week-charm-changes strong { white-space:nowrap; }
.week-growth-list { display:grid; gap:12px; margin-top:24px; }
.week-growth-list article { display:flex; align-items:center; gap:14px; padding:12px; border:1px solid var(--line); border-radius:14px; }
.week-growth-list img { width:80px; height:80px; object-fit:cover; border-radius:9px; }
.week-growth-list article>div { flex:1; min-width:0; }
.week-growth-list h3 { font-size:15px; margin:0 0 6px; }
.week-growth-list p { font-size:11px; color:var(--muted); line-height:1.6; }
.week-growth-list strong { display:flex; align-items:center; gap:4px; font-size:21px; white-space:nowrap; }
.week-growth-list strong .icon { width:15px; height:15px; }
.week-charm-changes { margin-top:24px; padding-top:20px; border-top:1px solid var(--line); }
.week-charm-changes h3 { font-size:15px; }
.week-charm-changes li>span { color:var(--muted); }
.week-detail-empty { padding:24px 0; color:var(--muted); font-size:13px; }
@keyframes week-enter { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:translateY(0); } }
@keyframes week-number { 0% { filter:brightness(1); } 40% { filter:brightness(1.3); text-shadow:0 0 15px color-mix(in srgb,currentColor 45%,transparent); } 100% { filter:brightness(1); text-shadow:none; } }
@keyframes week-shine { to { transform:translateX(120%); } }
@media(max-width:1000px) {
 .week-cover { padding:24px; }
 .week-story-layout { grid-template-columns:minmax(0,1fr) 265px; gap:20px; }
 .week-payday { padding:16px; gap:8px; }
 .week-payday strong { font-size:21px; }
}
@media(max-width:760px) {
 .week-cover-header { align-items:start; gap:16px; }
 .week-calendar-advance { flex-basis:110px; }
 .week-story-layout { grid-template-columns:1fr; }
 .week-wallet-body { padding:20px; }
 .week-section-heading { align-items:start; flex-direction:column; gap:8px; }
}
@media(max-width:440px) {
 .week-cover { padding:20px 16px; }
 .week-cover h2 { font-size:24px; }
 .week-cover-copy>p { font-size:12px; }
 .week-cover-header { gap:10px; }
 .week-calendar-advance { flex-basis:96px; }
 .week-calendar-advance strong { font-size:38px; }
 .week-calendar-next { gap:5px; font-size:11px; }
 .week-charm-button { gap:6px; padding:9px; font-size:11px; }
 .week-charm-button b { font-size:16px; }
 .week-cover .week-section-heading h2 { font-size:18px; }
 .week-kicker { font-size:8px; letter-spacing:1.3px; }
 .week-story-layout { margin-top:22px; padding-top:20px; }
 .week-new { top:8px; left:8px; }
 .week-wallet-body { padding:16px; }
 .week-payday { padding:16px 12px; }
 .week-payday strong { font-size:20px; }
 .week-payday-icon { width:28px; height:28px; }
 .week-payday>.icon { width:14px; height:14px; }
 .week-wallet-total dd { font-size:27px; }
 .week-details-modal { padding:0 18px 20px; }
 .week-details-content .eyebrow { font-size:9px; letter-spacing:1.3px; }
 .week-expense-total { padding:14px; }
 .week-expense-total>strong { font-size:22px; }
 .week-expense-list li { font-size:11px; gap:8px; }
 .week-expense-list li>span>.icon { width:14px; height:14px; }
 .week-growth-list article { padding:10px; gap:10px; }
 .week-growth-list img { width:54px; height:68px; }
 .week-growth-list h3 { font-size:13px; }
 .week-growth-list p { font-size:10px; }
 .week-growth-list strong { font-size:18px; gap:2px; }
 .week-growth-list strong .icon { width:13px; height:13px; }
}
/* Keep the standard weekly recap within shorter desktop windows as well. */
@media(min-width:1001px) and (max-height:850px) {
 .week-cover { padding:16px 24px 20px; }
 .week-cover-copy>.week-kicker, .week-section-heading .week-kicker { display:flex; }
 .week-cover-copy>h1 { font-size:27px; margin:8px 0 6px; }
 .week-charm-button { margin-top:8px; min-height:36px; padding:6px 10px; line-height:1.4; }
 .week-calendar-advance { flex-basis:120px; padding-top:8px; }
 .week-calendar-advance strong { font-size:39px; margin:3px 0; }
 .week-calendar-advance small { margin-bottom:6px; }
 .week-calendar-next { min-height:32px; padding:5px; }
 .week-story-layout { margin-top:14px; padding-top:14px; }
 .week-section-heading { margin-bottom:10px; }
 .week-wallet-body { padding:16px; }
 .week-payday { padding:12px 16px; }
 .week-payday strong { font-size:21px; line-height:1.3; margin-top:3px; }
 .week-cover .week-wallet h2 { margin:6px 0 10px; }
 .week-wallet .week-wallet-total { margin-top:8px; padding-top:10px; }
 .week-wallet-total dd { font-size:26px; line-height:1.25; margin-top:5px; }
}


/* Source: four-stats.css */
.charm-trigger { padding: 0; border: 0; background: transparent; color: inherit; font: inherit; cursor: pointer; }
.game-header .progress-charm { position:relative; min-height:44px; min-width:56px; }
.game-header .progress-charm .charm-trigger { position:absolute; inset:0; width:100%; height:100%; min-height:44px; border-radius:8px; }
.game-header .progress-charm:hover dd>strong { text-shadow:0 0 12px #ceef9b66; }
.game-header .progress-charm dd>strong { color:#c5eaa0; }
[data-theme="light"] .game-header .progress-charm dd>strong { color:#598332; }
.memory-picture { display: block; width: 100%; height: 100%; object-fit: cover; }
.finale-portrait.finale-memory { width: min(760px, 100%); aspect-ratio: 16 / 9; height: auto; border-radius: 18px; }
.finale-memory .memory-picture { position: absolute; inset: 0; }
.ending-art .memory-picture { object-fit: cover; }
.charm-trigger:hover strong { text-shadow: 0 0 12px #ceef9b66; }
.game-header .progress-charm .charm-trigger strong { color: #c5eaa0; }
[data-theme="light"] .game-header .progress-charm .charm-trigger strong { color: #598332; }
.charm-modal { --dialog-small-width:440px; --charm-color:#c5eaa0; }
.charm-heading .dialog-title { gap:10px 14px; }
.charm-total { display:inline-flex; align-items:center; gap:5px; padding:5px 9px; border-radius:10px; background:color-mix(in srgb,var(--charm-color) 12%,transparent); color:var(--charm-color); white-space:nowrap; letter-spacing:0; }
.charm-total .icon { width:17px; height:17px; }
.charm-total strong { font-size:21px; line-height:1.25; }
.charm-total small { color:var(--muted); font-size:11px; font-weight:500; }
.charm-stat-list { display:grid; gap:10px; margin:0; }
.charm-stat-list .charm-stat { display:grid; grid-template-columns:1fr auto; gap:9px; padding:12px 14px; border:1px solid var(--line); border-radius:14px; background:color-mix(in srgb,var(--surface-raised) 55%,var(--surface)); animation:charm-stat-arrive 480ms var(--ui-motion-ease) calc(var(--charm-delay) + 80ms) both; }
.charm-stat-list dt { display:flex; align-items:center; gap:10px; font-size:14px; font-weight:700; }
.charm-stat-icon { display:grid; place-items:center; width:30px; height:30px; border-radius:9px; color:var(--charm-color); background:color-mix(in srgb,var(--charm-color) 11%,transparent); }
.charm-stat-icon .icon { width:19px; height:19px; }
.charm-stat-list dd { display:flex; align-items:center; gap:4px; margin:0; }
.charm-stat-list strong { color:var(--charm-color); font-size:19px; font-variant-numeric:tabular-nums; }
.charm-stat-list small { font-size:10px; color:var(--muted); }
.charm-stat-track { grid-column:1 / -1; height:7px; overflow:hidden; border-radius:8px; background:var(--line); }
.charm-stat-track>span { display:block; width:var(--charm-value); height:100%; border-radius:inherit; background:linear-gradient(90deg,#9bc568,#c5eaa0); transform-origin:left; animation:charm-stat-fill 850ms var(--ui-motion-ease) calc(var(--charm-delay) + 180ms) both; }
[data-theme="light"] .charm-modal { --charm-color:#598332; }
@keyframes charm-stat-arrive { from{opacity:0;transform:translateY(9px)}to{opacity:1;transform:none} }
@keyframes charm-stat-fill { from{transform:scaleX(0)}to{transform:scaleX(1)} }
@media(max-height:650px){.charm-stat-list{gap:8px}.charm-stat-list .charm-stat{padding:9px 12px;gap:7px}.charm-stat-icon{width:27px;height:27px}}
.stat-gains { display: inline-flex; flex-wrap: wrap; gap: 6px 12px; font-size: 12px; line-height: 1.5; }
.stat-gains > span { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.stat-gains > span > .icon { width:15px; height:15px; flex-shrink:0; }
.stat-gain { color: #c5eaa0; }
.stat-loss { color: var(--accent); }
[data-theme="light"] .stat-gain { color: #598332; }
.growth-card .card-effects { flex-wrap: wrap; gap: 6px 10px; }
.growth-card .stat-gains { gap: 8px; padding: 4px 8px; border-radius: 6px; background: #17261bd9; }
.growth-card .stat-gain, [data-theme="light"] .growth-card .stat-gain { color: #ceef9b; }
.week-growth-list .stat-gains { flex-direction: column; gap: 3px; align-items: flex-end; }
.week-opening { position: fixed; inset: 0; z-index: 10001; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 36px; background: radial-gradient(ellipse at 50% 45%, #ffbdc217, transparent 65%), var(--bg); }
.week-opening > p { margin: 0; color: var(--muted); font-size: 15px; letter-spacing: .02em; }
.week-opening-calendar { position: relative; width: 228px; height: 248px; perspective: 900px; filter: drop-shadow(0 18px 24px #0002); }
.calendar-sheet { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; border-radius: 12px; background: #fff8ef; color: #6b5655; border-top: 36px solid #e9959c; box-shadow: 0 4px 0 #dfd4c8, 0 8px 0 #f7eee5; transform-origin: center top; backface-visibility: hidden; }
.calendar-sheet small { font-size: 10px; letter-spacing: .2em; }
.calendar-sheet strong { color: #d17e87; font-size: 100px; line-height: 1.28; font-family: Georgia, serif; font-weight: 400; }
.calendar-sheet > span { font-size: 10px; letter-spacing: .3em; }
.calendar-rings { position: absolute; inset: -10px 42px auto; display: flex; justify-content: space-between; z-index: 3; }
.calendar-rings i { width: 8px; height: 26px; border-radius: 7px; background: #aa7e7e; box-shadow: inset 2px 0 0 #ffd9cf; }
.calendar-turn { z-index: 2; }
.is-playing .calendar-turn { animation: calendar-turn 1100ms 140ms cubic-bezier(.45,.05,.25,1) both; }
.is-playing .calendar-new { animation: calendar-arrive 1000ms 180ms ease-out both; }
@keyframes calendar-turn { 0%, 10% { transform: rotateX(0); opacity: 1; } 80%, 100% { transform: rotateX(155deg) translateY(-30px); opacity: 0; } }
@keyframes calendar-arrive { from { filter: brightness(.83); } to { filter: brightness(1); } }


/* Source: romance-journey.css */
.location-affinities{display:grid;grid-template-columns:1fr 1fr;gap:0 24px;margin:10px 0 24px;padding:14px 20px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}
.location-affinities>div{display:flex;justify-content:space-between;gap:12px;padding:9px 0;font-size:13px}
.location-affinities dt{font-weight:700}.location-affinities dd{margin:0;color:var(--muted)}
.finale-chosen{position:relative;isolation:isolate;width:230px;margin:28px auto 24px;animation:finale-arrive 1s cubic-bezier(.18,.8,.3,1) both}
.finale-halo{position:absolute;z-index:-1;inset:-42px;background:radial-gradient(ellipse,#f2b0c245,transparent 70%);border-radius:50%;animation:finale-breathe 4s ease-in-out infinite}
.finale-chosen:before,.finale-chosen:after{content:"✦";position:absolute;z-index:2;color:#e9a8bb;text-shadow:0 0 18px #f8c8d4;font-size:26px;animation:finale-twinkle 3s ease-in-out infinite}
.finale-chosen:before{top:14%;left:-18px}.finale-chosen:after{bottom:22%;right:-16px;animation-delay:1s;font-size:18px}
.finale-album{margin:18px auto 6px}.love-finale>h1,.love-finale>p,.love-finale>.finale-stats{animation:finale-arrive 1s .2s both}.finale-roster{animation:finale-arrive 1s .35s both}
@keyframes finale-arrive{from{opacity:0;transform:translateY(22px) scale(.97)}to{opacity:1;transform:none}}
@keyframes finale-breathe{50%{transform:scale(1.1);opacity:.6}}
@keyframes finale-twinkle{50%{opacity:.3;transform:scale(.7) rotate(20deg)}}
@media(max-width:600px){.location-affinities{grid-template-columns:1fr}.finale-chosen{width:205px}}


/* Source: loading.css */
/* The static bootstrap and SetupView reserve the same form space below the logo. */
.player-setup{min-height:var(--setup-panel-height,390px)}
.player-setup.is-loading{display:grid;place-items:center;background:transparent;border-color:transparent;box-shadow:none}
[data-theme="light"] .player-setup.is-loading{box-shadow:none}
.setup-loading{display:flex;flex-direction:column;align-items:center;gap:20px;width:100%}
.setup-loading p{font-weight:800;font-size:15px;text-align:center;word-break:keep-all;line-height:1.9;color:var(--muted)}
.loading-dots{display:flex;gap:10px;height:14px;align-items:center}.loading-dots i{width:7px;height:7px;border-radius:50%;background:var(--accent);animation:loading-dot 1.4s ease-in-out infinite;opacity:.3}.loading-dots i:nth-child(2){animation-delay:.18s}.loading-dots i:nth-child(3){animation-delay:.36s}
@keyframes loading-dot{0%,70%,100%{opacity:.3;transform:translateY(0)}35%{opacity:1;transform:translateY(-4px)}}
#blazor-error-ui{display:none;position:fixed;bottom:0;left:0;right:0;z-index:200;padding:16px;background:#c63b6b;color:white;font-weight:700;text-align:center}#blazor-error-ui a{color:white;text-decoration:underline;margin-left:16px}


/* Source: presentation.css */


/* Hold every text/effect row at the same baseline, even when copy wraps. */
.growth-card-copy { display:grid; grid-template-rows:auto auto auto; row-gap:6px; }
.growth-card-copy>strong { display:flex; align-items:flex-end; height:2.4em; margin:0; line-height:1.2; font-size:clamp(16px,1.4vw,20px); }
.growth-card-description { height:3em; min-height:0; line-height:1.5; overflow:hidden; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.growth-card .card-effects { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:26px 27px; gap:5px; margin:0; justify-items:start; }
.growth-card .card-effect { font-size:11px; padding:5px 7px; }
.growth-card .card-effect.is-loss { padding:0; font-size:12px; }
.growth-card .stat-gains { display:flex; flex-wrap:nowrap; gap:8px; padding:4px 7px; font-size:11px; }

/* The reveal's glass heart is reused for both failure surfaces. */
.glass-heart { display:block; width:100%; height:100%; overflow:visible; }
.glass-heart.is-broken { filter:grayscale(1) drop-shadow(0 6px 10px #0002); }
.glass-heart.is-broken .heart-liquid { transform:none; }
.glass-heart.is-broken .heart-whole { display:none; }
.glass-heart.is-broken .heart-half { opacity:1; }
.glass-heart.is-broken .heart-left { transform:translate(-10px,5px) rotate(-8deg); }
.glass-heart.is-broken .heart-right { transform:translate(10px,5px) rotate(8deg); }
.result-broken-heart { align-self:center; width:148px; height:142px; margin:0 auto 6px; }
.result-broken-heart .heart-left { animation:glass-left-settle 800ms ease-out both; }
.result-broken-heart .heart-right { animation:glass-right-settle 800ms ease-out both; }

/* A calendar chapter opening: arrival, deliberate page turn, then a new week. */
.week-opening { isolation:isolate; overflow:hidden; gap:24px; background:radial-gradient(ellipse at 50% 48%,color-mix(in srgb,var(--accent) 13%,transparent),transparent 62%),var(--bg); }
.week-opening-kicker { font:11px Georgia,serif; letter-spacing:6px; color:var(--accent); }
.week-opening-calendar { width:228px; height:248px; transform:rotate(-5deg); }
.week-opening.is-playing .week-opening-calendar { animation:calendar-present 2500ms cubic-bezier(.2,.65,.3,1) both; }
.week-opening .calendar-sheet { background:linear-gradient(135deg,#fffdf8,#fff0e8); border-top-color:#e995a4; box-shadow:0 4px 0 #dfc8c8,0 8px 0 #f7eee5,0 22px 40px #0002; }
.week-opening .calendar-new::after { content:'♡'; position:absolute; right:16px; bottom:14px; color:#e995a4; font-size:25px; transform:rotate(-12deg); }
.week-opening.is-playing .calendar-turn { animation:calendar-turn 1650ms 600ms cubic-bezier(.42,0,.22,1) both; }
.week-opening.is-playing .calendar-new { animation:calendar-arrive 1500ms 700ms ease-out both; }
.week-opening.is-playing .calendar-new strong { animation:calendar-number 650ms 1800ms ease-out both; }
.week-opening>p { display:flex; flex-direction:column; gap:9px; align-items:center; text-align:center; }
.week-opening>p strong { color:var(--ink); font-size:24px; letter-spacing:-.5px; }
.week-opening>p span { color:var(--muted); font-size:14px; }
.week-opening.is-playing>p { animation:result-item-in 650ms 1650ms ease-out both; }
.week-opening.is-playing .week-opening-kicker { animation:result-item-in 600ms 100ms ease-out both; }
.week-opening-orbit { position:absolute; z-index:-1; width:min(520px,82vw); aspect-ratio:1; border:1px solid color-mix(in srgb,var(--accent) 18%,transparent); border-radius:50%; box-shadow:0 0 0 40px color-mix(in srgb,var(--accent) 3%,transparent),0 0 0 80px color-mix(in srgb,var(--accent) 2%,transparent); }
.week-opening.is-playing .week-opening-orbit { animation:chapter-orbit 2600ms ease-out both; }
.week-opening-sparks { position:absolute; inset:0; pointer-events:none; }
.week-opening-sparks i { position:absolute; left:50%; top:48%; color:var(--accent); opacity:0; transform:rotate(calc(var(--spark)*45deg)) translateY(-185px); }
.week-opening-sparks .icon { width:16px; height:16px; }
.week-opening.is-playing .week-opening-sparks i { animation:chapter-spark 1100ms ease-out both; animation-delay:calc(1550ms + var(--spark)*35ms); }

/* Keep the weekly recap on the same page surface as the other steps. */
.week-finale .week-cover { border:0; border-radius:0; background:none; padding:8px 0 0; }
.week-cover-header { padding-right:28px; min-height:160px; }
.week-calendar-launch { position:relative; isolation:isolate; flex:0 0 132px; margin:16px 22px 20px; }
.week-calendar-launch>.week-calendar-advance { width:100%; margin:0; z-index:1; }
.week-calendar-waves { position:absolute; inset:0; pointer-events:none; }
.week-calendar-waves i { position:absolute; width:100%; aspect-ratio:1; top:50%; left:50%; transform:translate(-50%,-50%) scale(.78); border:2px solid var(--accent); border-radius:50%; box-shadow:0 0 14px color-mix(in srgb,var(--accent) 24%,transparent); opacity:0; animation:calendar-heart-wave 3.6s 1.2s cubic-bezier(.16,.55,.38,1) infinite; }
.week-calendar-waves i:nth-child(2) { border-width:1px; animation-delay:1.48s; }
@keyframes calendar-heart-wave { 0% { opacity:0; transform:translate(-50%,-50%) scale(.78); } 9% { opacity:.65; } 44% { opacity:.08; } 55%,100% { opacity:0; transform:translate(-50%,-50%) scale(1.5); } }
.week-calendar-advance { transform:rotate(-6deg); transition:transform 350ms cubic-bezier(.2,.65,.3,1),box-shadow 350ms; }
.week-calendar-advance:is(:hover,:focus-visible) { transform:rotate(0deg) translateY(-3px); }
.week-calendar-advance:active { transform:rotate(0deg) translateY(1px); }
.week-calendar-advance { position:relative; animation:calendar-invite 3.6s 1.2s ease-in-out infinite; }
.week-calendar-advance:is(:hover,:focus-visible) { animation:none; }
.week-calendar-next .icon { animation:calendar-next-cue 2.4s 1.4s ease-in-out infinite; }
@keyframes calendar-invite { 0%,18%,40%,100% { box-shadow:0 5px 16px #00000015; scale:1; } 8% { box-shadow:0 0 16px color-mix(in srgb,var(--accent) 24%,transparent); scale:1.035; } 26% { scale:1.02; } }
@keyframes calendar-next-cue { 0%,60%,100% { translate:0 0; } 75%,90% { translate:4px 0; } }
.portrait-viewer-trigger { display:block; padding:0; border:0; border-radius:0; margin:0; text-align:initial; cursor:zoom-in; color:inherit; background:transparent; min-width:0; }
.portrait-viewer-trigger:hover { background:transparent; }
.portrait-viewer-trigger:disabled { opacity:1; cursor:default; }
.event-phone>.event-card.portrait-viewer-trigger { width:100%; }
.special-day-caption>.special-day-portrait { width:46px; height:58px; flex:none; border-radius:12px; overflow:hidden; }
.special-day-portrait>.portrait { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; }
.week-growth-list .stat-gains>span { display:inline-flex; align-items:center; gap:5px; }
.week-growth-list .stat-gains .icon { width:15px; height:15px; flex-shrink:0; }

@keyframes result-item-in { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } }
@keyframes portrait-arrive { from { opacity:0; transform:scale(1.035); } to { opacity:1; transform:scale(1); } }
@keyframes portrait-light { from { transform:translateX(-70%); } to { transform:translateX(70%); } }
@keyframes glass-left-settle { from { opacity:0; transform:translate(-4px,-3px) rotate(-2deg); } to { opacity:1; transform:translate(-10px,5px) rotate(-8deg); } }
@keyframes glass-right-settle { from { opacity:0; transform:translate(4px,-3px) rotate(2deg); } to { opacity:1; transform:translate(10px,5px) rotate(8deg); } }
@keyframes calendar-present { 0% { opacity:0; transform:translateY(18px) rotate(-9deg) scale(.94); } 22%,60% { opacity:1; transform:translateY(0) rotate(-5deg) scale(1); } 100% { opacity:1; transform:rotate(0deg) scale(1); } }
@keyframes calendar-turn { 0%,12% { transform:rotateX(0); opacity:1; } 65% { opacity:1; } 100% { transform:rotateX(-160deg) translateY(-12px); opacity:0; } }
@keyframes calendar-number { 0% { color:#d17e87; text-shadow:0 0 0 transparent; } 45% { color:#eb8b9c; text-shadow:0 0 25px #ee9aab77; } 100% { color:#d17e87; text-shadow:none; } }
@keyframes chapter-orbit { from { opacity:0; transform:scale(.8); } 65% { opacity:1; } to { opacity:.6; transform:scale(1.05); } }
@keyframes chapter-spark { 0% { opacity:0; transform:rotate(calc(var(--spark)*45deg)) translateY(-160px) scale(.4); } 35% { opacity:.8; } 100% { opacity:0; transform:rotate(calc(var(--spark)*45deg)) translateY(-245px) scale(1.1); } }
@media(max-width:600px) {
 .growth-card .card-effect.is-loss { font-size:11px; }
 .growth-card .stat-gains { font-size:10px; gap:6px; padding:4px 6px; }
 .growth-card-copy>strong { font-size:16px; }
 .week-cover-header { padding-right:0; min-height:180px; }
 .week-calendar-launch { margin:18px 12px; }
 .week-cover-copy>h1 { font-size:23px; }
 .result-broken-heart { width:120px; height:115px; }
 .week-opening-calendar { width:204px; height:224px; }
 .week-opening { gap:22px; }
}
@media(max-height:600px) {
 .week-opening { gap:16px; }
 .week-opening-calendar { width:180px; height:196px; }
 .week-opening .calendar-sheet strong { font-size:72px; }
 .week-opening>p strong { font-size:21px; }
 .result-broken-heart { width:100px; height:96px; }
}
@media(max-width:760px) { .week-calendar-launch { flex-basis:110px; } }
@media(max-width:440px) { .week-calendar-launch { flex-basis:96px; } .special-day-caption>.special-day-portrait { width:36px; height:46px; border-radius:9px; } }
@media(min-width:1001px) and (max-height:850px) { .week-calendar-launch { flex-basis:120px; } }


/* Source: heroine-card.css */
/* RelationshipCard owns every heroine card, with explicit content variants. */
.relationship-favorite{position:absolute;z-index:3;top:5px;right:5px;display:grid;place-items:center;width:44px;height:44px;padding:6px;border:0;background:transparent;color:#fff4fc;opacity:.78;cursor:pointer;touch-action:manipulation;transition:color 180ms ease,opacity 180ms ease}
.relationship-favorite .icon{width:32px;height:32px;stroke-width:2.05;filter:drop-shadow(0 .75px .5px #39263888)}
.relationship-favorite.is-favorite{color:#ffafd1;opacity:1}
.relationship-favorite:hover,.relationship-favorite:focus-visible{opacity:1;background:transparent}
.relationship-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:14px; align-items:start; }
.relationship-card { --card-copy-bottom:16px; position:relative; min-width:0; overflow:hidden; isolation:isolate; border:1px solid #3c3546; border-radius:16px; background:#24212f; }
.relationship-card--actions { --card-copy-bottom:120px; }
.relationship-card.has-actions.can-confess { --card-copy-bottom:80px; }
.relationship-art { display:block; position:relative; width:100%; aspect-ratio:4/5; overflow:hidden; padding:0; border:0; border-radius:0; background:#24212f; color:#fff9f2; text-align:left; }
.relationship-card--actions .relationship-art { aspect-ratio:5/8; }
.relationship-art>.portrait { position:absolute; top:0; left:50%; height:100%; width:auto; min-width:100%; transform:translateX(-50%); transition:transform 420ms var(--ui-motion-ease); transform-origin:center 24%; }
.relationship-art>.portrait-file { inset:0; width:100%; height:100%; min-width:0; transform:scale(1); object-fit:cover; object-position:center top; }
.relationship-art::after { content:''; position:absolute; inset:0; pointer-events:none; background:linear-gradient(transparent 30%,#15121b50 50%,#15121be8 82%,#15121b); }
.relationship-card--actions .relationship-art::after,.relationship-card.can-confess .relationship-art::after { background:linear-gradient(transparent 28%,#15121b55 43%,#15121b 72%,#15121b); }
.relationship-card:is(:hover,:focus-within) .relationship-art>.portrait-file { transform:scale(1.045); }
.relationship-card:is(:hover,:focus-within) .relationship-art>.portrait:not(.portrait-file) { transform:translateX(-50%) scale(1.045); }
.relationship-overlay { position:absolute; bottom:var(--card-copy-bottom); left:12px; right:12px; z-index:1; display:block; text-shadow:0 2px 9px #0006; }
.relationship-name { display:flex; flex-wrap:wrap; align-items:baseline; gap:5px; font-size:23px; font-weight:900; letter-spacing:-.7px; line-height:1.2; }
.relationship-name small { font-size:11px; font-weight:500; letter-spacing:0; }
.relationship-job { display:block; font-size:11px; color:#e8e2e9; margin-top:6px; line-height:1.5; }
.relationship-caption { display:block; margin-top:5px; font-size:10px; line-height:1.5; color:#efe7ee; }
.relationship-overlay .relationship-meter { margin-top:12px; color:#ff9bbb; }
.relationship-overlay .relationship-track { background:#ffffff30; }
.relationship-overlay .relationship-meter>.icon { width:15px; height:15px; flex-basis:15px; }
.heroine-new { position:absolute; z-index:1; top:10px; left:10px; padding:4px 6px; border-radius:5px; font-size:9px; }
.relationship-actions { position:absolute; z-index:2; bottom:12px; left:12px; right:12px; display:grid; grid-template-columns:1fr 1fr; gap:6px; }
.relationship-actions button { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-width:0; min-height:52px; padding:8px 3px; border:1px solid var(--accent); border-radius:8px; background:var(--accent); color:var(--bg); font-weight:900; font-size:13px; line-height:1.3; }
.relationship-actions small { font-size:10px; font-weight:600; }
.relationship-actions button>span { display:inline-flex; align-items:center; justify-content:center; gap:3px; white-space:nowrap; }
.relationship-actions button>span .icon { width:14px; height:14px; flex-shrink:0; }
.relationship-actions button:disabled { opacity:.45; cursor:not-allowed; }
.relationship-actions button:not(:disabled):hover { filter:brightness(1.12); }
.relationship-actions .relationship-contact { grid-column:1/-1; min-height:34px; padding:7px; }
.relationship-actions .relationship-confess { grid-column:1/-1; }
[data-theme="light"] .relationship-actions button { color:white; }

.week-heroine-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.week-heroine-grid:has(>:nth-child(5)) { grid-template-columns:repeat(5,minmax(0,1fr)); }
.relationship-card--summary { --card-copy-bottom:12px; }
.relationship-card--summary .relationship-name { font-size:18px; }
.relationship-card--summary .relationship-job { font-size:10px; }
.relationship-card--summary .relationship-overlay { left:10px; right:10px; }
.relationship-card--summary .relationship-meter { margin-top:8px; }
.relationship-card--summary .relationship-caption { font-size:9px; }
.finale-chosen .relationship-card { width:100%; box-shadow:0 12px 45px #e98fa43b; border-color:#efacb67a; }

/* Confession-ready cards reuse the same portrait, copy, meter and action. */
.relationship-card--confession { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:14px; padding:14px; background:var(--surface); border-color:var(--line); border-radius:var(--dialog-item-radius); }
.relationship-card--confession .relationship-art { display:grid; grid-template-columns:60px minmax(0,1fr); gap:14px; align-items:center; aspect-ratio:auto; overflow:hidden; color:var(--ink); background:transparent; }
.relationship-card--confession .relationship-art>.portrait { position:static; width:60px; height:80px; min-width:0; border-radius:10px; transform:scale(1); }
.relationship-card--confession:is(:hover,:focus-within) .relationship-art>.portrait { transform:scale(1.045); }
.relationship-card--confession .relationship-art::after { display:none; }
.relationship-card--confession .relationship-overlay { position:static; min-width:0; text-shadow:none; }
.relationship-card--confession .relationship-name { font-size:19px; }
.relationship-card--confession .relationship-job { color:var(--muted); }
.relationship-card--confession .relationship-meter { color:var(--accent); margin-top:8px; }
.relationship-card--confession .relationship-track { background:var(--line); }
.relationship-card--confession .relationship-state { display:none; }
.relationship-card--confession .relationship-actions { position:static; display:block; }
.relationship-card--confession .relationship-actions button { min-height:44px; padding:10px 13px; font-size:12px; }
@media(max-width:1100px) { .relationship-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } }
@media(max-width:1000px) { .week-heroine-grid,.week-heroine-grid:has(>:nth-child(5)) { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:820px) { .relationship-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } }
@media(max-width:600px) {
 .relationship-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .relationship-card { border-radius:13px; --card-copy-bottom:13px; }
 .relationship-card--actions { --card-copy-bottom:122px; }
 .relationship-card--actions .relationship-art { aspect-ratio:5/9; min-height:320px; }
 .relationship-overlay { left:10px; right:10px; }
 .relationship-name { font-size:20px; }
 .relationship-job { font-size:10px; }
 .relationship-actions { left:8px; right:8px; bottom:10px; gap:5px; }
 .relationship-actions button { min-height:62px; padding:6px 2px; font-size:11px; }
 .relationship-actions button>span { flex-direction:column; gap:3px; }
 .relationship-actions .relationship-contact>span,.relationship-actions .relationship-confess>span { flex-direction:row; }
 .relationship-actions .relationship-contact { min-height:32px; }
 .relationship-card--summary .relationship-name { font-size:17px; }
}
@media(max-width:440px) { .week-heroine-grid,.week-heroine-grid:has(>:nth-child(5)) { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; } }
@media(max-width:400px) {
 .relationship-card--confession { grid-template-columns:1fr; gap:10px; }
 .relationship-card--confession .relationship-art { grid-template-columns:48px minmax(0,1fr); gap:10px; }
 .relationship-card--confession .relationship-art>.portrait { width:48px; height:68px; }
 .relationship-card--confession .relationship-actions { padding-left:58px; }
 .relationship-card--confession .relationship-actions button { width:100%; }
}
@media(max-width:360px) {
 .relationship-grid { gap:9px; }
 .relationship-name { font-size:19px; }
 .relationship-actions { left:6px; right:6px; gap:4px; }
 .relationship-actions button { font-size:10px; }
 .relationship-actions button>span .icon { width:11px; height:11px; }
}


/* Source: stage-layout.css */
/* StageHeading: the step trail, title, description and tools align in every step. */
:root { --stage-title-size:clamp(30px,3vw,40px); }
.stage { max-width:1320px; min-height:calc(100dvh - 100px); margin:auto; padding:24px 30px 28px; outline:none; }
.stage-heading { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:8px 24px; margin:0 0 20px; }
.stage-title { display:contents; }
.stage-title>.stage-steps,.stage-title>.eyebrow { grid-column:1/-1; grid-row:1; margin-bottom:6px; }
.stage-title-copy { grid-column:1; grid-row:2; min-width:0; }
.stage-title-copy>h1 { margin:0; font-size:var(--stage-title-size); line-height:1.3; letter-spacing:-1.3px; word-break:keep-all; }
.stage-kicker { display:block; margin:0 0 5px; color:var(--muted); font-size:10px; font-weight:700; letter-spacing:1.6px; text-transform:uppercase; }
.stage-title>p { grid-column:1/-1; grid-row:3; margin:0; color:var(--muted); font-size:14px; line-height:1.7; word-break:keep-all; }
.stage-description { display:flex; align-items:center; gap:10px; }
.stage-description>span:first-child { min-width:0; }
.stage-remaining { flex:none; color:var(--balance-color); font-weight:600; white-space:nowrap; font-variant-numeric:tabular-nums; }
.stage-remaining>strong { font-weight:850; }
.stage-heading .stage-steps { gap:9px; flex-wrap:nowrap; }
.stage-heading .stage-steps li { gap:9px; }
.stage-heading .stage-steps li>span { width:28px; height:28px; flex:none; font-size:12px; font-variant-numeric:tabular-nums; }
.stage-heading .stage-steps li:not(:last-child)::after { content:''; width:18px; height:1px; margin:0; background:var(--line); opacity:1; }
.stage-heading .stage-steps .done>span { border-color:var(--mint); background:color-mix(in srgb,var(--mint) 10%,transparent); }
.stage-heading .stage-steps .icon { width:14px; height:14px; }
.context-tools { grid-column:2; grid-row:2; display:flex; align-items:center; justify-content:flex-end; gap:10px; width:auto; }
.stage-heading.steps-only { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:10px; }
.stage-heading.steps-only .stage-steps { margin:0; }
.week-cover-copy>h1 { margin:8px 0 6px; font-size:var(--stage-title-size); line-height:1.3; letter-spacing:-1.3px; word-break:keep-all; }
@media(min-width:801px) and (max-height:800px) {
 .stage { padding-top:14px; padding-bottom:16px; }
 .stage-heading { row-gap:6px; margin-bottom:14px; }
 .stage-title>.stage-steps { margin-bottom:0; }
 .stage-kicker { margin-bottom:2px; font-size:9px; }
}
@media(max-width:820px) { .stage { padding-inline:25px; } }
@media(max-width:600px) {
 :root { --stage-title-size:clamp(27px,7vw,32px); }
 .stage { padding:20px 20px 28px; min-height:calc(100dvh - 112px); }
 .stage-heading { gap:8px 12px; }
 .stage-title>p { font-size:13px; }
 .stage-description { gap:8px; }
 .stage-kicker { font-size:9px; letter-spacing:1.2px; }
 .stage-heading .stage-steps { gap:7px; }
 .stage-heading .stage-steps li { gap:7px; }
 .stage-heading .stage-steps li>span { width:26px; height:26px; font-size:11px; }
 .stage-heading .stage-steps li:not(:last-child)::after { width:16px; }
 .context-tools { gap:8px; }
 .context-tools .relationship-help { width:40px; height:40px; font-size:21px; }
 .context-tools .icon { width:19px; height:19px; }
 .week-cover-copy>h1 { font-size:26px; }
}


/* Source: dialog-layout.css */
/* ModalFrame owns dimensions/navigation; DialogHeading owns title typography.
   Illustrated results share one grid, including growth. No size animations. */
:root {
 --dialog-gap:24px; --dialog-padding:32px; --dialog-content-gap:24px; --dialog-back-size:48px;
 --dialog-small-width:520px; --dialog-list-width:660px; --dialog-wide-width:1120px; --dialog-art-width:960px;
 --dialog-item-radius:12px; --dialog-max-height:calc(100dvh - var(--dialog-gap) * 2);
 --ui-motion-ease:cubic-bezier(.2,.65,.3,1);
}
.modal-open { overflow:hidden; }
/* A locked page has no scrollbar: reserving its gutter leaves a blank strip beside dialogs. */
html:has(.modal-backdrop) { scrollbar-gutter:auto; }
.modal-backdrop { position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; padding:var(--dialog-gap); overflow-y:auto; background:#080912c9; backdrop-filter:blur(10px); }
.modal { position:relative; width:100%; max-width:850px; max-height:var(--dialog-max-height); overflow:auto; background:var(--surface); border:1px solid #ffffff25; border-radius:23px; box-shadow:0 25px 100px #0007; outline:none; overscroll-behavior:contain; animation:modal-in 160ms ease-out; }
.modal:focus { outline:none; }
.modal.dialog-small,.modal.dialog-list { display:flex; flex-direction:column; width:min(var(--dialog-small-width),100%); max-width:var(--dialog-small-width); min-height:0; padding:0; overflow:hidden; }
.modal.dialog-list { width:min(var(--dialog-list-width),100%); max-width:var(--dialog-list-width); }
.modal.dialog-wide { width:min(var(--dialog-wide-width),100%); max-width:var(--dialog-wide-width); }
.modal.dialog-illustrated { max-width:var(--dialog-art-width); }
/* Text-only endings must not inherit the wide portrait-dialog frame. */
.modal.ending-modal:not(:has(.ending-art)) { max-width:var(--dialog-small-width); }
.ending-modal:not(:has(.ending-art))>.ending-content { padding:var(--dialog-padding); }
/* Keep heads inside cropped portraits, including during the entrance zoom. Full-image viewers retain contain/center below. */
.modal :is(.portrait-file,.memory-picture) { object-position:center top; transform-origin:center top; }
.modal>.dialog-body { flex:1 1 auto; min-height:0; max-height:var(--dialog-max-height); padding:var(--dialog-padding); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; }
/* The shared body owns outer spacing; content margins must not add uneven edges. */
.modal>.dialog-body>:first-child { margin-top:0; }
.modal>.dialog-body>:last-child { margin-bottom:0; }
.dialog-body>.dialog-heading { margin-bottom:var(--dialog-content-gap); }
.dialog-body>.confirm-actions { margin-top:var(--dialog-content-gap); }
.dialog-body>:is(.coffee-payment,.developer-notes) { margin-top:0; }
.modal>.modal-back { position:absolute; z-index:20; top:12px; right:12px; left:auto; display:grid; place-items:center; width:var(--dialog-back-size); height:var(--dialog-back-size); padding:0; border:1px solid #ffffff3a; border-radius:50%; background:#131522e8; color:white; }
.modal-back:hover { background:#515267; }
.modal-back .icon { width:26px; height:26px; transform:rotate(180deg); }
[data-theme="light"] .modal { border-color:#c3b7c4; box-shadow:0 25px 100px #28152835; }
[data-theme="light"] .modal>.modal-back { background:#443446ed; color:white; }

.dialog-heading { flex-shrink:0; min-width:0; margin:0 0 20px; text-align:left; }
.dialog-heading .eyebrow { margin:0 0 8px; font-size:10px; line-height:1.5; }
.dialog-heading .dialog-title { display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin:0; padding:0; color:var(--ink); font-size:28px; font-weight:900; line-height:1.35; letter-spacing:-.8px; word-break:keep-all; white-space:pre-line; }
.dialog-title>.icon { width:26px; height:26px; flex-shrink:0; color:var(--accent); }
.dialog-title>small { font-size:14px; color:var(--muted); letter-spacing:0; }
.dialog-heading .dialog-description { margin:12px 0 0; padding:0; color:var(--muted); font-size:13px; font-weight:500; line-height:1.8; white-space:pre-line; word-break:keep-all; }
.dialog-heading-with-back { padding-right:36px; }
.dialog-heading-centered { padding-inline:0; text-align:center; }
.dialog-heading-centered .dialog-title { justify-content:center; }
.dialog-heading-centered.dialog-heading-with-back>.eyebrow { margin-inline:36px; min-height:calc(var(--dialog-back-size) + 12px - var(--dialog-padding)); }
.coffee-modal .dialog-heading .dialog-title { font-size:clamp(20px,5.4vw,28px); white-space:nowrap; }
.dialog-body .license-content { padding:0; }
.dialog-body .guide-chapter { margin-top:24px; padding-top:18px; border-top:1px solid var(--line); }
.guide-chapter>h3 { margin:0 0 12px; color:var(--ink); font-size:18px; }

/* The profile frame stays fixed when switching between profile and memories. */
.profile-modal.dialog-illustrated { display:grid; grid-template-columns:44% minmax(0,1fr); grid-template-rows:minmax(0,1fr); height:min(640px,var(--dialog-max-height)); min-height:0; overflow:hidden; }
.profile-art { position:relative; min-width:0; overflow:hidden; isolation:isolate; background:#faf7ef; }
.profile-art>.portrait-full { position:absolute; inset:0; width:100%; height:100%; min-width:0; transform:none; object-fit:cover; animation:portrait-arrive 1000ms var(--ui-motion-ease) both; }
.profile-art::after { content:''; position:absolute; inset:-20% -50%; pointer-events:none; background:linear-gradient(110deg,transparent 43%,#fff4e920 50%,transparent 57%); animation:portrait-light 1400ms 150ms ease-out both; }
.profile-content { display:flex; flex-direction:column; min-width:0; min-height:0; overflow:hidden; padding:24px; }
.profile-tabs { display:flex; flex-shrink:0; gap:18px; min-height:36px; border-bottom:1px solid var(--line); margin:0 var(--dialog-back-size) 12px 0; }
.profile-tabs button { display:inline-flex; align-items:center; gap:5px; position:relative; padding:0 0 10px; font-size:14px; font-weight:900; color:var(--muted); white-space:nowrap; }
.profile-tabs button>.icon { width:17px; height:17px; flex-shrink:0; }
.profile-tabs .active { color:var(--accent); }
.profile-tabs .active::after { content:''; position:absolute; bottom:-1px; left:0; right:0; height:3px; background:var(--accent); }
.profile-tabs span { font-size:10px; background:#ff8bae15; border-radius:5px; padding:2px 4px; }
.profile-panel { flex:1; min-height:0; overflow:auto; }
.profile-bio { margin:0 0 14px; padding:12px 14px; color:var(--ink); background:var(--surface-raised); border-left:3px solid var(--accent); border-radius:0 10px 10px 0; font-size:14px; font-weight:650; line-height:1.6; }
.profile-facts { margin:0; }
.profile-facts>div { display:flex; justify-content:space-between; gap:10px; padding:9px 0; border-bottom:1px solid var(--line); font-size:12px; }
.profile-facts dt { flex-shrink:0; color:var(--muted); font-weight:500; }
.profile-facts dd { margin:0; text-align:right; font-weight:700; }
.profile-panel>.profile-relation { margin:16px 0 8px; }
.profile-panel>.primary-btn { width:100%; margin-top:14px; min-height:44px; padding:10px 16px; font-size:16px; }
.profile-memories { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
.profile-memories .locked-memory { min-height:0; aspect-ratio:1.12; padding:10px 6px; gap:7px; }
.profile-memories .locked-memory .icon { width:18px; height:18px; }
.profile-memories .locked-memory strong { font-size:12px; }
.profile-memories .locked-memory span { font-size:9px; line-height:1.6; word-break:keep-all; }
.profile-memories .memory-card .memory-art { aspect-ratio:1.12; }
.profile-memories .memory-card>.memory-overlay { padding:9px; }
.profile-memories .memory-overlay small { display:none; }
.profile-memories .memory-card h3 { font-size:13px; }
.profile-memories .memory-card p { font-size:9px; line-height:1.4; }
.profile-memories .memory-card p .icon { width:12px; height:12px; flex-shrink:0; }

/* Result content determines the height; artwork fills its grid cell. */
.result-modal { padding:0; max-width:var(--dialog-small-width); }
.result-modal.dialog-illustrated { display:grid; grid-template-columns:44% minmax(0,1fr); grid-template-rows:minmax(0,1fr); height:auto; min-height:0; overflow:hidden; }
.result-portrait,.growth-result-art { position:relative; width:100%; height:100%; min-width:0; min-height:0; align-self:stretch; overflow:hidden; background:#faf7ef; }
.result-portrait>.portrait-full,.growth-result-art>img { position:absolute; inset:0; display:block; width:100%; height:100%; min-width:0; max-width:none; transform:none; object-fit:cover; }
.growth-result-art>img { object-position:center 25%; }
.result-content { display:flex; flex-direction:column; gap:11px; min-width:0; min-height:0; max-height:calc(var(--dialog-max-height) - 2px); padding:38px 28px 24px; overflow:hidden; }
.result-content>:not(.date-dialogue) { flex-shrink:0; }
.result-heading { margin:0; }
/* Common result UI: pink English kicker, name + age/job, separated expense footer. */
.result-heading>.eyebrow { color:var(--accent); }
.result-heading .dialog-description { margin-top:10px; font-size:12px; line-height:1.6; }
.result-content>h3 { display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin:0; font-size:21px; line-height:1.4; }
.result-content>h3 small { font-size:11px; font-weight:500; color:var(--muted); letter-spacing:0; }
.date-dialogue { flex:0 1 auto; min-height:0; max-height:calc(5.1em + 26px); margin:0; padding:12px 14px; border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:0 12px 12px 0; background:var(--surface-raised); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; font-size:16px; white-space:pre-line; overflow-wrap:anywhere; }
.date-dialogue p { margin:0; font-size:inherit; font-weight:700; line-height:1.7; word-break:keep-all; }
.relationship-panel { display:flex; flex-direction:column; justify-content:center; gap:9px; margin:0; padding:12px 14px; border:1px solid var(--line); border-radius:var(--dialog-item-radius); background:var(--surface-raised); }
.relationship-panel>span:not(.relationship-meter) { font-size:12px; font-weight:800; margin:0; }
.relationship-panel>.relationship-meter { margin:0; flex-shrink:0; }
.relationship-panel .relationship-track { height:10px; }
.result-change-title { display:flex; align-items:center; gap:7px; margin:0; font-size:13px; font-weight:800; line-height:1.5; color:var(--ink); }
.result-change-title .icon { width:17px; height:17px; }
.result-self-change { margin-top:8px; padding-top:20px; border-top:1px solid var(--line); }
.encounter-result .result-relationship + .result-self-change { border-top:0; }
.result-self-change>.result-change-title { margin-bottom:16px; }
.result-self-change>.result-change-title .icon { color:var(--muted); }
.result-expense { padding-top:10px; border-top:1px solid var(--line); }
.result-content .money-change { margin:0; padding:0; border:0; }
.result-content .money-change>small { width:100%; }
.result-content .unlock-notice { margin:0; font-size:11px; }
.memory-added-notice { min-width:0; border:1px solid color-mix(in srgb,var(--mint) 40%,var(--line)); border-radius:10px; background:color-mix(in srgb,var(--mint) 7%,var(--surface)); animation:result-item-in 520ms 350ms var(--ui-motion-ease) both; }
.memory-added-item { display:flex; align-items:center; gap:8px; width:100%; min-height:52px; padding:8px 10px; border:0; border-radius:9px; background:transparent; color:var(--mint); text-align:left; }
.memory-added-item:hover { background:color-mix(in srgb,var(--mint) 10%,transparent); }
.memory-added-item>img { width:42px; height:32px; object-fit:cover; border-radius:5px; flex:none; }
.memory-added-item>.icon { width:16px; height:16px; flex:none; }
.memory-added-item>span { display:flex; flex:1; min-width:0; flex-direction:column; gap:3px; }
.memory-added-item strong { font-size:12px; line-height:1.4; }
.memory-added-item small { font-size:10px; line-height:1.5; color:var(--muted); overflow-wrap:anywhere; }
.memory-added-notice.is-multiple { padding:8px; }
.memory-added-heading { display:flex; align-items:center; gap:6px; margin:0 0 6px; color:var(--mint); font-size:12px; line-height:1.4; font-weight:800; }
.memory-added-heading>.icon { width:15px; height:15px; }
.is-multiple .memory-added-items { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; }
.is-multiple .memory-added-item { min-height:44px; padding:6px 8px; border:1px solid color-mix(in srgb,var(--mint) 20%,var(--line)); }
.is-multiple .memory-added-item>img,.is-multiple .memory-added-item>.icon { display:none; }
.result-content .new-badge { flex-shrink:0; font-size:10px; letter-spacing:.4px; padding:5px 7px; }
.growth-result>.result-content { min-height:360px; justify-content:center; gap:20px; }
.growth-result .result-self-change { margin-top:0; padding-top:0; border-top:0; }
.modal.encounter-miss { --dialog-small-width:580px; display:block; width:min(var(--dialog-small-width),100%); }
.encounter-miss>.result-content { padding:40px 32px 28px; gap:26px; }
.encounter-miss .result-broken-heart { margin-bottom:18px; }
.encounter-miss .dialog-description { margin-top:16px; }
.encounter-miss .result-self-change { margin-top:0; padding-top:0; border-top:0; }
.encounter-miss .stat-change-meters { gap:24px clamp(24px,4vw,40px); }
.encounter-miss .result-expense { padding-top:18px; }

/* All entrances remain active, including when the OS requests reduced motion. */
.modal-backdrop.reveal-backdrop { padding:0; background:#11121c; backdrop-filter:none; }
.modal.huntreveal-modal { position:fixed; inset:0; width:100%; max-width:none; height:100dvh; max-height:none; padding:0; border:0; border-radius:0; overflow:hidden; background:#11121c; box-shadow:none; animation:none; }
.modal.revealed-result { animation:reveal-result 180ms ease-out both; transform:none; }
.modal.action-result { animation:none; transform:none; }
.is-action-revealing>.result-content { visibility:hidden; pointer-events:none; }
.action-revealed>.result-content { animation:action-result-in 180ms ease-out both; }
.encounter-found>.result-portrait>.portrait-full { animation:portrait-arrive 900ms var(--ui-motion-ease) both; }
.encounter-result .result-content>:not(.result-heading),.encounter-result .result-heading>* { animation:result-item-in 520ms var(--ui-motion-ease) both; animation-delay:var(--item-delay,0ms); }
.encounter-result .dialog-title { --item-delay:100ms; }
.encounter-result .dialog-description { --item-delay:180ms; }
.encounter-result .result-content>h3 { --item-delay:260ms; }
.encounter-result .date-dialogue { --item-delay:340ms; }
.encounter-result .result-relationship { --item-delay:440ms; }
.encounter-result .stat-change-meters,.encounter-result .result-self-change { --item-delay:480ms; }
.encounter-result .result-expense { --item-delay:700ms; }
.encounter-result .unlock-notice,.encounter-result .memory-added-notice { --item-delay:620ms; }
.encounter-result .relationship-meter.is-animated .relationship-fill { animation-delay:650ms; }
.encounter-result .relationship-meter.is-animated>.icon { animation-delay:750ms; }
.growth-result.action-revealed .result-heading>* { animation:result-item-in 450ms ease-out both; }
.growth-result.action-revealed .result-self-change { animation:result-item-in 500ms 180ms ease-out both; }
.growth-result.action-revealed .result-expense { animation:result-item-in 500ms 520ms ease-out both; }

/* Image viewers are intrinsically sized, independently of the shared dialog frame. */
html:has(.illustration-modal) { scrollbar-gutter:auto; }
.modal.illustration-modal { display:block; width:fit-content; max-width:100%; max-height:var(--dialog-max-height); padding:0; border:0; border-radius:12px; overflow:hidden; background:transparent; }
.modal.illustration-modal>img { display:block; width:auto; height:auto; min-width:0; min-height:0; max-width:calc(100vw - var(--dialog-gap) * 2); max-height:var(--dialog-max-height); aspect-ratio:auto; object-fit:contain; object-position:center; transform:none; }
.illustration-modal>.modal-back { background:#191923dd; color:white; border:1px solid #ffffff70; }
.modal-backdrop:has(.illustration-modal) { overflow:hidden; }
.illustration-modal { touch-action:pan-y pinch-zoom; }
.memory-viewer-navigation>button { position:absolute; top:50%; transform:translateY(-50%); display:grid; place-items:center; width:44px; height:48px; padding:0; border:1px solid #ffffff60; border-radius:12px; background:#191923cf; color:white; }
.memory-viewer-navigation>button:disabled { opacity:.3; }
.memory-viewer-navigation .memory-previous { left:10px; }
.memory-viewer-navigation .memory-next { right:10px; }
.memory-previous .icon { transform:rotate(180deg); }
.memory-position { position:absolute; left:50%; bottom:10px; transform:translateX(-50%); padding:5px 13px; border-radius:20px; background:#191923cf; color:white; font-size:12px; font-variant-numeric:tabular-nums; pointer-events:none; }
.modal.confess-modal.dialog-illustrated { display:grid; grid-template-columns:42% minmax(0,1fr); max-width:740px; padding:0; overflow:hidden; }
.confess-art { position:relative; min-width:0; overflow:hidden; background:var(--surface-raised); }
.confess-art>.portrait { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; animation:portrait-arrive 900ms ease-out both; }
.confess-content { display:flex; flex-direction:column; min-width:0; min-height:400px; max-height:var(--dialog-max-height); padding:38px 28px 28px; overflow:auto; }
.confess-content>.confirm-actions { flex-shrink:0; width:100%; margin-top:auto; padding-top:26px; }
.confess-content .primary-btn { width:100%; }
@media(max-width:800px) {
 :root { --dialog-gap:12px; --dialog-padding:24px; --dialog-content-gap:20px; }
 .modal { border-radius:17px; }
 .profile-modal.dialog-illustrated { grid-template-columns:minmax(0,1fr); grid-template-rows:29% minmax(0,1fr); height:var(--dialog-max-height); }
 .profile-memories { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .profile-memories .memory-card .memory-art,.profile-memories .locked-memory { aspect-ratio:1.15; }
 .profile-memories .memory-card h3,.profile-memories .locked-memory strong { font-size:13px; }
 .profile-memories .memory-card p { font-size:10px; line-height:1.45; }
 .result-modal.dialog-illustrated { --result-art-height:min(190px,23dvh); grid-template-columns:minmax(0,1fr); grid-template-rows:var(--result-art-height) minmax(0,1fr); }
 .result-modal.dialog-illustrated>.result-content { max-height:calc(var(--dialog-max-height) - var(--result-art-height) - 2px); padding:18px 20px; gap:10px; }
 .result-modal.dialog-illustrated .dialog-heading { padding-right:0; }
 .result-content>h3 { font-size:19px; }
 .date-dialogue { font-size:15px; }
 .growth-result>.result-content { min-height:240px; }
}
@media(max-width:600px) {
 .dialog-heading .dialog-title { font-size:24px; }
 .dialog-heading .dialog-description { font-size:12px; }
 .profile-content { padding:15px 18px; }
 .profile-tabs { margin-right:0; margin-bottom:10px; gap:12px; }
 .profile-tabs button { font-size:12px; gap:4px; }
 .profile-tabs button>.icon { width:14px; height:14px; }
 .profile-tabs span { font-size:9px; padding:2px 3px; }
 .profile-bio { padding:9px 11px; margin-bottom:10px; font-size:12px; }
 .profile-facts>div { padding:7px 0; font-size:11px; }
 .profile-panel>.profile-relation { margin:10px 0 0; }
 .profile-memories { gap:7px; }
 .encounter-miss>.result-content { padding:36px 24px 26px; gap:24px; }
 .modal.confess-modal.dialog-illustrated { grid-template-columns:minmax(0,1fr); }
 .confess-art { height:min(28dvh,190px); }
 .confess-content { min-height:0; max-height:calc(var(--dialog-max-height) - min(28dvh,190px)); padding:22px; }
 .confess-content .dialog-heading { padding-right:0; }
 .confess-content>.confirm-actions { padding-top:20px; }
}
@media(max-height:680px) { :root { --dialog-padding:24px; --dialog-content-gap:20px; } }
@media(max-height:650px) {
 .result-content { padding:18px 20px; gap:8px; }
 .result-heading>.eyebrow { display:block; margin-bottom:5px; font-size:9px; line-height:1.3; }
 .result-heading .dialog-title { font-size:22px; }
 .result-content>h3 { font-size:18px; }
 .date-dialogue { font-size:14px; max-height:calc(5.1em + 20px); padding:9px 12px; }
 .relationship-panel { padding:9px 12px; }
 .result-expense { padding-top:6px; }
 .encounter-miss>.result-content { padding:28px 24px 22px; gap:18px; }
 .encounter-miss .result-broken-heart { margin-bottom:12px; }
 .encounter-miss .stat-change-meters { row-gap:18px; }
 .encounter-miss .result-expense { padding-top:14px; }
 .result-self-change { margin-top:4px; padding-top:14px; }
 .result-self-change>.result-change-title { margin-bottom:12px; }
}
@media(max-width:800px) and (max-height:680px) {
 .profile-facts>div { padding-block:5px; }
 .profile-bio { margin-bottom:8px; }
 .profile-panel>.profile-relation { margin-top:8px; }
 .result-modal.dialog-illustrated { --result-art-height:min(110px,18dvh); }
 .growth-result>.result-content { min-height:200px; }
}
@media(max-width:800px) and (max-height:740px) {
 .result-modal.dialog-illustrated.encounter-result:has(.result-self-change) { --result-art-height:min(100px,14dvh); }
 .result-modal.dialog-illustrated.encounter-result:has(.result-self-change)>.result-content { gap:8px; padding-block:16px; }
 .result-self-change { margin-top:4px; padding-top:14px; }
 .result-self-change>.result-change-title { margin-bottom:12px; }
}
@media(max-width:360px) { .profile-modal.dialog-illustrated { grid-template-rows:18% minmax(0,1fr); } }


/* Source: summary-dialog.css */
/* SummaryDialog / SummaryRow: all three weekly recaps use this layout. */
.modal.dialog-summary { width:min(var(--dialog-list-width),100%); max-width:var(--dialog-list-width); height:auto; min-height:0; max-height:var(--dialog-max-height); padding:0; overflow:hidden; }
.summary-dialog { display:flex; flex-direction:column; min-height:0; max-height:var(--dialog-max-height); padding:var(--dialog-padding); gap:16px; }
.summary-header { flex:none; margin:0; }
.summary-body { flex:0 1 auto; min-height:0; padding-bottom:10px; margin-bottom:-10px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.summary-results { display:grid; gap:8px; list-style:none; padding:0; margin:0; }
.summary-results:empty { display:none; }
.summary-row { display:grid; grid-template-columns:56px minmax(0,1fr); align-items:center; gap:12px; padding:8px 10px; border:1px solid var(--line); border-radius:var(--dialog-item-radius); background:var(--surface-raised); }
.summary-art { display:grid; place-items:center; height:68px; overflow:hidden; border-radius:8px; background:var(--surface); }
.summary-art>.portrait,.summary-art>img { display:block; width:100%; height:100%; object-fit:cover; object-position:center top; }
.summary-art>.glass-heart { width:78%; height:78%; }
.summary-copy { min-width:0; }
.summary-copy h3 { display:flex; flex-wrap:wrap; align-items:center; gap:5px 8px; margin:0 0 3px; font-size:17px; line-height:1.35; }
.summary-copy h3 small { font-size:10px; color:var(--muted); font-weight:600; letter-spacing:0; }
.summary-outcome { margin:0; color:var(--muted); font-size:11px; line-height:1.5; }
.summary-unlocked { color:var(--mint); }
.summary-copy .relationship-meter { max-width:none; width:100%; margin-top:6px; }
.summary-copy .charm-change { margin:4px 0 0; font-size:12px; }
.summary-relationship-loss { display:block; margin-top:4px; color:var(--accent); font-size:11px; }
.summary-gains { display:flex; align-items:center; gap:5px; margin-top:6px; color:var(--mint); font-size:13px; font-weight:800; }
.summary-gains .icon { width:16px; height:16px; }
.summary-empty { padding:12px 0; margin:0; color:var(--muted); font-size:12px; line-height:1.7; }
.summary-footer { flex:none; }
.summary-advance { position:relative; isolation:isolate; width:100%; min-height:62px; margin:0; padding:13px 16px; overflow:hidden; background:var(--surface-raised); color:var(--ink); box-shadow:none; border:1px solid var(--accent); }
.summary-advance:not(:disabled):hover { transform:none; background:var(--surface-raised); box-shadow:none; }
.summary-progress-fill { position:absolute; inset:0; z-index:-1; background:var(--accent); opacity:.28; transform:scaleX(0); transform-origin:left; }
.summary-advance-label { display:flex; flex-direction:column; gap:4px; align-items:flex-start; font-size:17px; }
.summary-advance-label small { font-size:10px; color:var(--muted); font-weight:600; }
[data-theme="light"] .summary-advance,[data-theme="light"] .summary-advance:not(:disabled):hover { color:var(--ink); box-shadow:none; }
.summary-enter { animation:result-item-in 480ms cubic-bezier(.2,.65,.3,1) both; animation-delay:var(--row-delay,120ms); }
.summary-enter .relationship-meter.is-animated .relationship-fill { animation-delay:calc(var(--row-delay,120ms) + 250ms); }
.summary-enter .relationship-meter.is-animated>.icon { animation-delay:calc(var(--row-delay,120ms) + 350ms); }
@media(max-width:600px) {
 .summary-dialog { gap:12px; }
 .summary-row { grid-template-columns:48px minmax(0,1fr); gap:10px; padding:8px; }
 .summary-art { height:62px; }
 .summary-copy h3 { font-size:16px; }
 .summary-gains { font-size:12px; }
 .summary-advance-label { font-size:16px; }
}
@media(max-height:680px) {
 .summary-dialog { gap:10px; }
 .summary-header>.eyebrow { display:none; }
 .summary-header .dialog-title { font-size:22px; }
 .summary-header .dialog-description { margin-top:6px; font-size:11px; }
 .summary-row { padding:6px 8px; }
 .summary-art { height:58px; }
 .summary-copy h3 { font-size:15px; }
 .summary-advance { min-height:56px; padding:10px 14px; }
}



/* Source: ready-relationships.css */
/* ReadyRelationships owns the group; card content belongs to RelationshipCard. */
.ready-relationships { margin-top:18px; padding-top:16px; border-top:1px solid var(--line); }
.ready-relationships>h3 { display:flex; align-items:center; gap:8px; margin:0 0 12px; font-size:17px; }
.ready-relationships>h3 .icon { width:18px; height:18px; color:var(--accent); }
.ready-items { display:grid; gap:12px; }
.ready-cards .ready-items { grid-template-columns:repeat(2,minmax(0,1fr)); }
.ready-compact .ready-items { display:flex; flex-wrap:wrap; gap:8px; }
.ready-link { display:flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--surface-raised); color:var(--ink); border-radius:8px; padding:9px 12px; font-size:12px; }
.ready-link:hover { border-color:var(--accent); }
.ready-link .icon { width:15px; height:15px; }
@media(max-width:820px) { .ready-cards .ready-items { grid-template-columns:1fr; } }


/* Source: sharing.css */

.share-platforms { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; margin-top: 26px; }
.share-platform { display: flex; justify-content: center; align-items: center; min-width: 0; padding: 6px 0; text-decoration: none; color: var(--ink); }
.share-platform-symbol { display: grid; place-items: center; width: 54px; height: 54px; border-radius: 18px; color: white; transition: transform 200ms ease, box-shadow 200ms ease; }
.share-platform:hover:not(:disabled) .share-platform-symbol { transform: translateY(-3px); box-shadow: 0 6px 14px #0002; }
.share-brand-icon { width: 27px; height: 27px; }
.brand-x, .brand-tiktok { background: #17171c; }
.brand-x { border: 1px solid #ffffff24; }
.brand-instagram { background: linear-gradient(35deg, #fdbb5b, #e74373 48%, #8d40bd); }
.brand-facebook { background: #1877f2; }
.brand-tiktok .share-brand-icon { filter: drop-shadow(-1px -1px 0 #25f4ee) drop-shadow(1px 1px 0 #fe2c55); }
.share-feedback { display: grid; gap: 12px; margin-top: 12px; }
.share-status { min-height: 21px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.share-status.is-copied { color: var(--mint); }
.share-open-platform { display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 44px; padding: 10px; background: var(--surface-raised); border: 1px solid var(--line); border-radius: 10px; text-decoration: none; font-size: 14px; }
.share-open-platform:hover { border-color: var(--accent); }
.share-open-platform .icon { width: 18px; height: 18px; }
@media (max-width: 380px) {
  .share-platforms { gap: 4px; }
  .share-platform-symbol { width: 48px; height: 48px; border-radius: 15px; }
}


/* Source: clipboard-field.css */
/* ClipboardField: one selectable value, stable success state, manual-copy fallback. */
.clipboard-field { margin:20px 0; }
.clipboard-row { display:flex; align-items:center; gap:8px; padding:6px; background:var(--surface-raised); border:1px solid var(--line); border-radius:var(--dialog-item-radius); }
.clipboard-row input { flex:1; width:0; min-width:0; min-height:44px; padding:10px; border:0; background:transparent; color:var(--ink); font-size:14px; }
.clipboard-row input:focus { outline:none; box-shadow:none; }
.clipboard-copy { display:grid; place-items:center; flex:0 0 44px; width:44px; height:44px; padding:0; border:0; border-radius:9px; background:var(--accent); color:#281824; transition:background-color 180ms ease; }
.clipboard-copy:hover:not(:disabled) { background:var(--accent-light); }
.clipboard-copy.is-copied,.clipboard-copy.is-copied:hover { background:var(--mint); color:var(--bg); }
.clipboard-copy .icon { width:20px; height:20px; }
.clipboard-error { margin:8px 0 0; font-size:12px; line-height:1.6; color:var(--muted); }
@media(max-width:380px) {
 .clipboard-row { gap:2px; padding:4px; }
 .clipboard-row input { padding:6px; font-size:12px; }
}


/* Source: intro.css */
/* Local Nanum Myeongjo-derived webfont: keep every device on the same serif face. */
@font-face{font-family:'Love Weekly Story';src:url('assets/fonts/love-weekly-story-regular.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
html:has(.story-intro){scrollbar-gutter:auto;overflow:hidden}
.story-intro{position:fixed;inset:0;isolation:isolate;overflow:hidden;background:#14141f;color:#fff5e8;animation:intro-arrive 1.2s ease both}
.intro-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% center;z-index:-3;animation:intro-camera 32s ease-out both}
.intro-shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#10121dd9 0%,#15152287 42%,#14121b15 78%),linear-gradient(0deg,#12131fea,transparent 74%)}
.intro-header{position:absolute;top:clamp(28px,5vh,64px);left:clamp(24px,6vw,120px);display:flex;align-items:center;gap:22px;color:#ebc1c5;font-size:12px;font-weight:650;letter-spacing:.24em}
.intro-chapter{border-left:1px solid #e7bdc357;padding-left:22px;font-size:10px;color:#d8d0d0}
.intro-sound{position:absolute;right:clamp(20px,4vw,64px);top:28px;z-index:5;--ink:#fff5e8;--muted:#d2c3d1;--surface:#292535;--surface-raised:#383041;--line:#ffffff24}
.intro-story{position:absolute;left:clamp(24px,7vw,140px);right:24px;bottom:clamp(132px,20vh,230px);max-width:740px;pointer-events:none}
.intro-rule{display:block;width:38px;height:2px;margin-bottom:28px;background:#e5b3b8;box-shadow:0 0 16px #e7a3b25c}
.intro-paragraph{margin:0;min-height:8em;font-family:'Love Weekly Story','Nanum Myeongjo','Batang',serif;font-size:clamp(18px,1.55vw,25px);font-weight:400;font-synthesis:none;line-height:2;letter-spacing:.015em;white-space:pre-line;word-break:keep-all;overflow-wrap:anywhere;text-shadow:0 2px 16px #090b15}
.intro-word{display:inline-block;white-space:nowrap}
.intro-letter{position:relative;display:inline-block;white-space:pre}
.intro-footer{position:absolute;left:clamp(24px,7vw,140px);right:clamp(24px,7vw,140px);bottom:clamp(32px,6vh,64px);display:flex;align-items:center;gap:16px;color:#ead8d3;pointer-events:none}
.intro-dots{display:flex;gap:8px;margin-right:auto;align-items:center}
.intro-dots i{display:block;width:5px;height:5px;border-radius:50%;background:#ebd5d140;transition:width .4s,background .4s}
.intro-dots i.is-done{background:#e6b9be}.intro-dots i.is-current{width:22px;border-radius:8px;background:#f0b7c0;box-shadow:0 0 12px #f0b7c052}
.intro-hint{font-size:12px;letter-spacing:.04em}.intro-next{display:grid;place-items:center;width:32px;height:32px;border:1px solid #f1d6da42;border-radius:50%;opacity:.5;transition:opacity .4s}
.intro-next .icon{width:15px;height:15px}.is-ready .intro-next{opacity:1;animation:intro-cue 2s ease-in-out infinite}
.intro-hit-area{position:absolute;inset:0;z-index:3;width:100%;height:100%;padding:0;border:0;border-radius:0;background:transparent;cursor:pointer;touch-action:manipulation}
.intro-hit-area:disabled{cursor:default}.intro-hit-area:focus{outline:none}
.is-leaving .intro-hint,.is-leaving .intro-next{opacity:0;transition:opacity .25s}
.intro-dust{position:absolute;inset:0;pointer-events:none;z-index:4}.intro-dust>i{position:absolute;width:3px;height:3px;border-radius:50%;background:#f2d3bc;box-shadow:0 0 6px #f8dbc878}
.intro-ambience{position:absolute;inset:0;z-index:-1;pointer-events:none}.intro-ambience>i{position:absolute;left:calc(9% + var(--mote)*7%);top:calc(18% + mod(var(--mote),5)*13%);width:2px;height:2px;border-radius:50%;background:#ffe1bd;opacity:0;animation:intro-mote 7s calc(var(--mote)*-.7s) ease-in-out infinite}
@keyframes intro-arrive{from{opacity:0}to{opacity:1}}@keyframes intro-camera{from{transform:scale(1.045)}to{transform:scale(1)}}
/* A shared closing signature for the prologue and both epilogues. */
.story-title-finale{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:clamp(22px,4vh,42px);padding:70px 24px;pointer-events:none;visibility:hidden;opacity:0;background:linear-gradient(180deg,#171622de,#211923eb 55%,#171622f5)}
.story-title-logo{display:block;width:min(680px,86vw);height:auto;max-height:48dvh;object-fit:contain;opacity:0;filter:drop-shadow(0 8px 35px #e8a0b922)}
.story-title-glow{position:absolute;inset:10%;z-index:-1;background:radial-gradient(ellipse at center,#ce78962b,transparent 65%);opacity:0}
.story-title-chapter{font-size:10px;letter-spacing:.42em;color:#e1bdc4;opacity:0}
.story-title-finale{background:#171622}
.story-sad-epilogue .story-title-finale{background:linear-gradient(180deg,#141d2b,#211e2b 55%,#171822)}
.is-title-finale .story-title-finale{visibility:visible}
.is-title-finale .intro-header,.is-title-finale .intro-story,.is-title-finale .intro-footer{opacity:0;transition:opacity .65s ease}
/* Retire the illustration beneath the title. Its fade must not reveal the old
   room again while the next scene's full-screen curtain is being mounted. */
.story-intro.is-title-finale .intro-background,.story-intro.is-title-finale .epilogue-art,.story-intro.is-title-finale .intro-ambience{opacity:0;transition:opacity .8s ease}
.story-intro.is-title-finale .intro-sound{opacity:0;pointer-events:none;transition:opacity .65s ease}
/* Keep a plain backdrop during the final fade into the next page. */
.story-intro.is-title-finale .intro-shade{background:#171622ed;transition:background .8s ease}
.story-intro.story-sad-epilogue.is-title-finale .intro-shade{background:#171c29ed}
.story-intro.story-sad-epilogue.is-title-finale .sad-epilogue-light{opacity:0}
@keyframes intro-cue{50%{transform:translateX(4px)}}@keyframes intro-mote{50%{opacity:.35;transform:translate(14px,-22px)}}
@media(max-width:700px){.intro-background{object-position:77% center}.intro-shade{background:linear-gradient(0deg,#10121ff5 5%,#141522b8 48%,#14152218 86%)}.intro-header{top:28px;font-size:10px;gap:14px}.intro-chapter{padding-left:14px;font-size:9px}.intro-story{bottom:130px;max-width:none;left:26px;right:26px}.intro-paragraph{font-size:18px;line-height:1.95;min-height:13.65em}.intro-rule{margin-bottom:20px}.intro-footer{left:26px;right:26px;bottom:34px;gap:10px}.intro-hint{font-size:11px}.intro-next{width:28px;height:28px}}
@media(max-height:580px){.intro-story{bottom:85px;max-width:720px}.intro-paragraph{font-size:16px;line-height:1.75;min-height:7em}.intro-rule{margin-bottom:14px}.intro-footer{bottom:22px}.intro-header{top:20px}.intro-sound{top:14px}}

/* A quiet return to the opening room; the last paragraph lets a little warmth back in. */
.story-sad-epilogue .intro-background{filter:saturate(.52) brightness(.78);animation:sad-epilogue-camera 42s ease-out both;transition:filter 2.8s ease}
.story-sad-epilogue .intro-shade{background:linear-gradient(90deg,#101824df,#111a2980 48%,#17223418 82%),linear-gradient(0deg,#101725e8,transparent 80%)}
.story-sad-epilogue .intro-paragraph{min-height:6em;color:#eef0f7}
.story-sad-epilogue .intro-header{color:#c4d0e6}
.story-sad-epilogue .intro-rule{background:#b5c9e7;box-shadow:0 0 16px #bed3ec40;transition:background 2s,box-shadow 2s}
.story-sad-epilogue .intro-ambience>i{background:#c7d6ed}
.sad-epilogue-light{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 73% 37%,#f4c29742,transparent 65%);opacity:0;transition:opacity 3s ease}
.story-sad-epilogue.is-hopeful .intro-background{filter:saturate(.86) brightness(.94)}
.story-sad-epilogue.is-hopeful .sad-epilogue-light{opacity:1}
.story-sad-epilogue.is-hopeful .intro-rule{background:#e5c2ab;box-shadow:0 0 18px #f1cba25c}
@keyframes sad-epilogue-camera{from{transform:scale(1.08)}to{transform:scale(1)}}
@media(max-width:700px){
  .story-sad-epilogue .intro-shade{background:linear-gradient(0deg,#111a2bf5 5%,#141c2cb8 53%,#141c2c20 90%)}
  .story-sad-epilogue .intro-paragraph{min-height:9.75em;font-size:clamp(16px,4.4vw,18px);line-height:1.95}
}
@media(max-height:580px){.story-sad-epilogue .intro-paragraph{font-size:15px;line-height:1.8;min-height:7.2em}}

/* The epilogue uses the same reading rhythm, with the illustration beside the story. */
.story-epilogue{background:#221a24}
.story-epilogue .intro-background{filter:blur(38px);opacity:.24;transform:scale(1.12);animation:none;object-position:center;transition:opacity .8s}
.story-epilogue .intro-shade{background:linear-gradient(90deg,#211921f5 0%,#211921d9 33%,#21192138 72%),linear-gradient(0deg,#211921ed,transparent 50%,#21192196)}
.epilogue-art{position:absolute;right:4vw;top:16vh;bottom:16vh;width:60vw;margin:0;display:flex;align-items:center;justify-content:center;z-index:-1;opacity:0;transform:translateY(12px) scale(.98);transition:opacity 1.2s ease,transform 1.8s cubic-bezier(.16,.8,.25,1)}
.is-illustrated .epilogue-art{opacity:1;transform:none}
.epilogue-picture{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 16px 40px #100a1866)}
.story-epilogue .intro-story{left:6vw;right:auto;top:50%;bottom:auto;transform:translateY(-43%);width:28vw;max-width:540px}
.epilogue-scene-heading{animation:epilogue-heading 1.1s ease both}
.epilogue-dedication{display:block;color:#e4b7bf;font-size:clamp(11px,.85vw,14px);letter-spacing:.06em;margin-bottom:14px}
.epilogue-scene-heading h1{font-family:'Love Weekly Story','Nanum Myeongjo','Batang',serif;font-size:clamp(25px,2.25vw,40px);font-weight:400;font-synthesis:none;line-height:1.5;letter-spacing:-.03em;margin:0 0 24px;word-break:keep-all}
.story-epilogue .intro-rule{width:42px;margin-bottom:24px;background:#e9c4a7}
.story-epilogue .intro-paragraph{font-size:clamp(16px,1.22vw,21px);line-height:2;min-height:10em;color:#efe4e3}
.story-epilogue .intro-ambience{z-index:0}
.story-epilogue .intro-header{color:#edc7b5}
.story-epilogue .intro-footer{left:6vw;right:4vw}
.story-epilogue.is-leaving .epilogue-art{opacity:0;transform:translateY(-6px) scale(1.01);transition:opacity .75s ease,transform 1s ease}
.story-epilogue.is-leaving .epilogue-scene-heading{opacity:0;transition:opacity .6s}
.story-preload{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
@keyframes epilogue-heading{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@media(max-width:700px){
  .story-epilogue{display:grid;grid-template-rows:70px minmax(0,1fr) auto 76px}
  .story-epilogue .intro-shade{background:linear-gradient(0deg,#211921f5 0%,#211921de 40%,#21192144 85%)}
  .epilogue-art{position:relative;grid-row:2;inset:auto;align-self:stretch;width:auto;min-height:0;margin:0 16px}
  .story-epilogue .intro-story{position:relative;grid-row:3;inset:auto;transform:none;width:auto;max-width:none;margin:20px 26px 0}
  .story-epilogue .intro-paragraph{font-size:clamp(14px,4vw,17px);line-height:1.85;min-height:8em}
  .epilogue-dedication{font-size:11px;margin-bottom:7px}
  .epilogue-scene-heading h1{font-size:25px;margin-bottom:14px}
  .story-epilogue .intro-rule{margin-bottom:15px;width:30px}
  .story-epilogue .intro-footer{left:26px;right:26px;bottom:24px}
  .story-epilogue .intro-hint{font-size:10px}
}
@media(max-height:580px) and (min-width:701px){
  .story-epilogue .intro-story{width:38vw;top:52%}
  .story-epilogue .intro-paragraph{font-size:14px;line-height:1.8;min-height:7em}
  .epilogue-scene-heading h1{font-size:24px;margin-bottom:10px}
  .epilogue-dedication{margin-bottom:6px}.story-epilogue .intro-rule{margin-bottom:12px}
  .epilogue-art{width:50vw;top:16vh;bottom:17vh}
}
@media(max-height:580px) and (max-width:700px){
  .story-epilogue{grid-template-rows:58px minmax(0,1fr) auto 64px}
  .story-epilogue .intro-story{margin:12px 22px 0}
  .story-epilogue .intro-paragraph{font-size:14px;line-height:1.8;min-height:7.2em}
  .epilogue-scene-heading h1{font-size:22px;margin-bottom:10px}
  .story-epilogue .intro-rule{margin-bottom:12px}
  .story-epilogue .intro-footer{left:22px;right:22px;bottom:18px}
}


/* Source: staff-roll.css */
html:has(.staff-roll){overflow:hidden;scrollbar-gutter:auto}
.staff-roll{position:fixed;inset:0;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 50% 25%,#504148,#1b1722 75%);color:#fff5ed;}
.staff-roll-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;opacity:0;}
.staff-roll-shade{position:absolute;inset:0;background:#17121ed9;opacity:0;}
.staff-roll h1{position:absolute;top:6%;left:0;right:0;margin:0;text-align:center;font:400 clamp(20px,2.4vw,32px)/1.5 Georgia,serif;letter-spacing:.16em;text-shadow:0 2px 12px #211323;opacity:0;}
.staff-roll-copy{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:90px 10%;opacity:0;pointer-events:none;}
.staff-roll-copy p{max-width:760px;margin:0;text-align:center;word-break:keep-all;overflow-wrap:anywhere;font:400 clamp(17px,1.75vw,26px)/2 'Love Weekly Story','Batang',serif;font-synthesis:none;text-shadow:0 2px 18px #17111f;}
.staff-roll footer{position:absolute;right:6%;bottom:max(6%,env(safe-area-inset-bottom));display:flex;align-items:center;gap:12px;font-size:12px;color:#f3e6e4d9;opacity:0;transition:opacity .6s;pointer-events:none;}
.staff-roll footer .icon{width:17px;height:17px;animation:intro-cue 2s ease-in-out infinite;}
.staff-roll-advance{position:absolute;inset:0;width:100%;height:100%;border:0;background:transparent;border-radius:0;padding:0;cursor:pointer;touch-action:manipulation;}
.staff-roll-advance:disabled{cursor:default;}
.staff-roll.is-ready footer{opacity:1;}
.staff-roll.is-ready .staff-roll-art,.staff-roll.is-ready .staff-roll-shade,.staff-roll.is-ready h1,.staff-roll.is-ready .staff-roll-copy{opacity:1;}
@media(max-width:700px){
 .staff-roll h1{top:5.5%;font-size:23px;}
 .staff-roll-art{inset:14dvh 0 auto;width:100%;height:auto;aspect-ratio:1672/941;}
 .staff-roll-shade{background:linear-gradient(#17121e18 10%,#17121e20 45%,#17121eaa 72%);}
 .staff-roll-copy{inset:calc(14dvh + 56.28vw + 24px) 0 auto;display:block;padding:0 8%;}
 .staff-roll-copy p{font-size:clamp(15px,4.3vw,18px);line-height:1.9;}
 .staff-roll footer{bottom:max(26px,env(safe-area-inset-bottom));font-size:11px;}
}
@media(max-height:520px) and (orientation:landscape){
 .staff-roll h1{font-size:20px;top:5%;}
 .staff-roll-art{inset:0;width:100%;height:100%;aspect-ratio:auto;}
 .staff-roll-shade{background:#17121ed9;}
 .staff-roll-copy{inset:0;display:flex;padding:65px 10%;}
 .staff-roll-copy p{font-size:17px;max-width:600px;line-height:1.8;}
 .staff-roll footer{bottom:max(6%,env(safe-area-inset-bottom));}
}


/* Source: special-events.css */
.stage.event-stage{display:flex;justify-content:center;padding:20px 24px 24px;min-height:0}
.special-event{width:100%;display:flex;flex-direction:column;align-items:center;gap:20px}
.event-heading{text-align:center;animation:event-arrive .65s both}
.event-heading .eyebrow{font-size:10px;letter-spacing:.2em;color:var(--accent)}
.event-heading h1{font-size:30px;line-height:1.3;margin:7px 0 8px;letter-spacing:-.04em}
.event-heading p{font-size:13px;line-height:1.6;color:var(--muted);margin:0;word-break:keep-all}
.event-phone{position:relative;isolation:isolate;display:flex;flex-direction:column;width:min(450px,100%);height:clamp(420px,calc(100dvh - 245px),620px);padding:14px 20px 10px;border:1px solid var(--line);border-radius:34px;background:var(--surface);box-shadow:0 22px 70px #0002,inset 0 0 0 5px color-mix(in srgb,var(--ink) 3%,transparent);animation:event-arrive .75s .12s both}
.event-camera{flex:none;width:60px;height:5px;margin:0 auto 12px;border-radius:9px;background:color-mix(in srgb,var(--ink) 22%,transparent)}
.event-phone-header{display:flex;align-items:center;justify-content:space-between;padding:0 3px 11px;font-size:13px;flex:none;line-height:1.4}
.event-phone-header .icon{width:19px;height:19px;color:var(--muted)}
.event-card{position:relative;flex:0 1 auto;min-height:96px;height:clamp(150px,26dvh,230px);border-radius:18px;overflow:hidden;background:var(--surface-raised)}
.event-card .portrait{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center top;transform-origin:center top}
.event-card::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#171326b8);pointer-events:none}
.event-card-copy{position:absolute;z-index:1;bottom:15px;left:17px;color:#fff;text-shadow:0 2px 8px #0005}
.event-card-copy h2{font-size:23px;line-height:1.2;margin:0 0 6px;letter-spacing:-.04em}
.event-card-copy p{font-size:12px;line-height:1.4;margin:0;color:#fffd}
/* Reserve room for the full conversation; bubble animations must not create an inner scrollbar. */
.event-chat{flex:1 0 auto;min-height:min-content;display:flex;flex-direction:column;justify-content:flex-start;gap:14px;padding:16px 2px;overflow:visible}
.event-prompt{display:flex;flex-direction:column;align-items:center;text-align:center;gap:7px;margin-block:auto}
.event-message-emblem{position:relative;display:block;margin-bottom:4px;color:var(--accent)}
.event-message-emblem>.icon:first-child{width:32px;height:32px}
.event-message-emblem>.icon:last-child{position:absolute;width:15px;height:15px;right:-7px;bottom:0;fill:var(--accent);stroke:var(--surface);stroke-width:1.5}
.event-prompt strong{font-size:14px;line-height:1.5;letter-spacing:-.02em}
.event-prompt p{margin:0;color:var(--muted);font-size:12px;line-height:1.5}
.event-message{display:flex;align-items:flex-end;gap:7px;max-width:94%;flex:none;animation:event-bubble .4s both}
.event-message p{margin:0;padding:11px 13px;border-radius:16px;font-size:13px;line-height:1.6;word-break:keep-all;overflow-wrap:anywhere}
.event-message-mine{align-self:flex-end}
.event-message-mine p{background:color-mix(in srgb,var(--accent) 22%,var(--surface));border-bottom-right-radius:5px;color:var(--ink)}
.event-message-reply{align-self:flex-start}
.event-message-reply p{background:var(--surface-raised);border:1px solid var(--line);border-bottom-left-radius:5px}
.event-unread{color:var(--accent);font-size:10px;margin-bottom:4px;transition:opacity .5s}
.event-unread.is-read{opacity:0}
.event-typing{display:flex;gap:4px;align-self:flex-start;padding:12px 15px;border-radius:14px;background:var(--surface-raised);border:1px solid var(--line)}
.event-typing i{width:5px;height:5px;border-radius:50%;background:var(--muted);animation:event-dot .9s infinite}
.event-typing i:nth-child(2){animation-delay:.15s}.event-typing i:nth-child(3){animation-delay:.3s}
.event-no-reply{flex:1;display:flex;align-items:center;justify-content:center;min-height:34px;margin:0;text-align:center;font-size:12px;line-height:1.6;color:var(--muted);animation:event-arrive .65s both}
.event-compose{flex:none;padding-top:10px;border-top:1px solid var(--line)}
.event-choices{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.event-choices button,.event-continue{display:flex;align-items:center;justify-content:center;gap:6px;min-width:0;min-height:48px;padding:10px 7px;border:1px solid var(--line);border-radius:14px;font-size:12px;font-weight:700;letter-spacing:-.035em;line-height:1.5;white-space:nowrap;transition:background .2s,transform .2s}
.event-choices .event-send{background:var(--accent);border-color:var(--accent);color:#fff}
.event-choices .event-skip,.event-continue{background:var(--surface-raised);color:var(--ink)}
.event-choices .icon,.event-continue .icon{width:16px;height:16px;flex:none}
.event-choices button:not(:disabled):hover,.event-continue:not(:disabled):hover{transform:translateY(-2px);filter:brightness(1.05)}
.event-continue{width:100%;animation:event-arrive .45s both}
.event-status{display:flex;align-items:center;justify-content:center;min-height:48px;margin:0;font-size:12px;color:var(--muted)}
.event-home{width:82px;height:4px;border-radius:8px;background:color-mix(in srgb,var(--ink) 18%,transparent);margin:12px auto 0;flex:none}
.event-hearts{position:absolute;inset:0;pointer-events:none;overflow:hidden;border-radius:inherit}
.event-hearts>span{position:absolute;bottom:25%;left:calc(12% + var(--i)*12%);color:var(--accent);opacity:0;animation:event-heart 2s calc(var(--i)*.12s) both}
.event-hearts .icon{width:20px;height:20px;fill:currentColor}
.event-phone.is-success{border-color:color-mix(in srgb,var(--accent) 45%,var(--line))}
@keyframes event-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes event-bubble{from{opacity:0;transform:translateY(8px) scale(.96)}to{opacity:1;transform:none}}
@keyframes event-dot{0%,70%,100%{transform:none;opacity:.45}35%{transform:translateY(-3px);opacity:1}}
@keyframes event-heart{0%{opacity:0;transform:translateY(0) scale(.6)}20%{opacity:.75}100%{opacity:0;transform:translateY(-150px) rotate(18deg) scale(1.1)}}
.event-opening{position:fixed;inset:0;z-index:11000;display:grid;place-items:center;background:#101018;color:#fff;pointer-events:all}
.event-opening-content{display:flex;flex-direction:column;align-items:center;gap:17px;text-align:center;padding:24px;opacity:0}
.event-opening.is-playing .event-opening-content{animation:event-opening-title 2050ms both}
.event-opening-symbol{position:relative;display:grid;place-items:center;width:84px;height:84px;border-radius:28px;color:#ff91b2;background:linear-gradient(145deg,#ff91b225,#ff91b208);border:1px solid #ff91b22c;box-shadow:0 0 60px #ff91b215}
.event-opening-symbol>.icon{width:36px;height:36px;filter:drop-shadow(0 0 8px #ff91b24d)}
.event-opening-symbol::after{content:"";position:absolute;inset:-9px;border:1px solid #ff91b250;border-radius:35px;opacity:0}
.event-opening.is-playing .event-opening-symbol::after{animation:event-opening-ring 1500ms .2s both}
.event-opening-kicker{font-size:9px;letter-spacing:.24em;color:#ff91b2;margin-top:5px}
.event-opening h2{font-size:clamp(23px,4vw,32px);line-height:1.35;letter-spacing:-.035em;margin:0;word-break:keep-all}
@keyframes event-opening-title{0%{opacity:0;transform:translateY(12px) scale(.97)}22%,73%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-8px)}}
@keyframes event-opening-ring{0%{opacity:0;transform:scale(.9)}25%{opacity:.65}100%{opacity:0;transform:scale(1.5)}}
@media(max-width:600px){
 .stage.event-stage{padding:16px 16px 18px}.special-event{gap:15px}
 .event-heading h1{font-size:25px;margin:5px 0 7px}.event-heading .eyebrow{font-size:9px}
 .event-heading p{font-size:11px;max-width:300px}
 .event-phone{height:clamp(350px,calc(100dvh - 260px),570px);padding:12px 16px 10px;border-radius:29px}
 .event-card{height:clamp(115px,23dvh,200px);border-radius:15px}
 .event-card-copy{bottom:12px;left:14px}.event-card-copy h2{font-size:21px;margin-bottom:4px}
 .event-card-copy p{font-size:11px}.event-chat{padding:12px 0;gap:12px}
 .event-message p{font-size:12px;padding:9px 11px}.event-prompt strong{font-size:13px}
 .event-choices button{font-size:11px;gap:4px}.event-choices .icon{width:14px;height:14px}
}
@media(max-height:760px){
 .stage.event-stage{padding-top:12px;padding-bottom:12px}.special-event{gap:10px}
 .event-heading h1{font-size:23px;margin:3px 0 5px}.event-phone{padding-top:10px}
 .event-camera{margin-bottom:8px}.event-phone-header{padding-bottom:8px}
 .event-card{height:clamp(110px,20dvh,150px)}.event-chat{gap:10px;padding:10px 0}
 .event-compose{padding-top:8px}.event-home{margin-top:9px}.event-prompt{gap:5px}
 .event-status{min-height:32px}
 .event-message-emblem{margin-bottom:0}.event-message-emblem>.icon:first-child{width:26px;height:26px}
}
@media(max-width:359px){.event-choices .icon{display:none}.event-choices button{font-size:10.5px}.event-phone{padding-right:12px;padding-left:12px}}


/* Source: playlist-event.css */
/* Shares the event heading, phone, heroine card, bubbles and result modal with the message event. */
.playlist-body{flex:none;display:flex;flex-direction:column;gap:13px;padding-top:16px}
.playlist-prompt{text-align:center}
.playlist-prompt strong{display:block;font-size:14px;line-height:1.5;letter-spacing:-.035em}
.playlist-prompt p{margin:4px 0 0;color:var(--muted);font-size:11px;line-height:1.4}
.playlist-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.playlist-choice{display:flex;flex-direction:column;gap:0;text-align:left;min-width:0;padding:0;border:1px solid var(--line);border-radius:15px;overflow:hidden;background:var(--surface-raised);color:var(--ink);cursor:pointer;transition:transform .25s,box-shadow .25s,border-color .25s}
.playlist-choice:not(:disabled):hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 7px 24px #0002}
.playlist-choice:focus-visible{border-color:var(--accent);box-shadow:0 0 18px #fa9ab326}
.playlist-choice:disabled{cursor:default}
.playlist-cover{position:relative;display:block;overflow:hidden;width:100%;height:clamp(82px,13dvh,116px)}
.playlist-cover>svg{display:block;width:100%;height:100%}
.cover-record{position:absolute;width:76px;height:76px;left:24px;top:calc(50% - 38px);border-radius:50%;display:grid;place-items:center;background:repeating-radial-gradient(circle,#282638 0 2px,#343142 3px 4px);box-shadow:3px 6px 12px #14132955;transform:rotate(-16deg);border:1px solid #fff2}
.cover-record::after{content:"";position:absolute;width:26px;height:26px;border-radius:50%;background:#c98389;box-shadow:inset 0 0 0 9px #eab3a6}
.night .cover-record::after{background:#64628e;box-shadow:inset 0 0 0 9px #a8a5c6}
.cover-record .icon{width:10px;height:10px;z-index:1;color:#514055}
.cover-play{position:absolute;right:10px;bottom:10px;display:grid;place-items:center;width:29px;height:29px;border-radius:50%;background:#fffde9ed;color:#443b4c;box-shadow:0 2px 8px #0002}
.cover-play .icon{width:13px;height:13px;fill:currentColor;transform:translateX(1px)}
.playlist-copy{display:flex;flex-direction:column;padding:11px 12px 12px;gap:4px}
.playlist-copy strong{font-size:15px;letter-spacing:-.03em;line-height:1.3}
.playlist-copy small{font-size:10px;color:var(--accent);line-height:1.4}
.playlist-copy>span{font-size:10px;color:var(--muted);line-height:1.4;white-space:nowrap}
.playlist-conversation{display:flex;flex:1 0 auto;flex-direction:column;gap:14px;padding:17px 0 0;min-height:220px}
.shared-track{align-self:flex-end;width:94%;display:flex;align-items:center;gap:11px;padding:11px;border:1px solid color-mix(in srgb,var(--accent) 35%,var(--line));border-radius:16px 16px 5px 16px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));animation:event-bubble .5s both}
.shared-cover{position:relative;width:60px;height:60px;flex:none;border-radius:10px;overflow:hidden}
.shared-cover>svg{height:100%;width:100%}
.mini-record{position:absolute;width:38px;height:38px;inset:11px;background:repeating-radial-gradient(circle,#272539 0 2px,#3e3a4d 3px 4px);border-radius:50%;box-shadow:0 2px 5px #0005}
.mini-record::after{content:"";position:absolute;inset:13px;background:#ebbcb3;border-radius:50%;border:4px solid #cd9393}
.is-playing .mini-record{animation:record-turn 3s linear infinite}
.shared-copy{display:flex;flex-direction:column;gap:4px;min-width:0}
.shared-copy small{font-size:9px;color:var(--muted);line-height:1.4}
.shared-copy strong{font-size:14px;line-height:1.4}
.shared-copy>span{font-size:11px;color:var(--muted);line-height:1.4}
.shared-track>.icon{width:19px;height:19px;color:var(--accent);flex:none;margin-left:auto}
.listening{display:flex;align-items:center;gap:9px;min-height:39px;font-size:11px;color:var(--muted);padding-left:8px}
.equalizer{display:flex;gap:3px;align-items:center;height:23px;color:var(--accent)}
.equalizer i{display:block;width:3px;height:15px;border-radius:2px;background:currentColor;animation:equalize .65s ease-in-out infinite alternate}
.equalizer i:nth-child(2){animation-delay:-.25s}.equalizer i:nth-child(3){animation-delay:-.5s}.equalizer i:nth-child(4){animation-delay:-.4s}.equalizer i:nth-child(5){animation-delay:-.15s}
.playlist-conversation .event-typing{min-height:38px;align-items:center}
.playlist-reaction{margin:auto 0;text-align:center;font-size:11px;line-height:1.6;color:var(--muted);word-break:keep-all;animation:event-arrive .6s .2s both}
.playlist-conversation .event-compose{margin-top:auto}
@keyframes record-turn{to{transform:rotate(360deg)}}
@keyframes equalize{from{transform:scaleY(.25)}to{transform:scaleY(1)}}
@media(max-width:600px){
 .playlist-body{gap:11px;padding-top:13px}.playlist-prompt strong{font-size:12px}.playlist-prompt p{font-size:10px}
 .playlist-cover{height:clamp(75px,13dvh,110px)}.playlist-choices{gap:10px}.playlist-copy{padding:9px 10px 10px;gap:3px}
 .playlist-copy strong{font-size:14px}.playlist-copy>span{font-size:9px}.playlist-copy small{font-size:9px}
 .cover-record{width:64px;height:64px;left:17px;top:calc(50% - 32px)}
 .playlist-conversation{gap:11px;padding-top:12px}
 .playlist-reaction{font-size:10px}
}
@media(max-height:760px){
 .playlist-body{gap:9px;padding-top:10px}.playlist-prompt strong{font-size:12px}.playlist-prompt p{font-size:10px;margin-top:3px}
 .playlist-cover{height:80px}.playlist-copy{padding:9px 10px;gap:2px}.playlist-copy strong{font-size:13px}
 .playlist-conversation{gap:10px;min-height:205px}.shared-track{padding:9px;gap:9px}.shared-cover{width:48px;height:48px}.mini-record{inset:5px}
}
@media(max-width:600px) and (max-height:650px){
 .playlist-body{gap:8px;padding-top:9px}.playlist-prompt p{font-size:9px}.playlist-prompt strong{font-size:11px}
 .playlist-cover{height:62px}.cover-record{width:51px;height:51px;left:17px;top:calc(50% - 25.5px)}.cover-record::after{width:22px;height:22px;box-shadow:inset 0 0 0 7px #eab3a6}
 .playlist-copy>span{display:none}.playlist-copy{padding:8px 10px}
 .playlist-conversation{min-height:0;padding-top:10px;gap:8px}.shared-copy strong{font-size:12px}.shared-copy>span{font-size:10px}
 .playlist-reaction{font-size:10px;line-height:1.5}
}
@media(max-width:359px){.playlist-copy strong{font-size:12px}}


/* Source: social-events.css */
/* Shared feed/voucher presentation; the existing event phone, opening and result modal remain common. */
.social-phone .event-workspace{display:flex;flex-direction:column;flex:1;min-height:0;padding-top:12px;gap:9px}
.social-phone .art-frame{position:relative;isolation:isolate;flex:1;min-height:100px;border-radius:15px;overflow:hidden;background:#ece4db;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.social-phone .art-frame>img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .45s}
.social-phone .art-frame>img.is-refreshing{animation:event-arrive .4s both}
.voucher-phone .art-frame{display:grid;grid-template-rows:42px minmax(0,1fr) 41px;background:#f9efe4;border:1px solid #ddc3ba;box-shadow:0 4px 14px #6945350a}
.voucher-phone .art-frame>img{object-fit:contain;min-height:0}
.voucher-heading{display:flex;flex-direction:column;justify-content:center;gap:1px;padding:6px 14px;pointer-events:none}
.voucher-heading span{font-size:8px;letter-spacing:.16em;font-weight:800;color:#ae7d77}.voucher-heading strong{font-size:12px;color:#77544f;font-weight:800}
.voucher-tear{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:6px 15px;border-top:1px dashed #d3b6ab;background:#fffaf2;position:relative}
.voucher-tear::before,.voucher-tear::after{content:"";position:absolute;top:-7px;width:12px;height:12px;border:1px solid #ddc3ba;border-radius:50%;background:var(--surface)}.voucher-tear::before{left:-7px}.voucher-tear::after{right:-7px}
.voucher-barcode{width:45%;height:24px;opacity:.65;background:repeating-linear-gradient(90deg,#5e4b46 0 2px,transparent 2px 4px,#5e4b46 4px 5px,transparent 5px 8px,#5e4b46 8px 12px,transparent 12px 14px,#5e4b46 14px 15px,transparent 15px 19px);border-left:3px solid #5e4b46;border-right:3px solid #5e4b46}
.voucher-tear>span:last-child{font-size:8px;line-height:1.5;text-align:right;color:#9b8076}.voucher-tear strong{display:block;font-size:10px;color:#77544f}
.feed-phone .art-frame{cursor:pointer}
.social-phone .art-action{position:absolute;top:11px;right:11px;z-index:3;width:44px;height:44px;border-radius:50%;background:#fffffff2;color:#635568;border:1px solid #ffffffb0;display:grid;place-items:center;box-shadow:0 3px 15px #3f29321a;backdrop-filter:blur(6px)}
.social-phone .art-action .icon{width:23px;height:23px;transition:fill .2s,stroke .2s,transform .2s}.social-phone .art-action:disabled{opacity:1;cursor:default}
.social-phone .like-button[aria-pressed="true"]{color:#ec5269;animation:social-like-glow .9s ease-out}
.social-phone .like-button[aria-pressed="true"] .icon{fill:#ec5269;transform-origin:center;animation:social-small-heart .8s cubic-bezier(.2,.8,.2,1) both}
.social-phone .like-button[aria-pressed="true"]::after{content:"";position:absolute;inset:1px;border:2px solid #ec5269;border-radius:50%;pointer-events:none;opacity:0;animation:social-like-ring .8s ease-out .08s both}
.voucher-phone .refresh-button{width:36px;height:36px;top:8px;right:9px;padding:0;line-height:1;display:grid;place-items:center;background:#fffaf2;color:#9f7376;box-shadow:none;border-color:#dfc5bc}.voucher-phone .refresh-button .icon{display:block;width:18px;height:18px;margin:0;transform-origin:center}
.social-phone .refresh-button.is-spinning .icon{animation:social-refresh-spin .4s ease-out}
.social-phone .double-tap-hint{position:absolute;bottom:10px;left:11px;display:flex;align-items:center;gap:5px;color:#fff;background:#33283266;backdrop-filter:blur(5px);border-radius:20px;padding:5px 9px;font-size:9px;pointer-events:none}.social-phone .double-tap-hint .icon{width:12px;height:12px}
.social-phone .gift-sent-stamp{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;font-weight:800;color:#fff;background:#332b4266;backdrop-filter:blur(3px);animation:event-arrive .4s both}.social-phone .gift-sent-stamp .icon{width:19px;height:19px}
.social-phone .art-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:36px;flex:none;padding:0 3px}.social-phone .art-caption>div{display:flex;flex-direction:column;gap:2px;min-width:0}.social-phone .art-caption strong{font-size:12px;line-height:1.5;letter-spacing:-.02em}.social-phone .art-caption>div>span{color:var(--muted);font-size:10px;line-height:1.5}.social-phone .gift-price{font-size:12px;color:var(--accent);font-weight:800;white-space:nowrap}
.social-phone .event-choices{gap:9px}.feed-phone .event-choices{grid-template-columns:1fr}
.social-phone.is-waiting .art-frame,.social-phone.is-replied .art-frame{min-height:82px}
.social-phone .event-response{flex:none;min-height:75px;padding:3px 0 0}.social-phone .waiting{display:flex;align-items:center;justify-content:center;gap:10px;min-height:72px;font-size:11px;color:var(--muted)}.social-phone .waiting-dots{display:flex;gap:4px}.social-phone .waiting-dots i{width:5px;height:5px;background:var(--accent);border-radius:50%;animation:event-dot 1s infinite}.social-phone .waiting-dots i:nth-child(2){animation-delay:.16s}.social-phone .waiting-dots i:nth-child(3){animation-delay:.32s}
.social-phone .reply-copy{display:flex;flex-direction:column;gap:6px}.social-phone .reply-kicker{display:flex;align-items:center;gap:6px;font-size:11px;color:var(--accent);font-weight:800;padding-left:2px}.social-phone .reply-kicker .icon{width:14px;height:14px}.social-phone .reaction-text{font-size:11px;line-height:1.7;text-align:center;color:var(--muted);padding:2px 0;margin:0;word-break:keep-all}
.social-phone.is-failure .reply-kicker{justify-content:center;font-size:13px;color:var(--ink);padding-top:9px}.feed-phone.is-failure .reply-copy{min-height:88px;justify-content:center}.social-phone .event-hearts{z-index:4}.social-phone .event-hearts>span{bottom:36%}
@keyframes social-small-heart{0%{transform:scale(.8) rotate(-8deg)}28%{transform:scale(1.42) rotate(5deg)}52%{transform:scale(.94) rotate(-3deg)}76%{transform:scale(1.08)}100%{transform:scale(1)}}
@keyframes social-like-ring{0%{opacity:.7;transform:scale(.9)}100%{opacity:0;transform:scale(1.36)}}
@keyframes social-like-glow{0%,100%{box-shadow:0 3px 15px #3f29321a}35%{box-shadow:0 0 0 6px #ec526920,0 0 18px #ec526958}}
@keyframes social-refresh-spin{to{transform:rotate(360deg)}}
@media(hover:hover) and (pointer:fine){.social-phone .art-frame:hover>img{transform:scale(1.018)}.social-phone .art-action:not(:disabled):hover{transform:scale(1.06);background:#fff}}
@media(max-width:600px){
 .social-phone .event-workspace{padding-top:9px;gap:6px}.social-phone .art-action{width:42px;height:42px;top:9px;right:9px}.social-phone .art-action .icon{width:22px;height:22px}.social-phone .art-caption{min-height:34px}.social-phone .art-caption strong{font-size:11px}.social-phone .art-caption>div>span{font-size:9px}.social-phone .gift-price{font-size:11px}
 .social-phone.is-replied .art-caption{display:none}.social-phone.is-replied .event-response{min-height:88px}.social-phone.is-waiting .event-response{min-height:60px}.social-phone .waiting{min-height:60px}.social-phone .reaction-text{font-size:10px}.social-phone .reply-kicker{font-size:10px}
 .voucher-phone .art-frame{grid-template-rows:34px minmax(0,1fr) 33px}.voucher-heading{padding:3px 12px}.voucher-heading span{font-size:7px}.voucher-heading strong{font-size:10px}.voucher-tear{padding:4px 12px}.voucher-barcode{height:19px}.voucher-tear>span:last-child{font-size:7px}.voucher-tear strong{font-size:9px}
 .voucher-phone .refresh-button{width:32px;height:32px;top:6px;right:8px}
 .voucher-phone.is-waiting .art-frame,.voucher-phone.is-replied .art-frame{grid-template-rows:minmax(0,1fr)}.voucher-phone.is-waiting .voucher-heading,.voucher-phone.is-waiting .voucher-tear,.voucher-phone.is-replied .voucher-heading,.voucher-phone.is-replied .voucher-tear{display:none}
}
@media(max-height:740px){.social-phone .event-workspace{padding-top:8px}.social-phone.is-replied .art-frame{min-height:60px}.social-phone.is-replied .event-response{min-height:80px}.feed-phone.is-failure .reply-copy{min-height:74px}}
@media(max-width:359px){.social-phone .art-action{width:39px;height:39px}}
@media(max-height:600px){.social-phone.is-failure .reply-kicker{padding-top:3px}}
@media(max-width:600px) and (max-height:650px){
 .social-phone .art-frame{min-height:80px}.social-phone.is-replied .art-frame{min-height:52px}
 .voucher-phone .art-frame{grid-template-columns:minmax(96px,36%) minmax(0,1fr);grid-template-rows:minmax(0,1fr) 40px;column-gap:12px}
 .voucher-phone .art-frame>img{grid-column:1;grid-row:1;padding:8px 0 8px 12px}
 .voucher-heading{grid-column:2;grid-row:1;gap:3px;padding:8px 42px 8px 0}
 .voucher-heading span{font-size:7px}.voucher-heading strong{font-size:11px}
 .voucher-tear{grid-column:1 / -1;grid-row:2;padding:7px 12px;gap:12px}
 .voucher-barcode{height:17px}.voucher-tear>span:last-child{font-size:7px}.voucher-tear strong{font-size:9px}
 .voucher-phone.is-waiting .art-frame,.voucher-phone.is-replied .art-frame{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr)}.voucher-phone.is-waiting .art-frame>img,.voucher-phone.is-replied .art-frame>img{grid-row:1;padding:0}
}


/* Source: incoming-message-event.css */
/* Shared EventPhone, incoming/outgoing bubbles and relationship result; no extra image assets. */
.incoming-phone:not(.is-sent) .event-phone-header::after{content:"";position:absolute;top:0;right:0;width:6px;height:6px;border:1px solid var(--surface);border-radius:50%;background:var(--accent);animation:incoming-notification-pulse 1.7s infinite}
.incoming-phone .incoming-time{text-align:center;color:var(--muted);font-size:9px;flex:none}.incoming-phone .incoming-bubble{transform-origin:left bottom;animation:incoming-message-pop .55s both}
.incoming-phone .first-thought{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;margin:0;text-align:center;color:var(--muted);font-size:12px;line-height:1.6}.incoming-phone .first-thought strong{color:var(--ink);font-weight:500}.incoming-phone .reply-narration{font-size:12px;line-height:1.65;word-break:keep-all;padding:0 8px;min-height:32px}
.incoming-phone .event-choices{grid-template-columns:1fr}.incoming-phone .event-hearts{z-index:4}.incoming-phone.is-failure .reply-narration{color:var(--muted)}
.incoming-phone .reply-narration{animation:incoming-reaction .65s both}
@keyframes incoming-reaction{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
@keyframes incoming-notification-pulse{50%{box-shadow:0 0 0 4px color-mix(in srgb,var(--accent) 12%,transparent)}}@keyframes incoming-message-pop{from{opacity:0;transform:translateY(7px) scale(.92)}to{opacity:1;transform:none}}
@media(max-width:600px){
 .incoming-phone .first-thought,.incoming-phone .reply-narration{font-size:11px}
}
@media(max-height:660px){
 .incoming-phone .incoming-time{font-size:8px}.incoming-phone .first-thought,.incoming-phone .reply-narration{font-size:10px;line-height:1.55;gap:4px}.incoming-phone.is-sent .incoming-time{display:none}.incoming-phone.is-sent .reply-narration{min-height:26px}
}


/* Source: movie-event.css */
/* Movie posters reuse EventPhone, event opening, message bubbles and the shared result modal. */
.movie-selection{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px;padding-top:14px}
.movie-prompt{display:flex;align-items:center;justify-content:center;gap:12px;flex:none;font-size:12px;color:var(--muted)}.movie-prompt strong{font-weight:500;white-space:nowrap}.movie-prompt>span{height:1px;width:22px;background:var(--line)}
.movie-choices{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex:1;min-height:0;padding-bottom:3px}
.movie-choice{position:relative;min-width:0;min-height:0;display:block;padding:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:#2b2832;color:#fff;text-align:left;box-shadow:0 5px 13px #35273d12;cursor:pointer;transition:transform .3s,box-shadow .3s,border-color .3s}
.movie-choice:disabled{opacity:1;cursor:default}.movie-choice .poster-art{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:center top;transition:transform .6s}
.movie-poster-copy{position:absolute;inset:auto 0 0;display:flex;flex-direction:column;gap:6px;padding:38px 12px 14px;background:linear-gradient(transparent,#171521c4 43%,#171521ee);pointer-events:none}
.movie-poster-copy small{font-size:10px;letter-spacing:.04em;color:#fff9}.movie-poster-copy strong{font-size:18px;line-height:1.35;letter-spacing:-.05em;word-break:keep-all;text-shadow:0 2px 7px #0005}.movie-poster-copy>span{font-size:9px;line-height:1.5;color:#fffc;word-break:keep-all}
@media(hover:hover){.movie-choice:not(:disabled):hover{transform:translateY(-3px);border-color:var(--accent);box-shadow:0 10px 26px #35273d30}.movie-choice:not(:disabled):hover .poster-art{transform:scale(1.035)}}
.movie-choice.chosen{animation:movie-poster-share .6s ease-in both;z-index:2}.movie-choice.not-chosen{opacity:.35;transition:opacity .4s}
.movie-narration{display:flex;align-items:center;justify-content:center;flex:1;min-height:25px;margin:0;color:var(--muted);text-align:center;font-size:12px;line-height:1.65;word-break:keep-all;animation:event-arrive .65s both}
.movie-chat .event-compose{flex:none}.movie-chat .event-status{flex:1}
@keyframes movie-poster-share{35%{transform:translateY(-5px) scale(1.02)}100%{opacity:0;transform:translateY(-18px) scale(.96)}}
@media(max-width:600px){.movie-selection{padding-top:13px;gap:12px}.movie-choices{gap:11px}.movie-poster-copy{padding:38px 11px 13px;gap:5px}.movie-poster-copy strong{font-size:16px}.movie-poster-copy small{font-size:9px}.movie-narration{font-size:11px}}
@media(max-height:700px){.movie-selection{padding-top:10px;gap:9px}.movie-prompt{font-size:11px}.movie-poster-copy{padding:26px 9px 10px;gap:3px}.movie-poster-copy strong{font-size:14px}.movie-poster-copy>span{display:none}.movie-phone .movie-narration{font-size:10px;line-height:1.5;min-height:22px}}
@media(max-width:350px){.movie-poster-copy strong{font-size:13px}.movie-prompt{font-size:10px;gap:8px}}
@media(max-height:600px){.movie-phone .movie-narration{padding-inline:2px;line-height:1.45;font-size:10px;min-height:18px}.movie-poster-copy{padding-top:21px}}


/* Source: event-layout.css */
/* One frame for all events, loaded after presentation-specific styles.
   Keep shared geometry here and artwork / conversation animations in each event. */
.game-shell:has(.special-event){height:100dvh;min-height:540px;display:flex;flex-direction:column}
.game-shell:has(.special-event)>.game-header{flex:none;width:100%}
.game-shell>.stage.event-stage{width:100%;flex:1;min-height:0;padding:16px 20px 20px;align-items:center}
.stage>.special-event{--event-card-height:144px;--event-copy-size:13px;--event-action-height:44px;--event-space:12px;height:100%;min-height:0;gap:14px}
.special-event>.event-heading{flex:none;width:100%}
.special-event .event-heading .eyebrow{font-size:10px}
.special-event .event-heading h1{font-size:28px;line-height:1.3;margin:6px 0}
.special-event .event-heading p{font-size:13px;line-height:1.6;min-height:2lh;max-width:440px;margin:0 auto;display:flex;align-items:center;justify-content:center}
.special-event .event-phone{flex:1;width:min(440px,100%);height:auto;min-height:0;max-height:640px;padding:12px 18px 10px;border-radius:30px;overflow:visible}
.special-event .event-phone .event-camera{margin-bottom:9px}
.special-event .event-phone .event-phone-header{position:relative;padding-bottom:9px;font-size:12px;line-height:1.4}
.special-event .event-phone .event-phone-header .icon{width:18px;height:18px}
.special-event .event-phone .event-card{flex:none;height:var(--event-card-height);min-height:0;border-radius:16px;background:#fff8ee;transition:none}
.special-event .event-phone .event-card .portrait{position:absolute;inset:0 0 auto auto;width:58%;height:100%;object-fit:cover;object-position:center top;mask-image:linear-gradient(90deg,transparent,#000 20%);transition:transform 1s ease}
.special-event .event-phone.is-success .event-card .portrait{transform:scale(1.03)}
.special-event .event-phone .event-card::after{inset:0;background:linear-gradient(90deg,#393043c4,#39304382 35%,transparent 68%)}
.special-event .event-card-copy{left:15px;bottom:13px}
.special-event .event-card-copy h2{font-size:22px;line-height:1.2;margin:0 0 4px}
.special-event .event-card-copy p{display:block;font-size:11px;line-height:1.4;margin:0}
.event-card-caption{position:absolute;z-index:1;left:13px;top:12px;display:flex;align-items:center;gap:5px;padding:5px 7px;border-radius:8px;background:#39304360;color:#fff;font-size:9px}
.event-card-caption .icon{width:12px;height:12px}
.special-event .event-phone .event-chat{flex:1;min-height:0;gap:var(--event-space);padding:var(--event-space) 0;overflow:visible}
.special-event .event-phone .event-message{max-width:100%}
.special-event .event-phone .event-message p{padding:10px 12px;font-size:var(--event-copy-size);line-height:1.6}
/* Outgoing typing is shared by incoming-message and seasonal conversations. */
.special-event .self-typing{align-self:flex-end;display:flex;align-items:center;gap:4px;padding:13px 17px;border-radius:16px;background:color-mix(in srgb,var(--accent) 15%,var(--surface));flex:none}
.special-event .self-typing i{width:5px;height:5px;background:var(--accent);border-radius:50%;animation:event-dot .9s infinite}
.special-event .self-typing i:nth-child(2){animation-delay:.15s}
.special-event .self-typing i:nth-child(3){animation-delay:.3s}
.special-event .event-phone .event-compose{margin-top:0;padding-top:9px}
.special-event .event-phone .event-choices button,.special-event .event-phone .event-continue,.special-event .event-phone .event-status{min-height:var(--event-action-height);font-size:12px;line-height:1.5;padding:8px 7px;border-radius:13px}
.special-event .event-phone .event-send:disabled{background:var(--surface-raised);border:1px solid var(--line);color:var(--muted);opacity:.65;cursor:not-allowed;transform:none;box-shadow:none}
.special-event .event-phone .event-home{margin:9px auto 0}
.special-event .event-phone .event-status{margin:0;text-align:center}
.special-event .playlist-body{flex:1;min-height:0;padding-top:var(--event-space)}
.special-event .playlist-choices{flex:1;min-height:0}
.special-event .playlist-cover{flex:1;min-height:0;height:auto;max-height:none}
.special-event .playlist-conversation{flex:1;min-height:0;padding-top:var(--event-space)}
.special-event .movie-selection{padding-top:var(--event-space)}
.special-event .movie-chat .event-compose{margin-top:auto}
.special-event .social-phone .event-workspace{padding-top:var(--event-space)}
.special-event .social-phone>.event-compose{margin-top:9px}
@media(max-width:600px){
 .game-shell>.stage.event-stage{padding:12px 14px 14px}
 .stage>.special-event{--event-card-height:128px;--event-copy-size:12px;gap:12px}
 .special-event .event-heading .eyebrow{font-size:9px}
 .special-event .event-heading h1{font-size:24px}
 .special-event .event-heading p{font-size:11px;max-width:310px}
 .special-event .event-phone{padding:10px 14px 9px;border-radius:27px}
 .special-event .event-card-copy h2{font-size:21px}
 .special-event .event-card-copy p{font-size:10px}
 .special-event .event-phone .event-choices button,.special-event .event-phone .event-continue,.special-event .event-phone .event-status{font-size:11px}
}
@media(max-height:700px){
 .game-shell>.stage.event-stage{padding:8px 12px 10px}
 .stage>.special-event{--event-card-height:96px;--event-space:8px;--event-copy-size:11px;--event-action-height:40px;gap:8px}
 .special-event .event-heading .eyebrow{font-size:8px}
 .special-event .event-heading h1{font-size:22px;margin:3px 0 4px}
 .special-event .event-heading p{font-size:10px;line-height:1.5}
 .special-event .event-phone{padding:8px 12px 7px}
 .special-event .event-phone .event-camera{margin-bottom:6px}
 .special-event .event-phone .event-phone-header{padding-bottom:7px;font-size:11px}
 .special-event .event-card-copy{left:12px;bottom:10px}
 .special-event .event-card-copy h2{font-size:19px;margin-bottom:3px}
 .special-event .event-card-copy p{font-size:9px}
 .special-event .event-phone .event-message p{padding:7px 10px}
 .special-event .event-phone .event-compose{padding-top:6px}
 .special-event .event-phone .event-home{margin-top:7px}
 .event-card-caption{display:none}
}
@media(max-height:600px){
 .stage>.special-event{--event-card-height:72px;--event-space:7px}
 .special-event .event-card-copy h2{font-size:18px}
 .special-event .social-phone .event-response,.special-event .social-phone .reply-copy{min-height:0}
 .special-event .social-phone .art-frame{min-height:60px}
 .special-event .social-phone.is-replied .art-frame{min-height:40px}
 .special-event .incoming-phone .incoming-time{display:none}
 .special-event .playlist-body{gap:6px}
 .special-event .playlist-conversation{gap:7px}
 .special-event .shared-track{padding:7px}
 .special-event .shared-cover{width:40px;height:40px}
 .special-event .mini-record{inset:1px}
}


/* Source: taste-event.css */
/* Reuse the shared phone, incoming-message animation and result dialog. */
.special-event.taste-event .event-phone .event-chat{gap:10px;padding:12px 0}
.special-event.taste-event .event-phone .event-message{max-width:95%}
.special-event.taste-event .event-phone .event-message p{white-space:pre-line}
.special-event.taste-event .event-phone .event-choices{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
.special-event.taste-event .event-phone .event-choices button{padding:10px 7px;white-space:normal;gap:5px}
.taste-phone .event-choices button .icon{width:14px;height:14px;flex:none}
.taste-phone .reply-narration{min-height:23px;flex:1;margin:0;padding:0 4px}
.taste-phone .event-typing{padding:10px 13px}
@media(max-width:600px){.special-event.taste-event .event-phone .event-choices button{padding:9px 6px;gap:4px}}
@media(max-height:700px){
 .special-event.taste-event .event-phone .event-chat{gap:7px;padding:8px 0}
 .special-event.taste-event .event-phone .event-message p{line-height:1.5;padding:7px 10px}
 .taste-phone .incoming-time{display:none}
 .taste-phone .reply-narration{font-size:10px;min-height:20px}
}
@media(max-height:600px){
 .special-event.taste-event .event-phone .event-chat{gap:5px;padding:6px 0}
 .special-event.taste-event .event-phone .event-message p{padding:6px 10px}
 .special-event.taste-event .event-phone .event-status{min-height:34px;padding:5px 0;font-size:10px}
}


/* Source: seasonal-events.css */
/* Season-only accents share the standard event frame and result dialog. */
.season-holiday-photo{--photo-height:200px;flex:none;align-self:flex-start;width:min(100%,calc(var(--photo-height)*1.7778));overflow:hidden;border-radius:13px;box-shadow:0 4px 16px #0002;animation:event-bubble .6s both;transition:width .35s ease}
.season-holiday-photo>img{display:block;width:100%;height:auto}
.season-holiday-photo.is-replied{--photo-height:122px}
@media(max-height:700px){
 .season-holiday-photo{--photo-height:125px}
 .season-holiday-photo.is-replied{--photo-height:90px}
}
@media(max-height:600px){
 .season-holiday-photo{--photo-height:clamp(54px,calc(100dvh - 482px),96px)}
 .season-holiday-photo.is-replied{--photo-height:clamp(28px,calc(100dvh - 515px),73px)}
}
.season-greeting-card{position:relative;flex:none;align-self:stretch;max-width:330px;margin:0 auto;width:100%;}
.season-greeting-card>img{display:block;width:100%;height:auto;max-height:132px;object-fit:contain;border-radius:12px;box-shadow:0 5px 18px #0002}
.season-greeting-card.is-delivered{max-width:230px;align-self:flex-end;margin:0;animation:event-bubble .45s both}
.season-greeting-card.is-delivered>img{max-height:92px}
.season-greeting-card>span{position:absolute;bottom:5px;right:6px;display:flex;align-items:center;gap:3px;padding:3px 6px;border-radius:9px;background:#fdf6ebee;color:#426555;font-size:9px}
.season-greeting-card>span>.icon{width:11px;height:11px}
.season-card-note{margin:0;font-size:12px;line-height:1.6;color:var(--muted);text-align:center;word-break:keep-all}
.special-event .season-chat-phone .season-chat{gap:10px}
@media(max-height:700px){
 .season-greeting-card>img{max-height:102px}
 .season-greeting-card.is-delivered>img{max-height:72px}
 .season-greeting-card.is-delivered{max-width:180px}
 .season-card-note{font-size:11px}
 .special-event .season-chat-phone .season-chat{gap:7px}
}
@media(max-height:600px){
 .season-greeting-card{max-width:200px}
 .season-greeting-card>img{max-height:80px}
 .season-greeting-card.is-delivered{max-width:125px}
 .season-greeting-card.is-delivered>img{max-height:50px}
 .special-event .event-phone.season-chat-phone .event-message p{padding:6px 9px;font-size:11px;line-height:1.5}
 .special-event .season-chat-phone .season-status{font-size:10px}
}
.special-event .event-heading .season-badge{position:relative;isolation:isolate;display:inline-flex;align-items:center;gap:5px;letter-spacing:.06em;color:var(--ink);padding:0 9px}
.season-badge::before{content:"";position:absolute;z-index:-1;inset:-4px 0;border:1px solid #dcb87c66;border-radius:99px;background:color-mix(in srgb,#dcb87c 17%,var(--surface))}
.season-badge .icon{width:1em;height:1em;color:#bb9355}
.season-opening .event-opening-symbol{color:#efcd91;border-color:#efcd9144;background:linear-gradient(145deg,#efcd9125,#ff91b208);box-shadow:0 0 60px #efcd9115}
.season-opening .event-opening-symbol::after{border-color:#efcd9150}
.season-opening .event-opening-kicker{color:#efcd91}
.season-phone{border-color:color-mix(in srgb,#dcb87c 35%,var(--line))}
.season-conversation{display:flex;flex:1;min-height:0;flex-direction:column;gap:14px;padding:14px 0}
.season-voucher{display:flex;flex:none;gap:14px;padding:10px;border-radius:16px;background:#fff6e9;color:#584039;border:1px solid #e2cbae}
.season-voucher>img{width:112px;height:112px;flex:none;object-fit:cover;border-radius:10px}
.season-voucher-copy{min-width:0;display:flex;flex:1;flex-direction:column;justify-content:center;gap:5px}
.season-voucher-copy>span{font-size:9px;color:#98734e;letter-spacing:.06em}
.season-voucher-copy>strong{font-size:14px;line-height:1.4;word-break:keep-all}
.season-voucher-copy>small{font-size:10px;line-height:1.4;color:#907669}
.season-gift-price{font-size:13px;line-height:1.4;font-weight:700;color:#ce497d}
.season-voucher-code{display:flex;align-items:center;justify-content:space-between;gap:9px;border-top:1px dashed #cbbba7;margin-top:5px;padding-top:8px;font-size:8px;white-space:nowrap}
.season-voucher-code .voucher-barcode{width:60px;min-width:30px;height:16px}
.season-message-area{display:flex;flex:1;min-height:0;flex-direction:column;gap:7px}
.season-message-label{font-size:10px;color:var(--muted)}
.season-message-area .event-message p{white-space:pre-line}
.season-status{gap:6px;white-space:normal}
.season-status .icon{width:13px;height:13px;flex:none;color:var(--accent)}
.season-phone .event-choices{grid-template-columns:1fr}
.season-phone.is-sent .season-voucher>img{width:76px;height:76px}
@media(max-height:700px){
 .season-conversation{gap:10px;padding:9px 0}
 .season-voucher{gap:12px;padding:8px;border-radius:12px}
 .season-voucher>img{width:80px;height:80px}
 .season-voucher-copy{gap:3px}
 .season-voucher-copy>strong{font-size:12px}
 .season-voucher-copy>small{font-size:9px}
 .season-voucher-code{padding-top:5px;margin-top:3px}
 .season-phone.is-sent .season-voucher>img{width:64px;height:64px}
 .season-message-area{gap:5px}
}
@media(max-height:600px){
 .season-voucher{padding:5px;gap:10px}
 .season-voucher-copy{gap:2px}
 .season-voucher-code{padding-top:3px;margin-top:0}
 .season-voucher>img,.season-phone.is-sent .season-voucher>img{width:48px;height:48px}
 .season-voucher-copy>small{display:none}
 .season-conversation{gap:6px;padding:7px 0}
 .season-voucher-code .voucher-barcode{height:12px}
 .special-event .season-phone .event-message p{font-size:11px;line-height:1.5}
 .season-voucher-copy>span,.season-message-label{display:none}
 .special-event .season-phone .season-status{font-size:10px}
}


/* Source: special-days.css */
.special-days-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.special-day-card{position:relative;isolation:isolate;overflow:hidden;aspect-ratio:1.4;border-radius:12px;background:#201c27;color:white;text-align:left;animation:special-day-in 600ms calc(var(--day-order)*90ms) both}
.special-day-card>img{width:100%;height:100%;object-fit:cover;transition:transform 700ms ease}
.special-day-card:hover>img{transform:scale(1.045)}
.special-day-card::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 15%,#191522c9 70%,#191522f0);pointer-events:none}
.special-day-card-copy{position:absolute;z-index:1;inset:auto 10px 10px;display:flex;flex-direction:column;gap:5px}
.special-day-card-copy small{display:flex;align-items:center;gap:4px;color:#eed49d;font-size:10px}
.special-day-card-copy small .icon{width:12px;height:12px}
.special-day-card-copy strong{font-size:13px;line-height:1.35;word-break:keep-all}
.special-day-card-copy>span{font-size:10px;color:#eee5e9}
.special-days-empty{height:100%;min-height:140px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--muted);text-align:center;font-size:13px}
.special-days-empty>.icon{width:32px;height:32px;color:#b89b68}
.special-days-empty p{margin:0}
.modal.illustration-modal.special-day-viewer{--special-day-copy-room:160px;display:flex;flex-direction:column;width:min(1100px,calc(100vw - var(--dialog-gap)*2),calc((var(--dialog-max-height) - var(--special-day-copy-room))*1.7778));background:#1d1924;color:#fff;border:1px solid #ffffff18}
.special-day-scene{position:relative;overflow:hidden;min-height:0;flex:1}
.special-day-picture{display:block;width:100%;height:auto;max-height:calc(var(--dialog-max-height) - 160px);object-fit:contain;animation:special-day-picture-in 900ms ease-out both}
.special-day-glow{position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 35%,#ffe9b829 50%,transparent 65%);background-size:220% 100%;animation:special-day-glow 1.7s 150ms both}
.special-day-caption{display:flex;flex:none;align-items:center;gap:15px;padding:18px 26px 36px;animation:special-day-in 700ms 200ms both}
.special-day-caption>.portrait{width:46px;height:58px;flex:none;border-radius:12px;object-fit:cover;object-position:center top}
.special-day-caption-copy{min-width:0;flex:1}
.special-day-byline{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:12px}
.special-day-byline>span{font-size:10px;color:#dbc99f}
.special-day-caption h2{margin:7px 0 5px;font-size:21px;line-height:1.35}
.special-day-caption p{margin:0;font-size:12px;line-height:1.7;color:#ded5e5;word-break:keep-all}
.special-day-viewer .memory-viewer-navigation>button{top:40%}
.special-day-viewer .memory-position{bottom:8px;font-size:10px;padding:3px 10px}
@keyframes special-day-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
@keyframes special-day-picture-in{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}
@keyframes special-day-glow{from{opacity:0;background-position:140% 0}30%{opacity:1}to{opacity:0;background-position:-40% 0}}
@media(max-width:600px){
 .modal.illustration-modal.special-day-viewer{--special-day-copy-room:180px}
 .special-days-grid{gap:8px}
 .special-day-card{aspect-ratio:1.15}
 .special-day-card-copy{inset:auto 8px 8px;gap:4px}
 .special-day-card-copy strong{font-size:12px}
 .special-day-card-copy small,.special-day-card-copy>span{font-size:9px}
 .special-day-caption{align-items:flex-start;gap:10px;padding:14px 14px 34px}
 .special-day-caption>.portrait{width:36px;height:46px;border-radius:9px}
 .special-day-caption h2{font-size:17px;margin:6px 0}
 .special-day-caption p{font-size:11px;line-height:1.65}
 .special-day-byline{font-size:12px;gap:4px}
 .special-day-byline>span{font-size:9px}
 .special-day-picture{max-height:calc(var(--dialog-max-height) - 180px)}
}
@media(max-height:500px){
 .modal.illustration-modal.special-day-viewer{--special-day-copy-room:130px}
 .special-day-card{aspect-ratio:1.85}
 .special-day-caption{padding:10px 20px 28px;gap:12px}
 .special-day-caption h2{font-size:17px;margin:4px 0}
 .special-day-caption p{font-size:10px;line-height:1.5}
 .special-day-picture{max-height:calc(var(--dialog-max-height) - 130px)}
}


/* Source: money-amount.css */
:root { --balance-color:#e6c78b; }
[data-theme="light"] { --balance-color:#89601f; }
/* One currency treatment for prices, balances and signed transactions. */
.money-amount { display:inline-flex; align-items:center; gap:.25em; vertical-align:baseline; white-space:nowrap; font-variant-numeric:tabular-nums; }
.money-amount>.money-icon { width:.95em; height:.95em; flex:none; color:inherit; }
.money-amount>.money-value { font:inherit; letter-spacing:inherit; color:inherit; }


/* Source: relationship-actions.css */
/* Concept A: direct action rows beneath the portrait, with a quiet cost column. */
.relationship-card--actions {
  container-name: relationship-action-card;
  container-type: inline-size;
  background: var(--surface);
  border-color: var(--line);
}

.relationship-card--actions,
.relationship-card--actions.has-actions.can-confess {
  --card-copy-bottom: 16px;
}

.relationship-card--actions .relationship-art {
  aspect-ratio: 6 / 7;
  min-height: 0;
}

.relationship-card--actions .relationship-art::after {
  background: linear-gradient(transparent 32%, #15121b38 48%, #15121bc7 79%, #15121be8);
}

.relationship-card--actions > .relationship-actions {
  position: static;
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 5px 10px 7px;
}

.relationship-card--actions .relationship-actions > button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  width: 100%;
  min-width: 0;
  min-height: 44px;
  padding: 8px 4px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--accent);
  box-shadow: none;
  font-size: 12px;
  font-weight: 650;
  line-height: 1.4;
  text-align: left;
}

.relationship-card--actions .relationship-actions > button + button {
  border-top: 1px solid var(--line);
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

/* Name this slot explicitly so nested MoneyAmount content is never a label. */
.relationship-actions > button .relationship-action-label {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  gap: 6px;
  min-width: 0;
  white-space: nowrap;
}

.relationship-actions > button .relationship-action-label > .icon {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
}

.relationship-card--actions .relationship-action-cost {
  flex: 0 0 auto;
  color: #c7a7b5;
  font-size: 11px;
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: 0;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.relationship-card--actions .relationship-action-cost .money-amount {
  gap: 3px;
  font: inherit;
  color: inherit;
}

.relationship-card--actions .relationship-action-cost .icon {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
}

.relationship-card--actions .relationship-actions > button:not(:disabled):is(:hover,:focus-visible) {
  background: color-mix(in srgb, var(--accent) 9%, transparent);
  filter: none;
}

.relationship-card--actions .relationship-actions > button:not(:disabled):active {
  background: color-mix(in srgb, var(--accent) 15%, transparent);
  transform: translateY(1px);
}

.relationship-card--actions .relationship-actions > button:disabled {
  opacity: 1;
  color: var(--muted);
  background: color-mix(in srgb, var(--muted) 10%, transparent);
  cursor: not-allowed;
  filter: none;
  transform: none;
}

.relationship-card--actions .relationship-actions > button.is-complete:disabled {
  color: var(--mint);
  background: color-mix(in srgb, var(--mint) 10%, transparent);
}

.relationship-card--actions .relationship-actions > button.is-complete .relationship-action-cost {
  color: inherit;
}

.relationship-card--actions .relationship-actions > .relationship-confess {
  justify-content: center;
}

[data-theme="light"] .relationship-card--actions .relationship-action-cost {
  color: #906575;
}

@container relationship-action-card (max-width: 190px) {
  .relationship-card--actions > .relationship-actions {
    padding-inline: 6px;
  }

  .relationship-card--actions .relationship-actions > button {
    gap: 4px;
    padding-inline: 2px;
    font-size: 11px;
  }

  .relationship-card--actions .relationship-actions > button .relationship-action-label {
    gap: 4px;
  }

  .relationship-card--actions .relationship-action-cost {
    font-size: 10px;
  }
}

/* Very narrow two-column cards retain one line and the same 44px touch height. */
@container relationship-action-card (max-width: 150px) {
  .relationship-card--actions > .relationship-actions {
    padding-inline: 4px;
  }

  .relationship-card--actions .relationship-actions > button {
    gap: 3px;
    padding-inline: 1px;
    font-size: 10px;
  }

  .relationship-card--actions .relationship-actions > button .relationship-action-label {
    gap: 3px;
  }

  .relationship-card--actions .relationship-action-label > .icon {
    width: 13px;
    height: 13px;
    flex-basis: 13px;
  }

  .relationship-card--actions .relationship-action-cost {
    font-size: 9px;
  }

  .relationship-card--actions .relationship-action-cost .icon {
    width: 11px;
    height: 11px;
    flex-basis: 11px;
  }
}

.relationship-card--actions .relationship-actions>button>.relationship-action-copy { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; min-width:0; }
.relationship-action-reason { color:inherit; font-size:10px; font-weight:500; line-height:1.2; white-space:nowrap; }
.relationship-card--actions .relationship-actions>button:disabled .relationship-action-cost { color:inherit; }