:root{font-family:Microsoft YaHei,sans-serif;color:#455575;background:#edf4ff}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 25% 30%,#fff 0,#eef6ff 42%,#eeeafa);min-height:100dvh}header{max-width:1300px;margin:auto;padding:18px 28px;display:flex;align-items:center;justify-content:space-between}h1{font-size:23px;margin:4px 0}small,.note{color:#78869c}a{color:#596e98}main{max-width:1300px;margin:auto;display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:24px;padding:0 28px 24px}.stage{height:calc(100dvh - 105px);min-height:490px;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:32px;background:radial-gradient(ellipse at 50% 45%,#fffa,#dcefff33 65%,#ece6fc44);position:relative}.stage canvas{display:block;height:90%;max-width:100%;object-fit:contain;width:auto;aspect-ratio:2/3}.stage p{font-size:13px;margin:4px 10px;text-align:center}aside{align-self:center;padding:22px;background:#ffffff75;border:1px solid #fff9;border-radius:24px;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}h2{font-size:16px;font-weight:500;margin:10px 0 16px}.dresses{display:grid;grid-template-columns:1fr 1fr;gap:12px}button,a#download{font:inherit;border:1px solid #ffffffc0;border-radius:16px;padding:12px;color:#526889;background:#fff9;cursor:pointer;min-height:48px;text-decoration:none}button:hover{background:#fff}button[aria-pressed=true]{border-color:#92b9e9;background:#e6f2ff}.dresses img{width:100%;height:110px;object-fit:contain;display:block}.dresses span{font-size:14px}.accessories{display:flex;gap:14px;flex-wrap:wrap;margin:22px 0}.accessories label{display:flex;align-items:center;gap:5px;min-height:44px;font-size:14px}input{accent-color:#8baadd;width:20px;height:20px}.actions{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.actions button{font-size:14px;flex:1}.favorites{display:flex;flex-wrap:wrap;gap:8px}.favorites button{padding:5px;width:85px;font-size:12px}.favorites canvas{width:66px;height:99px;display:block;margin:auto}.note{font-size:12px;line-height:1.8;margin-bottom:0}dialog{border:1px solid white;border-radius:24px;background:#f5f8ff;padding:20px;max-width:90vw}dialog::backdrop{background:#44516b88}dialog img{display:block;height:60dvh;max-width:100%;object-fit:contain;margin:auto}@media(max-width:700px){header{padding:12px 16px}h1{font-size:18px}header a{font-size:13px}main{display:flex;flex-direction:column;gap:12px;padding:0 12px 20px}.stage{height:72dvh;min-height:380px;width:100%}aside{width:100%;padding:16px}.dresses img{height:85px}.accessories{margin:12px 0}h2{margin-top:4px}}#categories{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:18px}#categories button{padding:8px;font-size:14px}.dresses{max-height:345px;overflow:auto;padding:2px}.favorites{max-height:160px;overflow:auto}@media(max-width:700px){.dresses{grid-template-columns:repeat(3,1fr);max-height:240px}#categories{grid-template-columns:repeat(6,1fr);gap:3px}#categories button{font-size:12px;padding:5px}}.portrait{height:90%;aspect-ratio:2/3;max-width:100%;position:relative;overflow:hidden;border-radius:24px}.stage .portrait canvas{height:100%;width:100%;position:absolute;top:0;right:0;bottom:0;left:0;object-fit:contain}#magic{pointer-events:none}.preferences{display:flex;gap:12px;align-items:center;flex-wrap:wrap;justify-content:flex-end}.preferences label{display:flex;align-items:center;font-size:13px}.symbol{height:100px;display:grid;place-items:center;font-size:38px;color:#9bb4d6}#categories{grid-template-columns:repeat(4,1fr)}#princess{animation:breathe 6s ease-in-out infinite}@keyframes breathe{50%{transform:translateY(-1.5px)}}@media(max-width:700px){.preferences{gap:6px;max-width:50%}.preferences input{width:18px;height:18px}header{align-items:flex-start}.stage{height:70dvh}#categories{grid-template-columns:repeat(4,1fr)}.symbol{height:80px}.portrait{border-radius:20px}}.portrait.sparkle:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:radial-gradient(circle at 28% 38%,#fff9 0,transparent 3%),radial-gradient(circle at 75% 64%,#fff9 0,transparent 3%),radial-gradient(circle at 40% 82%,#f8e5ff99 0,transparent 4%);animation:dress-sparkle .55s ease-out both}@keyframes dress-sparkle{0%{opacity:0}35%{opacity:1}to{opacity:0}}.item-section{grid-column:1/-1;font-size:13px;font-weight:500;color:#7587a2;margin:8px 2px 0}@media(max-width:700px){.stage{height:min(70dvh,calc((100vw - 24px)*1.5 + 36px));min-height:380px}.portrait{height:auto;width:min(100%,calc((70dvh - 36px)*2/3))}}header{height:76px;padding:10px 24px}h1{font-size:22px}main{height:calc(100dvh - 76px);padding-bottom:12px}.stage{height:100%;min-height:0;overflow:hidden}.portrait{height:94%;width:auto}.stage p{position:absolute;bottom:1px;left:0;right:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px;pointer-events:none}#face-zoom{position:absolute;right:8px;top:8px;min-height:44px;font-size:12px}.face-view canvas{transform:scale(3.2);transform-origin:50% 14%}.face-view #princess{animation:none}#princess{animation:breathe-fixed 6s ease-in-out infinite}@keyframes breathe-fixed{50%{translate:0 -1.5px}}.motion-off #princess{animation:none}.settings{position:relative}.settings summary{display:flex;align-items:center;min-height:44px;font-size:13px;cursor:pointer}.preferences{position:absolute;right:0;top:44px;background:#f8fbff;border:1px solid white;border-radius:14px;padding:12px;min-width:180px;z-index:20;display:grid;max-width:none;gap:4px;box-shadow:0 5px 24px #7186ac20}.preferences label{min-height:44px}.preferences small{font-size:12px}aside{max-height:100%;min-height:0;overflow:hidden;display:grid;grid-template-rows:auto auto minmax(90px,1fr) auto auto;padding:16px}#categories{display:flex;overflow-x:auto;gap:5px;margin:0;padding:2px 0 6px;overscroll-behavior-x:contain;scrollbar-width:thin}#categories button{flex:0 0 auto;min-width:60px;min-height:44px;font-size:13px}.wardrobe-tools{display:flex;align-items:center;gap:6px;margin:5px 0}.wardrobe-tools h2{flex:1;white-space:nowrap;font-size:13px;margin:0}.wardrobe-tools select,.wardrobe-tools input{min-height:44px;font:inherit;font-size:12px;border:1px solid white;border-radius:12px;background:#fff9;color:#526889;padding:5px}.wardrobe-tools select{max-width:95px}.wardrobe-tools input{width:86px;min-width:0}.dresses{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;align-content:start;max-height:420px;overscroll-behavior:contain}.dresses button{min-width:0;padding:5px;touch-action:manipulation}.dresses img,.symbol{height:90px}.dresses span{font-size:12px;line-height:1.4;display:block;overflow-wrap:anywhere}.actions{margin:6px 0}.saved{max-height:220px;overflow:auto;font-size:13px}.saved summary{min-height:30px;padding:5px;cursor:pointer}.accessories{margin:6px 0}.favorites{max-height:180px}.note{margin:6px 0}.settings summary:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #8ea8e0;outline-offset:2px}button:disabled{opacity:.45}dialog{width:min(500px,94vw);max-height:92dvh;overflow:auto}dialog img{width:100%;height:65dvh}@media(max-width:700px){body{height:100dvh;overflow:hidden;padding-top:env(safe-area-inset-top)}header{height:62px;padding:7px 12px;gap:5px;align-items:center}h1{font-size:17px;margin:0 0 4px}#inventory{font-size:10px;display:block}main{height:calc(100dvh - 62px - env(safe-area-inset-top));padding:0 8px env(safe-area-inset-bottom);display:grid;gap:5px;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(180px,1fr) minmax(232px,40%)}.stage{width:100%;height:100%;min-height:0;border-radius:20px}.portrait{height:94%;width:auto;max-width:100%;max-height:calc((100vw - 16px)*1.5);border-radius:18px}aside{align-self:stretch;width:100%;padding:6px 8px;border-radius:18px 18px 0 0;grid-template-rows:50px 44px minmax(60px,1fr) 52px 30px}#categories{padding:1px 0 5px;gap:4px}#categories button{min-width:58px;font-size:12px;padding:6px}.wardrobe-tools{margin:0}.wardrobe-tools h2{font-size:12px}.dresses{max-height:none;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px}.dresses img,.symbol{height:64px}.dresses span{font-size:11px}.dresses button{min-height:92px}.actions{margin:4px 0}.saved[open]{position:fixed;z-index:12;left:8px;right:8px;bottom:env(safe-area-inset-bottom);max-height:55dvh;padding:12px;background:#f4f7ff;border:1px solid white;border-radius:18px;box-shadow:0 -8px 32px #7b86a722}.saved summary{font-size:12px}.stage p{font-size:10px}.preferences{max-width:none;top:44px}dialog .actions{flex-wrap:wrap}dialog .actions button,dialog .actions a{min-width:90px}}@media(max-width:350px){.dresses{grid-template-columns:repeat(3,minmax(0,1fr))}h1{font-size:15px}.wardrobe-tools input{width:72px}#inventory{font-size:9px}}@media(max-height:520px)and (orientation:landscape){header{height:54px;padding:4px 12px}main{height:calc(100dvh - 54px);display:grid;grid-template-columns:1fr 1fr;grid-template-rows:minmax(0,1fr);padding:0 8px 4px;gap:8px}aside{align-self:stretch;padding:5px;grid-template-rows:48px 44px minmax(50px,1fr) 50px 28px}.stage{min-height:0}.dresses img,.symbol{height:55px}.dresses{max-height:none;grid-template-columns:repeat(4,minmax(0,1fr))}.dresses button{min-height:82px}}@media(prefers-reduced-motion:reduce){#princess{animation:none}}@media(max-width:700px){main{grid-template-rows:minmax(180px,1fr) minmax(270px,40%)}}@media(max-height:520px)and (orientation:landscape){main{grid-template-rows:minmax(0,1fr)}}@media(max-width:700px){#categories{overflow-y:hidden;scrollbar-width:none}#categories::-webkit-scrollbar{display:none}}@media(max-width:350px){main{grid-template-rows:minmax(180px,1fr) minmax(284px,40%)}}.stage-tools{position:absolute;top:8px;left:8px;display:flex;gap:5px}.stage-tools button{font-size:12px;min-height:44px;padding:7px 10px}.history-tools{position:absolute;bottom:16px;left:8px;display:flex;gap:5px}.history-tools button{min-width:44px;min-height:44px;padding:5px;font-size:23px;background:#ffffffb0}.dialog-heading{display:flex;align-items:center;justify-content:space-between;gap:8px}.dialog-heading h2{margin:0;font-size:17px}.dialog-heading button{font-size:12px}.journey-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.journey-card{font-size:13px;min-height:64px;padding:8px}#play-dialog h3{font-size:16px;font-weight:500}#play-dialog p{font-size:13px;line-height:1.7}#journey-badges{font-size:25px;min-height:38px}#style-locks{display:grid;grid-template-columns:repeat(2,1fr);gap:3px}#style-locks label{display:flex;align-items:center;min-height:44px;font-size:13px;gap:6px}.lock-settings summary{cursor:pointer;padding:10px 0;min-height:44px;font-size:13px}#volume-dialog{width:min(720px,96vw);padding:12px}#volume-host{height:min(60dvh,650px);width:100%;border-radius:18px;overflow:hidden;position:relative;background:#eef3fc}#volume-host canvas{display:block;width:100%;height:100%}.volume-note{font-size:12px;line-height:1.5;color:#718097;margin:6px 0}#volume-status{font-size:12px;text-align:center;min-height:18px;margin:4px}.rotation-controls{display:flex;gap:6px;align-items:center}.rotation-controls label{display:flex;flex:1;gap:6px;font-size:12px;align-items:center}.rotation-controls input{width:100%;min-width:45px;min-height:44px}.rotation-controls button{font-size:12px;padding:7px}#volume-dialog .actions button{font-size:12px;min-width:100px}.favorite-card{display:flex;flex-direction:column;width:85px}.favorite-card .remove-favorite{font-size:11px;min-height:32px;padding:3px;width:85px;background:transparent}@media(max-width:350px){.stage-tools button{padding:5px 7px;font-size:11px}.stage-tools{gap:3px}.history-tools{bottom:12px}.history-tools button{font-size:18px;min-width:38px}.journey-cards{grid-template-columns:repeat(2,minmax(0,1fr))}#volume-host{height:48dvh}}@media(max-height:520px)and (orientation:landscape){#volume-host{height:53dvh}#volume-dialog .actions{flex-wrap:nowrap}#volume-dialog .actions button{min-width:0;font-size:11px}}.harmonious-setting{display:flex;align-items:center;gap:7px;min-height:44px;font-size:12px;line-height:1.5}@media(max-width:700px){#volume-host{height:min(52dvh,560px)}}@media(max-width:350px){#volume-host{height:44dvh}.history-tools button{min-width:44px}}.rotation-controls label{white-space:nowrap}.dialog-heading{position:sticky;top:0;background:#f5f8ff;z-index:2;padding-bottom:4px}@media(max-height:520px)and (orientation:landscape){#volume-dialog[open]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px}#volume-dialog .dialog-heading,#volume-dialog .volume-note{grid-column:1/-1}#volume-host{grid-column:1;grid-row:3/span 3;height:58dvh}#volume-status{grid-column:2;grid-row:3}.rotation-controls{grid-column:2;grid-row:4}#volume-dialog .actions{grid-column:2;grid-row:5;flex-wrap:wrap;margin:0}#volume-dialog .actions button{flex-basis:calc(50% - 4px);min-width:0;font-size:11px}}.dresses{grid-auto-rows:max-content;align-items:start}.dresses button{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:5px;min-height:130px;overflow:hidden}.dresses button img,.dresses button .symbol{flex:0 0 90px;height:90px;width:100%;max-width:100%;object-fit:contain}.dresses button span{flex:0 0 auto;width:100%;min-height:34px;text-align:center;line-height:17px}.stage-tools button[hidden]{display:none}@media(max-width:700px){.dresses button{min-height:108px}.dresses button img,.dresses button .symbol{flex-basis:64px;height:64px}.dresses button span{min-height:30px;line-height:15px}}@media(max-height:520px)and (orientation:landscape){.dresses button{min-height:98px}.dresses button img,.dresses button .symbol{flex-basis:55px;height:55px}}.inspiration{padding:12px;margin:12px 0;background:#fff9;border-radius:16px}.photo-tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:10px 0}.photo-tools label{display:flex;gap:5px;align-items:center;font-size:13px}.photo-tools select{min-height:44px;border:1px solid white;border-radius:10px;font:inherit;color:#526889;background:#fff;padding:5px}.photo-tools button{font-size:13px}.face-view canvas{transform-origin:50% 0%}