#account-flashcards{margin:24px 0;padding:20px;border:1px solid #527aa6;border-radius:20px;scroll-margin-top:20px}
#account-flashcards[hidden],#account-flashcards [hidden]{display:none}
#account-flashcards .row{flex-wrap:wrap;gap:10px}
#account-flashcards h3{margin:0;overflow-wrap:anywhere}
#account-flashcards p{overflow-wrap:anywhere}
#cards-source{white-space:pre-wrap;max-height:300px;overflow:auto}
#account-card-form{max-width:none;margin-top:24px}
#account-card-form textarea{width:100%;min-width:0;font-size:16px}
#account-flashcards button,#account-flashcards summary{min-height:44px}
#account-flashcards summary{cursor:pointer;padding:12px 0}
#account-flashcards button{white-space:normal;overflow-wrap:anywhere}
/* WebKit can flatten 3D faces inside a button. Keep the inactive face invisible. */
#account-card .flip-face[aria-hidden=true]{visibility:hidden}
#notes article>button{margin-right:10px;margin-bottom:10px}
@media(max-width:480px){#account-flashcards{padding:14px}#cards-actions>button,#account-card-form .row>button{width:100%}}

#cards-import{margin-top:24px;border-top:1px solid #385474;padding-top:12px}
#import-file-label{display:block;margin:20px 0 8px}
#import-file{max-width:100%;min-width:0;font-size:16px}
#import-destination{font-weight:600}
#import-candidates{min-width:0;margin:20px 0;padding:0;border:0}
#import-selection-label{padding:0;margin-bottom:12px;font-weight:600}
#import-list{max-height:min(50vh,480px);overflow:auto;overscroll-behavior:contain;padding:4px}
.import-candidate{padding:14px 0;border-bottom:1px solid #385474}
.import-candidate label{display:flex;align-items:flex-start;gap:12px;min-height:44px;cursor:pointer;overflow-wrap:anywhere}
.import-candidate input{width:22px;min-width:22px;height:22px;margin:3px 0;accent-color:#a2d4ff}
.import-candidate label span{min-width:0}
.import-candidate p{margin:8px 0 0 34px;white-space:pre-wrap}
@media(max-width:480px){#cards-import .row>button,#import-browser{width:100%}}

/* Bounded, touch-friendly AI review; quote text never becomes HTML. */
#cards-generation {margin-block:1rem;}
#cards-generation summary,#cards-generation button,#cards-generation select,.generation-candidate>label:has(input){min-height:44px;}
#cards-generation summary{padding-block:12px;}
#cards-generation select{appearance:none;-webkit-appearance:none;height:48px;width:100%;max-width:100%;margin-bottom:12px;padding:12px;font:inherit;font-size:16px;background:#07162d;color:#eaf3ff;border:1px solid #60738f;border-radius:10px;}
#cards-generation [hidden],#cards-generated-origin[hidden]{display:none!important;}
#cards-generation textarea{box-sizing:border-box;width:100%;max-width:100%;resize:vertical;font-size:16px;}
.generation-candidate{min-width:0;margin-block:16px;padding:14px;border:1px solid #385474;border-radius:14px;}
.generation-candidate>label:has(input){display:flex;align-items:center;gap:10px;}
.generation-candidate input[type=checkbox]{width:20px;height:20px;flex:none;margin:0;}
#cards-generation blockquote,#cards-generated-quote{margin:12px 0;padding-left:12px;border-left:3px solid #385474;white-space:pre-wrap;overflow-wrap:anywhere;}
#generation-excerpt{white-space:pre-wrap;overflow-wrap:anywhere;max-height:240px;overflow:auto;}

#cards-generation select{padding-right:34px;background-image:linear-gradient(45deg,transparent 50%,#eaf3ff 50%),linear-gradient(135deg,#eaf3ff 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;}

#explanation-parts p{white-space:pre-wrap;overflow-wrap:anywhere}#explanation-parts section{margin-block:1rem}#explanation-parts blockquote{white-space:pre-wrap;overflow-wrap:anywhere;margin-inline:0;padding-inline-start:1rem;border-inline-start:3px solid currentColor}#explanation-parts summary{min-height:44px;display:flex;align-items:center;cursor:pointer}
