/* First-screen presentation only. Existing forms and storage are unchanged. */
body{background:#f7f5ed;background-image:radial-gradient(#dedfd3 .8px,transparent .8px);background-size:16px 16px}
header{max-width:1120px;padding:22px 30px 18px;border:0;color:#425c55}.brand{font-size:24px;letter-spacing:-1px}.brand span{color:#d88c66}.edition{color:#63766b;background:#fffdf6;border:1px solid #dedfd0;border-radius:30px;padding:5px 14px}
main{max-width:1120px}main>nav{border:0;gap:8px;margin:6px 0 0;padding-left:17px}.tab{padding:10px 23px;border:1px solid #cbd6cb;border-bottom:0;border-radius:14px 14px 0 0;background:#e8eee3;color:#64796e;font-size:14px;box-shadow:inset 0 2px #ffffff9c}.tab.active{background:#fffdf7;color:#3d6958;border-color:#cbd6cb;position:relative;z-index:1;top:1px}.tab:hover{background:#f1f6eb}
.character-room{background:#fffdf7;border:1px solid #cbd6cb;border-radius:20px;padding:22px 26px 16px;box-shadow:0 5px 0 #dce4d5,0 12px 30px #53683f08}
.character-room .intro{display:grid;grid-template-columns:1fr 290px 1fr;gap:20px;align-items:center;margin:0;padding:5px 8px 0;min-height:160px;background:radial-gradient(ellipse at center,#f8efcc 0,transparent 67%)}
.room-note{color:#819080;font-size:14px;line-height:1.9;text-align:right}.room-note strong{font-weight:500;color:#647664}.right-note{text-align:left}
.main-slot{position:relative;padding:19px 22px 12px;background:#fffcf0;border:2px solid #e2c785;border-radius:24px;box-shadow:0 4px 0 #eaddb8,inset 0 0 0 4px #fffef7;min-width:0}.main-tag{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:#f2ce80;border:2px solid #fffdf4;color:#735b35;font-size:13px;font-weight:700;border-radius:16px;padding:1px 18px}.main-character{display:flex;align-items:center;gap:17px}.main-character img{flex-shrink:0;filter:sepia(.28) hue-rotate(326deg) saturate(1.3)}.main-character h1{font-size:26px;letter-spacing:-1px;margin:0 0 6px;color:#5c5844}.intro .total{min-width:0;border:0;padding:0;display:grid;gap:0}.intro .total span{font-size:12px;color:#8b8167}.intro .total strong{font-size:16px;color:#776440;font-weight:600}
.union-connection{height:51px;display:flex;align-items:end;justify-content:center;position:relative;margin:0 15%;border-bottom:2px dotted #cbd9c7;padding-bottom:7px}.union-connection:before{content:"";position:absolute;top:3px;height:17px;left:50%;border-left:2px dotted #c0d0ba}.union-connection span{font-size:12px;color:#799071;background:#fffdf7;padding:0 13px;position:relative;bottom:-17px}
.character-room>.section-heading{margin:24px 0 15px;align-items:center}.character-room h2{font-size:19px;color:#486050}.character-room h2 span{display:inline-block;background:#e8eee0;border-radius:12px;padding:0 8px;font-size:13px;color:#62785a}.character-room .section-heading p{font-size:13px;color:#89907e;margin-top:5px}.character-room .primary{background:#73977b;border:1px solid #60826b;border-bottom:3px solid #50705b;border-radius:12px;color:white;padding:8px 15px;font-size:14px;box-shadow:inset 0 1px #b5c9ad}.character-room .primary:hover{background:#628b6c}
.character-room .cards{grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:stretch}.character-room .card{--slot:#eff4e9;--rim:#cfddc5;position:relative;background:#fffef9;border:2px solid var(--rim);border-bottom-width:5px;border-radius:17px;padding:0;min-height:244px;overflow:hidden;transition:transform .15s,box-shadow .15s;box-shadow:inset 0 0 0 3px white}.character-room .card:nth-child(4n+2){--slot:#f7eee2;--rim:#e7d5bb}.character-room .card:nth-child(4n+3){--slot:#edf1fa;--rim:#d0d9ec}.character-room .card:nth-child(4n+4){--slot:#f8eaf0;--rim:#e9ced9}.character-room .card:hover{transform:translateY(-3px);box-shadow:0 5px 12px #6a85641c}.character-room .card.selected{border-color:#a9bb7b;box-shadow:0 0 0 3px #e5eccd;padding:0;background:#fffef9}.slot-stage{position:relative;display:flex;align-items:center;justify-content:center;height:116px;width:100%;background:var(--slot);border-bottom:1px solid var(--rim)}.slot-stage:after{content:"";position:absolute;bottom:11px;left:22%;right:22%;height:14px;border-radius:50%;background:#ffffff95;border:1px solid #00000008}.slot-stage img{position:relative;z-index:1;width:67px;height:76px;margin-top:8px}.card:nth-child(4n+2) .slot-stage img{filter:hue-rotate(280deg)}.card:nth-child(4n+3) .slot-stage img{filter:hue-rotate(85deg)}.card:nth-child(4n+4) .slot-stage img{filter:hue-rotate(170deg)}.character-room .card-index{position:absolute;top:9px;left:11px;font-size:11px;font-weight:700;color:#81907b;letter-spacing:1px}.slot-choice{position:absolute;right:9px;top:8px;font-size:11px;background:#fffdf6;border-radius:8px;padding:1px 7px;color:#61714f}.slot-info{display:grid;padding:11px 13px 12px;gap:5px;width:100%;text-align:center}.character-room .card h3{font-size:16px;color:#52614e;margin:0;line-height:1.4}.character-room .card-time{font-size:13px;color:#78836b;font-weight:400;margin:0}.character-room .card-time strong{font-weight:600;color:#59694f}.character-room .goal-preview{font-size:12px;line-height:1.6;color:#8a8d7a;border-top:1px dashed #e2e5d7;padding-top:7px;margin-top:3px;white-space:pre-wrap}.goal-preview span{display:block;font-size:11px;color:#879375;margin-bottom:2px}.vacant-slot{border:2px dashed #dce2d2;border-radius:17px;min-height:244px;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#f7f8ef88;text-align:center;padding:15px;gap:9px;color:#8c9982}.vacant-slot img{width:61px;height:69px;filter:grayscale(1);opacity:.27}.vacant-slot strong{font-size:14px;font-weight:500}.vacant-slot p{font-size:12px;color:#97a08d}.placeholder-note{text-align:center;font-size:12px;color:#959b87;margin-top:18px}
main>footer{font-size:12px;color:#909480;margin:23px 5px 0;max-width:none}
.character-room .card,.vacant-slot{min-height:202px}.slot-stage{height:96px}.slot-stage img{width:59px;height:67px}.vacant-slot{gap:6px}.vacant-slot img{width:54px;height:61px}
@media(min-width:621px) and (max-width:760px){.character-room .intro{display:flex;justify-content:center;min-height:135px}.room-note{display:none}.main-slot{width:270px}.character-room{padding:20px 20px 14px}.character-room .vacant-slot{padding:10px}.vacant-slot strong{font-size:13px}.vacant-slot p{font-size:12px}}
@media(prefers-reduced-motion:reduce){.character-room .card{transition:none}}
@media(max-width:850px){.character-room .intro{grid-template-columns:1fr 260px 1fr;gap:10px;padding-left:0;padding-right:0}.room-note{font-size:12px}.character-room .cards{grid-template-columns:repeat(3,minmax(0,1fr))}.character-room .vacant-slot:last-child{display:none}.main-slot{padding-left:16px;padding-right:16px}}
@media(max-width:620px){header{padding:18px 20px 13px}.brand{font-size:22px}.edition{display:none}main{padding:0 14px 22px}main>nav{padding-left:12px}.tab{padding:9px 18px}.character-room{padding:20px 14px 14px;border-radius:17px}.character-room .intro{display:flex;justify-content:center;min-height:132px;padding:0}.room-note{display:none}.main-slot{width:254px}.main-character img{width:64px;height:72px}.main-character h1{font-size:24px}.union-connection{height:40px;margin:0 20%}.union-connection:before{height:10px}.character-room .section-heading{gap:8px;margin-top:24px}.character-room h2{font-size:17px}.character-room .section-heading p{font-size:12px;max-width:185px}.character-room .primary{font-size:13px;padding:8px 11px;white-space:nowrap}.character-room .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.character-room .card,.vacant-slot{min-height:228px}.character-room .vacant-slot:last-child{display:flex}.slot-stage{height:104px}.slot-info{padding:10px 8px}.character-room .card h3{font-size:15px}.character-room .card-time{font-size:12px}.placeholder-note{font-size:11px}}
