/* Review of 22 September. Geometry shared across page headers. */
:root{--review-top: max(16px,env(safe-area-inset-top));--review-side:max(16px,env(safe-area-inset-left),env(safe-area-inset-right));--review-head:84px}
html body :is(button,a,label):not(:focus-visible){outline:none}
html body .v2-sprite>.v2-command-art{display:none}
html body :is(#study-close,.v2-study-settings,.pp-header>.back-link,.v2-room-settings,#v2-console-picker>header>.v2-sprite,#settings-dialog .dialog-heading>form,#settings-dialog .dialog-heading>a,.v2-creation-header>a,.v2-account-header>.v2-sprite){position:fixed;top:var(--review-top);left:var(--review-side);right:auto;margin:0;z-index:60;transform:none}
html body :is(.v2-study-settings,.v2-room-settings,#settings-dialog .dialog-heading>a,.v2-account-header>.v2-sprite:last-child){left:auto;right:var(--review-side)}
html body :is(.v2-study-settings,.v2-room-settings){position:fixed!important;top:var(--review-top)!important;left:auto!important;right:var(--review-side)!important}
html body .pp-header .restart-creation{position:fixed;left:var(--review-side);top:calc(var(--review-top) + 64px)}
html body[data-home=true] .app-header{inset:var(--review-top) var(--review-side) auto;height:max(44px,var(--v2-top))}
html body #settings-dialog{width:100vw;height:100dvh;max-width:none;max-height:none;inset:0;margin:0;border:0;padding:var(--review-head) max(20px,calc((100vw - 850px)/2)) 24px;overflow:auto}
html body #settings-dialog .dialog-heading{position:absolute;inset:0 0 auto;margin:0;min-height:0;height:var(--review-head);padding:0}
html body #settings-dialog .dialog-heading h2{position:absolute;top:var(--review-top);left:110px;right:110px;margin:0;text-align:center;line-height:44px}
html body #settings-dialog .dialog-heading form button{margin:0}
html body :is(#auth-dialog,#account-session-dialog)[open],html body .account-card{animation:review-slide-in .25s ease-out}
@keyframes review-slide-in{from{translate:100% 0;opacity:.3}to{translate:0 0;opacity:1}}
html body #language-options .language-option{border-image-source:url('/assets/interface-v2/pastel-ui/blue-normal.png');background:none}
html body #language-options .language-option:hover{border-image-source:url('/assets/interface-v2/pastel-ui/blue-hover.png')}
html body .v2-home-dock [data-sprite=nav-langue]{background:none!important;border:8px solid transparent!important;border-image:url('/assets/interface-v2/pastel-ui/blue-normal.png') var(--native-frame-slice,4) fill / var(--native-frame-corner,8px) / 0 repeat!important;box-sizing:border-box;image-rendering:pixelated;image-rendering:crisp-edges;}
html body .v2-home-dock [data-sprite=nav-langue]:hover{background:none!important;border-image-source:url('/assets/interface-v2/pastel-ui/blue-hover.png')!important}
html body .v2-home-dock [data-sprite=nav-langue]:active{background:none!important;border-image-source:url('/assets/interface-v2/pastel-ui/blue-pressed.png')!important}
html body #language-options img,html body .v2-home-dock [data-sprite=nav-langue]>img{width:48px;height:48px;object-fit:cover;image-rendering:pixelated}
html body #home-screen #language-options .language-option>span{position:absolute;inset:0;min-height:0;height:auto;padding:0;display:grid;place-items:center}
html body #home-screen #language-options .language-option img{width:32px;height:32px;max-width:none;aspect-ratio:1;object-fit:cover;transform:none}
@media(min-width:1200px) and (min-height:700px){html body #home-screen #language-options .language-option img{width:48px;height:48px}}
html body #home-pixelpote-bubble{top:auto;bottom:calc(100% - var(--pp-head-top,7.4%) + 24px);width:700px;max-width:900px;min-width:0;height:auto;min-height:0;padding:24px 32px;background:#fff9f2;border:6px solid #796580;box-shadow:none;transform:translateX(-50%);color:#191722}
html body .pp-dialogue{color:#191722}
/* Typewriter spans, ruby and animated letters follow the bubble's theme. */
html body .pp-dialogue *{color:inherit}
html body .room-speech-layer{position:fixed;inset:0;z-index:1000;pointer-events:none}
html body .room-speech-layer #bubble{position:absolute;max-width:min(340px,calc(100vw - 32px));width:max-content;font-size:24px;transform:translate(-50%,-100%);color:#191722;background:#fff9f2;border:4px solid #796580;padding:12px 18px;box-shadow:none}
html body .room-speech-layer #bubble::after{left:calc(50% - 6px);background:#fff9f2;border-width:0 4px 4px 0}
html body #v2-console-picker{overflow:hidden}
html body .v2-console-content{overflow:hidden;display:flex;flex-direction:column;height:calc(100% - var(--review-head));justify-content:space-between;padding-bottom:24px}
html body #v2-console-picker .v2-console-companion{height:170px;min-height:170px;display:grid;grid-template-columns:112px minmax(0,230px);justify-content:center;gap:16px;margin-top:12px}
html body #v2-console-picker .v2-console-companion button{width:112px;height:170px}
html body #v2-console-picker .v2-console-companion p{position:relative;grid-column:2;grid-row:1;border:4px solid #a58cad;background:#fff9fc;border-radius:8px;padding:12px;font-size:22px}
html body #v2-console-picker .v2-console-companion p::before{content:'';position:absolute;left:-10px;top:50%;width:12px;height:12px;transform:rotate(45deg);background:#fff9fc;border:solid #a58cad;border-width:0 0 4px 4px}
html body #vocabulary-dialog .category-icon{grid-row:1;align-self:center;width:auto;height:auto}
html body #vocabulary-dialog [data-exercise] strong{letter-spacing:.025em;font-weight:700;-webkit-text-stroke:.2px currentColor}
html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion{position:relative;inset:auto;display:grid;grid-template-columns:96px minmax(0,240px);gap:16px;align-items:center;justify-content:center;height:154px;min-height:154px;width:100%;max-width:440px;margin:20px auto 0}
html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion button{position:relative;width:96px;height:144px;max-width:none;overflow:visible}
html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion canvas{width:100%;height:100%;left:0;bottom:0;transform:none;object-fit:contain;object-position:center bottom}
html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion p{grid-column:2;grid-row:1;max-width:none;font-size:22px;background:#fff9fc;border:4px solid #a58cad;padding:12px;border-radius:8px}
html body .v2-study-companion p::after{content:none}
html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion{position:fixed;top:auto;bottom:132px;left:50%;right:auto;transform:translateX(-50%);width:calc(100% - 32px);margin:0}
@media(orientation:portrait) and (max-height:740px){html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion{bottom:112px;height:128px;min-height:128px}html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion button{width:80px;height:120px}}
@media(min-width:700px) and (min-height:700px){html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion{bottom:168px;grid-template-columns:144px minmax(0,280px);height:226px;min-height:226px;max-width:500px}html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion button{width:144px;height:216px}}
@media(orientation:landscape) and (max-height:600px){html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard){width:calc(100% - 190px);margin-left:0}html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion{left:auto;right:20px;bottom:82px;transform:none;width:155px;height:216px;min-height:216px;display:flex;flex-direction:column;gap:6px}html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion button{width:80px;height:120px;flex:none}html body #vocabulary-dialog :is(#exercise-catalog,#fc-dashboard)>.v2-study-companion p{font-size:17px;padding:6px;flex:none}}
html body #vocabulary-dialog #fc-editor-cancel{border:0;border-image:url('/assets/interface-v2/pastel-ui/lavender-normal.png') var(--native-frame-slice,4) fill / var(--native-frame-corner,8px) / 0 repeat;border-image-width:var(--native-frame-corner,8px);background:none;color:#251d2d;box-shadow:none;padding:10px 16px;font:inherit;text-decoration:none;image-rendering:pixelated;image-rendering:crisp-edges;}
html body #vocabulary-dialog :is(.dictionary-kana-filters,.kana-study-actions){display:contents;margin:0}
html body #vocabulary-dialog #kana-library{display:grid;grid-template-columns:120px minmax(0,1fr);gap:8px 16px;align-content:start}
html body #kana-library>.dictionary-kana-filters>.check-option,html body #kana-library .kana-study-actions>.check-option{grid-column:2;margin:0;align-self:center;font-size:17px;gap:8px}
html body #vocabulary-dialog #review-dictionary-kana{grid-column:1;grid-row:1/4;flex-direction:column;min-width:0;min-height:116px;gap:4px;margin:0}
html body #kana-library :is(#kana-reference-grid,.keyboard-note){grid-column:1/-1}
@media(orientation:landscape) and (max-height:600px){html body #vocabulary-dialog #kana-library{grid-template-columns:100px repeat(3,minmax(0,1fr));gap:8px 12px}html body #vocabulary-dialog #review-dictionary-kana{grid-row:1;min-height:76px;gap:0}html body #review-dictionary-kana img{width:44px;height:44px}html body #vocabulary-dialog #kana-library .check-option{grid-column:auto;grid-row:1;font-size:17px}html body #vocabulary-dialog #kana-view .library-tabs{margin-bottom:8px}}
html:has(body[data-home=false]){height:100%;overflow:hidden;overscroll-behavior:none}
html body[data-home=false]{position:fixed;inset:0;width:100%;height:100dvh;overflow:hidden;overscroll-behavior:none}
html body[data-home=false] #workspace{touch-action:none;overscroll-behavior:none}
html body #toggle-mobile-reader{touch-action:none!important}
html body #v2-reading-paper{touch-action:pan-y;overscroll-behavior:contain}
html body #discovery-detail .dex-character{font-family:'Yu Gothic',Meiryo,system-ui,sans-serif;font-weight:500;-webkit-text-stroke:0;text-shadow:none}
html body #discovery-detail .dex-slide-track{display:grid;grid-template-columns:repeat(3,100%);width:100%;align-items:start;transform:translateX(-100%);will-change:transform}
html body #discovery-detail .dex-slide-page{min-width:0;width:100%}
html body #discovery-detail .dex-slide-page .dex-content{width:100%;box-sizing:border-box}
@media(pointer:fine){html body #discovery-detail .dex-edge{display:grid;width:52px;height:64px;top:calc(50% - 32px);bottom:auto;z-index:10;background:#e4d5ef;border:3px solid #9880aa;border-radius:8px;color:#30243b}html body #discovery-detail .dex-edge svg{opacity:1}html body #discovery-detail .dex-edge:disabled{visibility:hidden}}
html body #dictionary-kana-panel .check-option{margin:0;gap:8px;font-size:17px;white-space:normal}
html body #review-dictionary-kana{display:flex;align-items:center;justify-content:center;gap:8px;min-width:140px;min-height:80px;margin:0;--frame:url('/assets/interface-v2/pastel-ui/mint-normal.png')}
html body #review-dictionary-kana img{width:64px;height:64px;filter:hue-rotate(285deg);object-fit:contain}
html body #vocabulary-dialog :is(.context-favorite,.favorite-button,[data-favorite]){border:0;border-image:none;box-shadow:none;background:none}
html body .home-status{top:var(--review-top)}
html body .wallet{position:fixed;left:50%;right:auto;top:calc(var(--review-top) + 70px);transform:translateX(-50%);margin:0;z-index:26}
html body .collection-panel{top:calc(var(--review-top) + 120px);bottom:auto;height:min(384px,calc(100dvh - 280px));background:#f7eefb;border:4px solid #a990b7;border-image:none;border-radius:8px;isolation:isolate;overflow:auto}
html body #panel :is(.owned-clothes button>span,.furniture-card>span:not(.furniture-thumbnail),.room-choice>span,.home-shop h3){position:absolute;clip-path:inset(50%);width:1px;height:1px;overflow:hidden;padding:0;margin:0}
html body .collection-panel :is(.outfit-choice,.furniture-item){justify-content:center;align-items:center}
@media(orientation:portrait) and (max-width:699px){html body #panel.collection-panel{height:min(284px,calc(100dvh - 370px));padding:12px;top:132px}html body #panel :is(.owned-clothes button,.furniture-card,.home-shop article){height:100px;min-height:100px;padding:6px}html body #panel .owned-clothes canvas{height:84px;width:auto;max-width:100%;object-fit:contain}html body #panel .furniture-thumbnail{height:80px}html body #panel .home-shop canvas{height:54px;width:54px}html body #panel .home-shop .button{min-height:24px;padding:2px;font-size:16px}}
html body #review-dialog{position:fixed;inset:0;margin:auto;width:min(760px,100vw);height:100dvh;max-height:100dvh;max-width:none;padding:64px 18px 12px;display:none;grid-template-rows:44px 48px minmax(80px,1fr) auto minmax(44px,auto) auto;gap:6px;overflow:hidden;background:#f6edff;box-shadow:none}
html body #review-dialog[open]{display:grid}
:where(#review-dialog)>*{grid-column:1}
html body #review-dialog .dialog-top{grid-row:1;justify-content:center;position:relative}
html body #review-dialog .dialog-top h2{font-size:30px;margin:0}
html body #review-progress{grid-row:2;display:flex;justify-content:center;gap:12px;margin:0;font-size:38px;line-height:1;color:inherit}
.daily-star{display:block;flex:none;width:1em;height:1em;object-fit:contain;image-rendering:pixelated}.daily-star.grey{filter:grayscale(1)}
html body #review-dialog .review-companion{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:min(460px,calc(100% - 32px));z-index:5;display:block;pointer-events:none}
html body #review-dialog .review-companion canvas{display:none}
html body #review-message{font:700 22px/1.15 PixelUI;color:#191722;background:#fffaf4;border:4px solid #917c9e;padding:10px 16px;margin:0;text-align:center;border-radius:8px}
html body #review-dialog #review-prompt{grid-row:3;display:flex;align-items:center;justify-content:center;margin:0;font:500 clamp(64px,14vh,128px)/1.1 'Yu Gothic',Meiryo,sans-serif;text-align:center;color:#211c2b;min-height:0;overflow-wrap:anywhere}
html body #review-answer-form{grid-row:4;align-self:end;margin:0}
html body #review-answer-label{display:block;text-align:center;font:700 22px/1.2 PixelUI;margin-bottom:8px}
html body .review-answer-row{display:flex;gap:8px}
html body #review-answer{font:24px/1.2 'Noto Sans JP',sans-serif;min-width:0;width:100%;height:46px}
html body #review-answer-submit{height:46px;min-height:46px;flex:none;padding:4px 14px;font-size:20px}
html body #review-feedback{grid-row:5;margin:0;font:700 24px/1.25 PixelUI;text-align:center;align-self:center;color:#fff;-webkit-text-stroke:3px #30243b;paint-order:stroke fill}
html body #review-next{grid-row:5;width:auto;justify-self:end;align-self:end;margin-top:48px;font-size:22px;padding:4px 14px;z-index:2}
html body #review-context{display:none}
.daily-keyboard-slot{grid-row:6;min-height:320px;height:320px;display:flex;align-items:end}
html body #review-dialog[data-state=complete] #review-context,html body #review-dialog[data-state=reward] #review-context{display:block;grid-row:3;text-align:center;font:700 26px/1.2 PixelUI;align-self:start}
html body #review-dialog[data-state=complete] #review-prompt{font:700 44px/1.2 PixelUI;grid-row:4}
html body #review-dialog[data-state=complete] #review-feedback{font-size:20px;-webkit-text-stroke:0;color:#33273d}
html body #review-dialog[data-state=complete] #review-next{grid-row:6;margin:0;justify-self:center}
.daily-reveal{grid-row:3/6;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:12px;margin-top:60px}
html body #review-dialog .daily-mystery-card{display:grid;place-items:center;width:180px;height:240px;background:#302d38;border:6px solid #7b7285;border-radius:10px;color:#fff;font:700 100px/1 'Yu Gothic',sans-serif;box-shadow:0 6px #211d27;animation:review-slide-in .5s ease-out}
html body #review-dialog .daily-mystery-card.is-revealed{background:#c5ead8;color:#211c2b;font-weight:500;overflow-wrap:anywhere;font-size:clamp(30px,10vw,96px)}
html body #review-dialog .daily-mystery-card.is-revealed[lang=ja]{font-size:96px}
.daily-white-flash{position:fixed;inset:0;background:white;z-index:10000;pointer-events:none}
@media(pointer:fine){html:not([data-qa-touch]) #review-dialog:not(.has-pixel-keyboard) .daily-keyboard-slot{min-height:320px}}
@media(orientation:landscape) and (max-height:600px){html body #review-dialog{width:100vw;padding:8px 16px;grid-template-columns:minmax(180px,1fr) minmax(350px,1.5fr);grid-template-rows:38px 42px minmax(0,1fr) 46px;gap:6px 16px}html body #review-dialog .dialog-top{grid-column:1}html body #review-progress{grid-column:1}html body #review-prompt{grid-column:1;font-size:96px}html body #review-answer-form{grid-column:2;grid-row:1/3;align-self:start}html body #review-answer-label{font-size:18px}.daily-keyboard-slot{grid-column:2;grid-row:3/5;min-height:0;align-self:end}html body #review-feedback{grid-column:1;grid-row:4;font-size:19px}html body #review-next{grid-column:2;grid-row:4;align-self:end;margin:0}html body #review-dialog .review-companion{top:48px;left:24%;width:40%}html body #review-message{font-size:17px;padding:6px}.daily-reveal{grid-column:2;grid-row:1/5;margin:0}html body #review-dialog .daily-mystery-card{height:230px}html body #review-dialog[data-state=complete] #review-context{grid-column:1;grid-row:3}html body #review-dialog[data-state=complete] #review-prompt{grid-column:2;grid-row:2/4}html body #review-dialog[data-state=complete] #review-next{grid-column:2;grid-row:4}}
@media(min-width:1200px) and (min-height:700px){:root{--review-top:max(24px,env(safe-area-inset-top));--review-side:28px;--review-head:120px}html body .v2-home-dock [data-sprite=nav-langue]>img{width:64px;height:64px}html body .collection-panel{height:calc(100dvh - 300px)}html body .wallet{top:calc(var(--review-top) + 100px)}}
@media(orientation:landscape) and (max-height:600px){:root{--review-top:max(10px,env(safe-area-inset-top));--review-head:64px}html body #v2-console-picker .v2-console-companion{display:none}html body .v2-console-content{padding:8px 24px;justify-content:start}html body #v2-console-picker [data-system]{min-height:68px}html body .wallet{top:var(--review-top);left:calc(50% + 180px)}html body .collection-panel{top:72px;height:calc(100dvh - 164px);width:min(430px,52vw)}}
@media(prefers-reduced-motion:reduce){html body #auth-dialog[open]{animation:none}}
@media(orientation:landscape) and (max-height:600px){html body #review-dialog .daily-keyboard-slot{height:auto;min-height:0}html body .wallet{left:50%;top:calc(var(--review-top) + 50px)}}
@media(orientation:landscape) and (max-height:600px){html body #review-dialog[data-state=review] #review-prompt{font-size:128px}html body #review-dialog #review-feedback{font-size:24px}}
@media(prefers-reduced-motion:reduce){html body :is(#auth-dialog,#account-session-dialog)[open],html body .account-card{animation:none}}
html body .wallet{top:calc(var(--review-top) + 82px)}
@media(orientation:portrait) and (max-width:699px){html body #panel.collection-panel{top:154px;height:min(268px,calc(100dvh - 390px))}}
@media(orientation:landscape) and (max-height:600px){html body .wallet{top:calc(var(--review-top) + 72px)}}
@media(min-width:1200px) and (min-height:700px){html body .wallet{top:calc(var(--review-top) + 112px)}}
