:root{--ink:#22201d;--muted:#656260;--muted-soft:#8f8c89;--paper:#fff;--paper-deep:#fbfaf9;--paper-muted:#f3f1f1;--line:#0000000f;--line-strong:#0000001f;--success:#30a46c;--success-strong:#2b9a66;--success-deep:#218358;--success-soft:#0596692b;--success-soft-strong:#0596693b;--danger:#e33a5c;--danger-strong:#ce274a;--danger-deep:#ca244d;--danger-soft:#e11d482b;--danger-soft-strong:#e11d483b;--info-soft:#006eff3b;--photo-text:#fffcf7f5;--photo-subtext:#fffcf7b8;--shadow:0 14px 44px #0000001f, 0 3px 9px #0000001f;--font:"Gen Interface JP", -apple-system, "system-ui", "Hiragino Sans", "Yu Gothic", sans-serif;color:var(--ink);background:var(--paper);font:15px/1.45 var(--font);letter-spacing:0;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}html{overscroll-behavior:none;width:100%;height:100%;min-height:100%;overflow:hidden}body{overscroll-behavior:none;background:var(--paper);width:100%;min-width:0;height:100%;min-height:100%;margin:0;overflow:hidden}button{appearance:none;font:inherit;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent}button:focus{outline:none}#app{overscroll-behavior:none;width:100%;height:100%;overflow:hidden}.app-shell{-webkit-user-select:none;user-select:none;overscroll-behavior:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;grid-template-rows:auto minmax(0,1fr) auto;gap:16px;width:min(100vw,430px);max-width:100vw;height:100dvh;min-height:0;margin:0 auto;padding:18px 18px 24px;display:grid;overflow:hidden}@supports (overflow:clip){html,body,#app,.app-shell{overflow:clip}}.topbar{justify-content:space-between;align-items:center;min-height:42px;display:flex}.icon-button{border:1px solid var(--line);color:#22201db8;cursor:pointer;background:#ffffffb8;border-radius:8px;place-items:center;width:36px;height:36px;transition:transform .16s,border-color .16s,background .16s;display:inline-grid}.icon-button:hover{border-color:var(--line-strong);background:#fffffff2;transform:translateY(-1px)}.icon-button:focus-visible,.active-card:focus-visible,.action:focus-visible,.refresh-button:focus-visible,.clear-button:focus-visible{outline:2px solid var(--info-soft);outline-offset:3px}.icon-button.quiet{opacity:.62}.progress-wrap{justify-items:start;gap:7px;min-width:160px;display:grid}.progress-text{color:#22201d75;font-size:12px;font-weight:500}.progress-track{background:var(--line);border-radius:3px;width:160px;height:3px;overflow:hidden}.progress-fill{border-radius:inherit;background:var(--success);height:100%;transition:width .32s;display:block}.deck{isolation:isolate;align-self:center;place-items:center;width:100%;height:100%;min-height:0;display:grid;position:relative}.card{--card-width:min(100%, 354px);--card-height:min(548px, calc(100dvh - 212px));--card-radius:8px;--card-x:0px;--card-y:0px;--card-rotate:0deg;--card-scale:1;--card-opacity:1;width:var(--card-width);height:var(--card-height);margin-top:calc(var(--card-height) / -2);margin-left:calc(var(--card-width) / -2);transform-origin:50% 76%;backface-visibility:hidden;-webkit-user-select:none;user-select:none;will-change:transform, opacity;-webkit-tap-highlight-color:transparent;background:0 0;border:0;position:absolute;top:50%;left:50%;overflow:visible}.active-card{z-index:4;cursor:grab;touch-action:none;isolation:isolate;opacity:var(--card-opacity);transform:translate3d(var(--card-x), var(--card-y), 0) rotate(var(--card-rotate)) scale(var(--card-scale));outline:none;transition:transform .3s cubic-bezier(.3,.05,.2,1),opacity .18s cubic-bezier(.22,.61,.36,1) 80ms;display:block}.active-card:active{cursor:grabbing}.active-card.is-dragging,.active-card.is-promoting-card{transition:none}.active-card.card-exiting .spoiler-dot{animation-play-state:paused}.card-surface{border-radius:var(--card-radius);background:var(--paper-muted);backface-visibility:hidden;width:100%;height:100%;position:relative;overflow:hidden;transform:translateZ(0);box-shadow:0 0 0 1px #22201d14,inset 0 0 0 1px #ffffff8a,0 16px 44px #22201d1c,0 3px 9px #22201d1a}.active-card-surface:before{content:"";z-index:1;border-radius:inherit;pointer-events:none;background:linear-gradient(#1915110a 0%,#19151105 36%,#19151138 58%,#191511c7 100%);position:absolute;inset:0}.card-ghost{z-index:1;pointer-events:none;opacity:.58;transition:opacity .24s cubic-bezier(.2,.82,.18,1),transform .23s cubic-bezier(.2,.82,.18,1)}.card-ghost .card-surface{box-shadow:0 0 0 1px #22201d0f,0 12px 30px #22201d17,0 2px 6px #22201d14}.card-ghost .card-surface:before{content:"";z-index:1;border-radius:inherit;opacity:0;pointer-events:none;will-change:opacity;background:linear-gradient(#1915110a 0%,#19151105 36%,#19151138 58%,#191511c7 100%);transition:opacity .22s cubic-bezier(.2,.82,.18,1);position:absolute;inset:0}.card-ghost .card-surface:after{content:"";z-index:2;opacity:1;pointer-events:none;will-change:opacity;background:linear-gradient(#ffffff47,#ffffffb3),#f3f1f157;transition:opacity .25s cubic-bezier(.2,.82,.18,1);position:absolute;inset:0}.card-surface img{object-fit:cover;object-position:center 38%;opacity:1;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;display:block}.ghost-1{z-index:3;border-color:var(--success-soft);transform:translateY(18px)rotate(2.4deg)scale(.962)}.ghost-2{z-index:2;border-color:var(--danger-soft);transform:translateY(36px)rotate(-2.6deg)scale(.925)}.card-ghost.card-promoting{z-index:3;opacity:1;transform:translate(0,0)rotate(0)scale(1)}.card-ghost.card-promoting .card-surface{box-shadow:0 0 0 1px #22201d14,inset 0 0 0 1px #ffffff8a,0 16px 44px #22201d1c,0 3px 9px #22201d1a}.card-ghost.card-promoting .card-surface:before{opacity:1}.card-ghost.card-promoting .card-surface:after{opacity:0;transition-duration:.14s}.portrait-frame{z-index:0;border-radius:inherit;background:var(--ink);-webkit-user-select:none;user-select:none;position:absolute;inset:0;overflow:hidden}.portrait-frame img{object-fit:cover;object-position:center 38%;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;display:block}.answer-block{z-index:3;width:auto;min-height:148px;color:var(--ink);text-align:left;pointer-events:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;margin:0;padding:18px 20px 19px;display:block;position:absolute;bottom:14px;left:14px;right:14px}.ghost-answer-block{pointer-events:none;animation:.17s cubic-bezier(.2,.82,.18,1) both ghost-answer-in}.answer-lines{z-index:1;color:#0000;text-shadow:none;gap:3px;transition:color .18s,text-shadow .18s,transform .18s;display:grid;position:relative}.answer-lines span{overflow-wrap:anywhere;min-width:0;font-size:21px;font-weight:500;line-height:1.16}.answer-lines .answer-japanese{font-size:22px;line-height:1.13}.answer-lines .answer-english{font-size:19px;font-weight:400;line-height:1.22}.answer-lines .answer-group{color:#0000;margin-top:18px;font-size:15px;font-weight:400;line-height:1.28}.answer-block.revealed .answer-lines{color:var(--photo-text);text-shadow:0 1px 2px #0000004d,0 8px 24px #00000057}.answer-block.revealed .answer-group{color:var(--photo-subtext)}.spoiler-mask{z-index:2;pointer-events:none;animation:.14s ease-out both spoiler-mask-in;position:absolute;inset:17px 19px 10px}.spoiler-mask-instant{animation:none}.spoiler-dot{left:var(--x);top:var(--y);width:var(--s);height:var(--s);background:var(--photo-text);opacity:var(--base-opacity);animation:spoiler-drift var(--duration) steps(4, end) infinite, spoiler-flicker var(--pulse-duration) ease-in-out infinite;animation-delay:var(--delay);border-radius:50%;position:absolute;transform:translate(0)}@keyframes ghost-answer-in{0%{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translate(0,0)}}@keyframes spoiler-mask-in{0%{opacity:0}to{opacity:1}}@keyframes spoiler-drift{0%,to{transform:translate(0)scale(1)}18%{transform:translate(var(--dx-a), var(--dy-a)) scale(.72)}42%{transform:translate(var(--dx), var(--dy)) scale(1.16)}67%{transform:translate(var(--dx-b), var(--dy-b)) scale(.88)}84%{transform:translate(var(--dx-c), var(--dy-c)) scale(1.05)}}@keyframes spoiler-flicker{0%,to{opacity:var(--base-opacity)}28%{opacity:.22}54%{opacity:.95}76%{opacity:.38}}.actions{padding-bottom:max(0px, env(safe-area-inset-bottom));grid-template-columns:1fr 1fr;gap:16px;display:grid}.action{--action-opacity:1;--action-scale:1;--action-lift:0px;--action-tilt:0deg;--action-saturate:1;--chevron-shift:0px;--chevron-opacity:1;--action-accent:var(--muted);--action-accent-strong:var(--muted);--action-fill-top:#8f8c89db;--action-fill-bottom:#656260eb;--action-accent-soft:#22201d14;--action-accent-glow:#22201d14;--action-depth:#22201d1f;min-height:110px;color:var(--muted);cursor:pointer;filter:saturate(var(--action-saturate));opacity:var(--action-opacity);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:8px;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:0;transition:transform .16s,filter .16s,opacity .16s;display:flex;position:relative}.action:hover:not(.intent){filter:saturate(1.03);transform:translateY(-2px)}.action.review{--action-accent:var(--danger);--action-accent-strong:var(--danger-deep);--action-fill-top:#ff625ff0;--action-fill-bottom:#ca244de6;--action-accent-soft:#e11d4829;--action-accent-glow:#e11d4842;--action-depth:#7e122d24}.action.remembered{--action-accent:var(--success);--action-accent-strong:var(--success-deep);--action-fill-top:#3fc79bf0;--action-fill-bottom:#218358e6;--action-accent-soft:#05966929;--action-accent-glow:#05966942;--action-depth:#125c3d24}.action-disc{z-index:1;color:#fffffff5;background:radial-gradient(circle at 34% 24%, #ffffff57, #ffffff14 34%, #fff0 58%), linear-gradient(145deg, var(--action-fill-top), var(--action-fill-bottom));width:78px;height:78px;box-shadow:inset 0 1px 1px #ffffff5c, inset 0 -14px 24px #1412101a, inset -8px -2px 18px var(--action-depth), 0 14px 34px #22201d1c, 0 7px 20px var(--action-accent-glow);border:0;border-radius:50%;place-items:center;transition:transform .18s,box-shadow .18s,color .18s,background .18s;display:grid;position:relative;overflow:hidden}.action-disc:before{content:"";opacity:.4;pointer-events:none;background:linear-gradient(#ffffff47,#fff0);border-radius:50%;height:18px;position:absolute;inset:9px 18px auto}.action-disc:after{content:"";border-radius:inherit;opacity:.42;pointer-events:none;background:radial-gradient(circle at 28% 24%,#ffffff29,#fff0 25%),linear-gradient(145deg,#ffffff12,#fff0 44%,#ffffff14);position:absolute;inset:2px}.action-disc svg{z-index:1;position:relative}.action:hover .action-disc{box-shadow:inset 0 1px 1px #fff6, inset 0 -14px 26px #1412101c, inset -8px -2px 18px var(--action-depth), 0 17px 42px #22201d21, 0 9px 24px var(--action-accent-glow);transform:scale(1.025)translateY(-1px)}.action.intent .action-disc{transform:translateY(var(--action-lift)) scale(var(--action-scale)) rotate(var(--action-tilt));box-shadow:inset 0 1px 1px #ffffff6b, inset 0 -14px 26px #1412101c, inset -8px -2px 18px var(--action-depth), 0 18px 46px #22201d21, 0 10px 27px var(--action-accent-glow)}.action.dormant .action-disc{transform:scale(var(--action-scale))}.action:active .action-disc{transform:scale(.98)translateY(1px)}.action-label{text-align:center;white-space:nowrap;min-width:0;font-size:15px;font-weight:500;line-height:1.12}.action.review .action-label{color:var(--danger-deep)}.action.remembered .action-label{color:var(--success-deep)}.chevrons{z-index:0;opacity:var(--chevron-opacity);pointer-events:none;gap:4px;transition:opacity .16s,transform .16s;display:flex;position:absolute;top:36px}.chevrons.left{transform:translateX(var(--chevron-shift));right:calc(50% + 47px)}.chevrons.right{transform:translateX(var(--chevron-shift));left:calc(50% + 47px)}.chevrons span{border-top:3px solid;border-right:3px solid;width:12px;height:12px}.chevrons.left span{transform:rotate(-135deg)}.chevrons.right span{transform:rotate(45deg)}.action.review .chevrons{color:var(--danger-deep)}.action.remembered .chevrons{color:var(--success-deep)}.chevrons span:first-child{opacity:.12}.chevrons span:nth-child(2){opacity:.24}.chevrons span:nth-child(3){opacity:.5}.settings-layer{z-index:20;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#22201d2e;place-items:end center;padding:18px;display:grid;position:fixed;inset:0}.settings-sheet{overscroll-behavior:contain;border:1px solid var(--line-strong);width:min(100%,390px);max-height:calc(100dvh - 36px);color:var(--ink);background:#fffffff5;border-radius:8px;padding:18px;overflow-y:auto;box-shadow:0 18px 56px #00000029,0 4px 12px #00000029}.sheet-header{justify-content:space-between;align-items:center;margin-bottom:16px;display:flex}.sheet-header h2{margin:0;font-size:19px;font-weight:500;line-height:1.24}.setting-row{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:18px;min-height:45px;font-size:14px;line-height:1.35;display:flex}.setting-row span{color:var(--muted)}.setting-row strong{font-weight:500}.shortcut-panel{border-top:1px solid var(--line);gap:7px;margin-top:2px;padding:13px 0 2px;display:grid}.shortcut-panel h3{color:#22201db8;margin:0 0 2px;font-size:12px;font-weight:500;line-height:1.35}.shortcut-row{min-height:28px;color:var(--muted);justify-content:space-between;align-items:center;gap:14px;font-size:12px;line-height:1.35;display:flex}.shortcut-keys{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:5px;display:flex}.shortcut-or{color:#22201d6b;font-size:11px;font-weight:400;line-height:1}kbd{border:1px solid var(--line-strong);color:#22201dad;min-width:25px;box-shadow:inset 0 -1px 0 var(--line), 0 1px 0 #ffffffb8;font:500 12px/1.3 var(--font);background:#ffffffdb;border-radius:6px;place-items:center;padding:2px 7px 3px;display:inline-grid}.refresh-button{border:1px solid var(--success-soft-strong);width:100%;min-height:48px;color:var(--success-deep);background:var(--success-soft);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:9px;margin-top:14px;font-size:14px;line-height:1.35;transition:transform .16s,opacity .16s;display:inline-flex}.refresh-button:hover:not(:disabled){transform:translateY(-1px)}.refresh-button:disabled{cursor:wait;opacity:.66}.refresh-icon{transition:transform .18s}.refresh-icon.spinning{animation:.86s linear infinite refresh-spin}.settings-note{color:#22201d7a;margin:9px 0 0;font-size:12px;line-height:1.35}.clear-button{border:1px solid var(--danger-soft-strong);width:100%;min-height:48px;color:var(--danger-deep);background:var(--danger-soft);cursor:pointer;border-radius:8px;justify-content:center;align-items:center;gap:9px;margin-top:12px;font-size:14px;line-height:1.35;display:inline-flex}.desktop-mobile-hint{display:none}@keyframes refresh-spin{to{transform:rotate(360deg)}}@media (width>=760px){.app-shell{padding-top:30px;padding-bottom:30px}}@media (width>=940px){.desktop-mobile-hint{z-index:8;border:1px solid var(--line);width:124px;color:var(--muted);text-align:center;opacity:.68;pointer-events:none;-webkit-user-select:none;user-select:none;background:#ffffffd1;border-radius:8px;justify-items:center;gap:8px;padding:10px;display:grid;position:fixed;top:50%;right:max(24px,50vw - 367px);transform:translateY(-50%);box-shadow:0 10px 28px #00000012,0 2px 7px #0000000f}.desktop-mobile-hint img{border:1px solid var(--line);-webkit-user-drag:none;background:#fff;border-radius:6px;width:74px;height:74px;padding:5px;display:block}.mobile-hint-copy{gap:2px;display:grid}.mobile-hint-title{color:#22201da3;font-size:12px;font-weight:500;line-height:1.2}.mobile-hint-body{color:#22201d6b;font-size:11px;font-weight:400;line-height:1.25}}@media (width>=940px) and (height<=700px){.desktop-mobile-hint{top:auto;bottom:24px;transform:none}}@media (height<=760px){.app-shell{gap:10px;padding-top:12px;padding-bottom:14px}.card{--card-width:min(100%, 334px);--card-height:clamp(424px, calc(100dvh - 214px), 506px)}.answer-block{min-height:136px;padding:16px 18px 17px;bottom:12px;left:12px;right:12px}}