*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,textarea{font:inherit}.add-bottom{display:block;width:100%;margin-top:12px;border:2px dashed #cdbbd5;background:#f2eaf5;color:#741495;padding:12px;border-radius:10px;font-weight:800;cursor:pointer}.add-bottom:disabled{opacity:.45;cursor:not-allowed}.member-check{padding:12px 14px!important;margin:12px 0 4px!important;background:#f3eaf7;border:1px solid #ded0e4;border-radius:9px}.member-check input[type=checkbox]{position:static!important;opacity:1!important;width:20px!important;height:20px!important;margin:0!important;accent-color:#8f18b2;cursor:pointer}.extra-fields{margin-top:2px;padding-top:5px;border-top:1px dashed #e0d4e4}.birth-field{padding:0;border:0;margin:12px 0}.birth-field legend{font-size:.8rem;font-weight:800;color:#44324b}.date-selects{display:grid;grid-template-columns:.7fr 1.35fr 1fr;gap:8px}.date-selects select{margin-top:6px}@media(max-width:420px){.date-selects{grid-template-columns:1fr 1fr}.date-selects select:last-child{grid-column:1/-1}}body .story-intro .character{filter:none;border-radius:18px}body .game-intro.story-intro{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px;overflow:hidden;background:radial-gradient(circle at 50% 52%,#7b1bb3 0,#2b0748 46%,#10021b 78%);animation:intro-story-out .45s 5.1s both!important}.story-heading{position:relative;z-index:4;text-align:center}.story-heading small{display:block;color:#31e5ff;font-weight:900;letter-spacing:.2em;font-size:.65rem}.story-heading strong{display:block;margin-top:5px;color:#fff;font-size:clamp(1.15rem,4vw,2rem);letter-spacing:.03em;text-shadow:3px 3px #d800bd}.character-stage{position:relative;width:min(76vw,330px);height:min(58vh,500px);margin:4px auto}.character{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 18px 25px rgba(0,0,0,.6))}.school-character{animation:school-change 5.2s both}.party-character{opacity:0;animation:party-arrives 5.2s both}.magic-change{position:absolute;z-index:3;left:50%;top:48%;width:120px;height:120px;transform:translate(-50%,-50%) scale(0);border-radius:50%;background:#fff;box-shadow:0 0 30px #fff,0 0 70px #22dfff,0 0 110px #f000cf;animation:magic-pop 5.2s both}.magic-change i{position:absolute;inset:-25px;border:4px solid #2ee9ff;border-radius:28%;animation:magic-ring .7s linear infinite}.magic-change i:nth-child(2){inset:-48px;border-color:#ff32d1;animation-direction:reverse}.magic-change i:nth-child(3){inset:-70px;border-color:#ffd82d}.magic-change span{display:grid;place-items:center;height:100%;font-size:3rem;color:#8713bd}.school-label,.party-label{position:absolute;z-index:5;left:50%;bottom:5px;transform:translate(-50%);padding:7px 13px;border-radius:50px;color:#fff;background:#112c77;border:1px solid #47dfff;font-size:.7rem;font-weight:900;white-space:nowrap}.school-label{animation:school-label 5.2s both}.party-label{opacity:0;background:#d70cae;border-color:#ffda29;animation:party-label 5.2s both}.story-copy{position:relative;z-index:4;height:28px!important;margin:0!important;text-align:center}.story-copy span,.story-copy b{position:absolute;left:50%;transform:translate(-50%);width:90vw;max-width:500px;color:#ded2e7}.story-copy span{animation:copy-one 5.2s both}.story-copy b{opacity:0;color:#ffdf30;animation:copy-two 5.2s both}.story-intro>button{position:relative;z-index:5;margin-top:12px!important}@keyframes school-change{0%,30%{opacity:1;transform:translate(0) rotate(0) scale(1)}42%{opacity:0;transform:rotate(12deg) scale(.15)}}@keyframes party-arrives{0%,43%{opacity:0;transform:rotate(-12deg) scale(.15)}54%,to{opacity:1;transform:rotate(0) scale(1)}}@keyframes magic-pop{0%,28%,58%,to{transform:translate(-50%,-50%) scale(0);opacity:0}38%,48%{transform:translate(-50%,-50%) scale(1);opacity:1}}@keyframes magic-ring{to{transform:rotate(180deg)}}@keyframes school-label{0%,30%{opacity:1}40%,to{opacity:0}}@keyframes party-label{0%,51%{opacity:0}58%,to{opacity:1}}@keyframes copy-one{0%,30%{opacity:1}40%,to{opacity:0}}@keyframes copy-two{0%,48%{opacity:0}56%,to{opacity:1}}@keyframes intro-story-out{to{opacity:0;visibility:hidden}}@media(max-width:480px){.character-stage{width:min(85vw,310px);height:min(56vh,450px)}.story-heading strong{font-size:1.05rem}}