/* v2me.css — Haeyo Korean v2, phase 3 slice ③d (2026-10-23, branch v2-apply). Loaded after v2site.css + v2spec.css (+ v2lesson/v2culture).
   The look of site3/mock/v2/me.html for the live My page (#/me · ?tab=cat · ?tab=buy · ?tab=profile), without touching app.js:
     mePage()  .mypage > .wrap > .mptabs + (.joinbox) + body
     Learn     myLearn():  .mptop (.mpcat · .mphi h1 · .mplv level menu · .mpbub cat bubble) · .mpgrid > .mpl/.mpr
               .mpcont continue card · .mpfor (forYou) · .mpc.mppathc lesson path · .mpc.mpweek · me_cando.js .mpc.cando (cd-*) · .mpredoc · .mpbadge · .mpmore
     My cat    catTab():   .catpage > .catbig (.hcat · .catname · .cathide) + .catopts.mpc (.catlv · .cated .catsw .dot/.mini)
     Purchases .mpone > .mpc (.atab table) or myBuyReco() .mpreco (.mprterms · .mprbooks) · .mprfree
     My info   .mpone > myRecord() .mprec (.mprecst · .mpcal) · account · .cartform · path chips
   me_cando.js injects <style id="cando-css"> at runtime as ".cando .cd-x", so every cando rule here starts with ".mypage .cando" to win.
   Cards: cream + hairline, no shadow. Section titles: Gaegu. Captions (.mpk): small caps. Rows: .tbl-like hairline rows.
   Phone first (375); 720px and 1024px add on. Nothing a learner reads is under 12px; every chip/button you tap is ≥44px tall.
   Contrast (computed): --mute on --cream 4.56 · #5d6470 on --cream2 5.6 · --sky-d on --sky-l 4.8 · #b33a3a on cream 5.5 · #17693a on --green-l ≥5. */

.mypage{--me-red:#b33a3a;--me-green:#17693a;--me-mute:#5d6470;padding:14px 0 72px;background:var(--paper);min-height:70vh}
.mypage .wrap{max-width:1080px}

/* ================= 1 · tabs → underline tabs ================= */
.mypage .mptabs{display:flex;gap:var(--sp-5);width:100%;max-width:100%;margin:0 0 18px;padding:0;background:none;border:0;border-bottom:1px solid var(--line);border-radius:0;overflow-x:auto;scrollbar-width:none}
.mypage .mptabs::-webkit-scrollbar{display:none}
.mypage .mptabs a{position:relative;flex:none;display:inline-flex;align-items:center;min-height:44px;padding:0 2px;border-radius:0;background:none;font:600 var(--fs-16)/1 var(--ui);color:var(--mute);text-decoration:none;white-space:nowrap}
.mypage .mptabs a:hover{color:var(--ink)}
.mypage .mptabs a.on{background:none;color:var(--ink)}
.mypage .mptabs a.on:after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--ink)}

/* ================= 2 · cards, titles, captions ================= */
.mypage .mpc{background:var(--cream);border:1px solid var(--line);border-radius:var(--rd-m);box-shadow:none;padding:16px}
.mypage .mpc h2,.mypage .mphd h2,.mypage .cando h2{margin:0 0 12px;font:700 var(--fs-24)/1.05 var(--hand);letter-spacing:0;color:var(--ink)}
.mypage .mphd h2{margin:0}
.mypage .mphd h2 span{font-weight:700;color:var(--mute)}
.mypage .mpc p{font:400 var(--fs-14)/var(--lh-body) var(--ui);color:var(--ink2)}
.mypage .mpc p.note,.mypage .note{font:400 var(--fs-14)/var(--lh-body) var(--ui);color:var(--mute)}
.mypage .mpk{display:block;font:700 var(--fs-12)/1.3 var(--ui);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--mute)}
.mypage .mphd{align-items:baseline;gap:6px 10px}
.mypage .mphd>span{font:600 var(--fs-12)/1.3 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.mypage .mpbar{height:8px;background:#fff;border:1px solid var(--line);margin:12px 0 8px}
.mypage .mpbar i{background:var(--ink)}
.mypage .mpgrid{gap:14px}
.mypage .mpl,.mypage .mpr{gap:14px}

/* ================= 3 · profile strip: cat · name · level plate ================= */
.mypage .mptop{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:14px 16px;margin:4px 0 18px}
.mypage .mpcat{width:88px;height:88px;border-radius:50%;overflow:hidden;background:var(--sky-l);border:2px solid var(--ink)}
.mypage .mpcat svg,.mypage .mpcat .hcat{display:block;width:100%;height:100%}
.mypage .mphi h1{margin:0 0 8px;font:800 30px/1.05 var(--ui);letter-spacing:-.035em;color:var(--ink)}
/* the level menu is the station plate: <b> = the .lv badge, <span> = the theme */
.mypage .mplv summary{min-height:44px;max-width:100%;gap:10px;padding:6px 14px 6px 7px;border:2px solid var(--ink);border-radius:var(--rd-pill);background:#fff;font:600 var(--fs-14)/1.2 var(--ui);color:var(--ink2)}
.mypage .mplv summary b{display:inline-grid;place-items:center;flex:none;min-width:34px;height:30px;padding:0 6px;border-radius:var(--rd-pill);background:var(--sky-d);color:#fff;font:800 13px/1 var(--ui);letter-spacing:0}
.mypage .mplv summary span{min-width:0}
.mypage .mplv .cv{color:var(--ink)}
.mypage .mplvbox{border:1px solid var(--line);border-radius:var(--rd-m);box-shadow:var(--sh-desk);padding:6px}
.mypage .mplvbox a{display:flex;align-items:center;gap:8px;min-height:44px;padding:0 10px;border-radius:var(--rd-s);font:500 var(--fs-14)/1.3 var(--ui);color:var(--ink)}
.mypage .mplvbox a:hover,.mypage .mplvbox a.on{background:var(--cream)}
.mypage .mplvbox a.more{color:var(--sky-d);border-top:1px solid var(--line)}
/* the cat's speech bubble */
.mypage .mpbub{max-width:520px;margin-top:10px;padding:10px 14px;background:var(--cream);border:1px solid var(--line);border-radius:var(--rd-m);box-shadow:none;font:500 var(--fs-14)/1.4 var(--ui);color:var(--ink2)}
.mypage .mpbub::before{background:var(--cream);border-color:var(--line)}
.mypage .mpbub>b{font:700 var(--fs-16)/1.2 var(--kr);color:var(--ink)}
.mypage .mpbub small{font:700 var(--fs-12)/1 var(--ui);color:var(--mute)}
.mypage .mpbub .mpbar{margin:4px 0}
.mypage .mpbub .mpbar i{background:var(--butter-d)}
.mypage .mpfor{font:500 var(--fs-14)/1.5 var(--ui) !important;color:var(--ink2)}
.mypage .mpfor b{font:700 var(--fs-12)/1.8 var(--ui);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--mute)}
.mypage .mpfor a{display:inline-flex;align-items:center;min-height:44px;color:var(--sky-d);font-weight:700;text-decoration:none}
.mypage .mptrial{font:400 var(--fs-14)/var(--lh-body) var(--ui);color:var(--ink2)}

/* ================= 4 · continue card (your next stop) ================= */
.mypage .mpcont{gap:6px;padding:18px;border:2px solid var(--ink);border-radius:var(--rd-m);background:var(--sky-l);box-shadow:none;color:var(--ink)}
.mypage .mpcont:hover{transform:none;box-shadow:var(--sh-desk)}
.mypage .mpcont small{font:700 var(--fs-12)/1.3 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--sky-d)}
.mypage .mpcont>b{font:900 clamp(28px,8vw,40px)/1.15 var(--kr);letter-spacing:-.02em;color:var(--ink);word-break:keep-all;overflow-wrap:anywhere}
.mypage .mpcont>.mpgr{font:700 var(--fs-14)/1.4 var(--kr);color:var(--ink2)}
.mypage .mpcont .btn{min-height:var(--h-l);padding:0 22px;margin-top:10px;border-radius:var(--rd-pill);background:var(--ink);border-color:var(--ink);color:#fff;font:700 var(--fs-16)/1 var(--ui)}
.mypage .mpcont.win{background:var(--butter-l)}
.mypage .mpcont.win small{color:var(--butter-d)}
.mypage .mpst{gap:6px;margin-top:2px}
.mypage .mpst i{display:inline-flex;align-items:center;min-height:28px;padding:0 10px;border:1px solid var(--line2);border-radius:var(--rd-pill);background:#fff;font:600 var(--fs-12)/1 var(--ui);color:var(--ink2)}
.mypage .mpst i.on{background:var(--ink);border-color:var(--ink);color:#fff}
.mypage .mpst i.on::before{color:var(--hl)}

/* ================= 5 · this week ================= */
.mypage .mpweek{align-items:flex-start}
.mypage .mpring .bg{stroke:#fff}
.mypage .mpring .fg{stroke:var(--sky-d)}
.mypage .mpring .fg.full{stroke:var(--green)}
.mypage .mpring b{font:700 28px/1 var(--hand);color:var(--ink)}
.mypage .mpring b small{font:600 var(--fs-12)/1 var(--ui);color:var(--mute)}
.mypage .mpweek p{margin-top:4px}
.mypage .mpdays span{font:600 var(--fs-12)/1 var(--ui);color:var(--mute)}
.mypage .mpdays i{background:#fff;border:1.5px solid var(--line2)}
.mypage .mpdays span.on i{border-color:var(--ink)}
.mypage .mpdays span.today{color:var(--ink)}
.mypage .mpdays span.today i{border:2px solid var(--ink)}
.mypage .mpgoal{flex-wrap:wrap;gap:8px;font:700 var(--fs-12)/1 var(--ui);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--mute)}
.mypage .mpgoal button{min-width:44px;height:44px;border:1px solid var(--line2);border-radius:var(--rd-pill);background:#fff;font:700 var(--fs-14)/1 var(--ui);color:var(--ink)}
.mypage .mpgoal button.on{background:var(--ink);border-color:var(--ink);color:#fff}

/* ================= 6 · my line: the level's lessons ================= */
.mypage .mppathc{background:#fff}
.mypage .mppath::before{background:var(--line2);width:4px;left:26px;border-radius:4px}
.mypage .mpn{padding:12px 0;border-top:1px dashed var(--line2)}
.mypage .mpn:first-child{border-top:0}
.mypage .mpdot{background:#fff}
.mypage .mpdot .bg{stroke:var(--line)}
.mypage .mpdot .fg{stroke:var(--sky-d)}
.mypage .mpdot b{font:700 22px/1 var(--hand);color:var(--ink)}
.mypage .mpn.done .mpdot{background:var(--ink)}
.mypage .mpn.done .mpdot b{color:#fff;font:800 18px/1 var(--ui)}
.mypage .mpn.done .mpdot .fg{stroke:var(--ink)}
.mypage .mpn.cur .mpdot{background:var(--sky);box-shadow:0 0 0 6px rgba(124,200,255,.3)}
.mypage .mpn.cur .mpdot .fg{stroke:var(--ink)}
.mypage .mpn.off .mpdot{background:var(--cream)}
.mypage .mpn.off .mpdot b,.mypage .mpn.off .mpnb>b{color:var(--mute)}
.mypage .mpnb>b{font:700 var(--fs-16)/1.35 var(--kr);color:var(--ink);word-break:keep-all;overflow-wrap:anywhere}
.mypage .mpnb small{font:400 var(--fs-12)/1.4 var(--ui);color:var(--mute)}
.mypage .mpnow{padding:0 10px;border-radius:var(--rd-pill);background:var(--me-red);font:700 var(--fs-12)/22px var(--ui);letter-spacing:.08em;text-transform:uppercase;color:#fff}
.mypage .mpgr{gap:6px;margin-top:6px}
.mypage .mpgr a{display:inline-flex;align-items:center;min-height:28px;padding:0 9px;border:1px solid var(--line);border-radius:8px;background:var(--cream);font:600 var(--fs-12)/1.3 var(--kr);color:var(--ink2)}
.mypage .mpgr a.met{background:var(--sky-l);border-color:#d6ebfb;color:#075288}
.mypage .mppips{gap:6px;margin-top:8px}
.mypage .mppips a{display:inline-flex;align-items:center;min-height:32px;padding:0 12px;border:1px solid var(--line2);border-radius:var(--rd-pill);background:#fff;font:600 var(--fs-12)/1 var(--ui);color:var(--ink2)}
.mypage .mppips a.on{background:var(--green-l);border-color:#bfe0cc;color:var(--me-green)}
.mypage .mpstars{font-size:18px}
.mypage .mpstars i{color:var(--line2)}
.mypage .mpstars i.on{color:var(--butter-d)}

/* ================= 7 · can-do ledger / first-week lines (me_cando.js) — a diary ================= */
.mypage .cando .cd-sub{font:400 var(--fs-14)/var(--lh-body) var(--ui);color:var(--mute)}
.mypage .cando .cd-day{background:#fff;border:1px solid var(--line);border-left:3px solid var(--me-red);border-radius:0 var(--rd-s) var(--rd-s) 0;padding:12px 14px}
.mypage .cando .cd-day .d{width:52px;font:700 var(--fs-12)/1.2 var(--ui);letter-spacing:.08em;color:var(--mute)}
.mypage .cando .cd-day .d b{font:700 30px/1 var(--hand);color:var(--ink)}
.mypage .cando .cd-day .t .kr{color:var(--ink)}
.mypage .cando .cd-day .t span{font:500 var(--fs-14)/1.4 var(--ui);color:var(--ink2)}
.mypage .cando .cd-day .t small{font:500 var(--fs-12)/1.4 var(--ui);color:var(--mute)}
.mypage .cando .cd-day .t small i{color:var(--sky-d)}
.mypage .cando details.cd-prev summary,.mypage .cando .cd-go{display:inline-flex;align-items:center;min-height:44px;font:700 var(--fs-14)/1 var(--ui);color:var(--sky-d)}
.mypage .cando .cd-all{background:#fff;border:1px solid var(--line);border-radius:var(--rd-s)}
.mypage .cando .cd-all summary{min-height:44px;display:grid;align-content:center}
.mypage .cando .cd-all summary b{font:700 var(--fs-14)/1.3 var(--ui);color:var(--ink)}
.mypage .cando .cd-all summary b::after{color:var(--sky-d)}
.mypage .cando .cd-all summary small{font:500 var(--fs-12)/1.4 var(--ui);color:var(--mute)}
.mypage .cando .cd-lines li{border-top:1px dashed var(--line2)}
.mypage .cando .cd-lines li:first-child{border-top:0}
.mypage .cando .cd-lines .kr{color:var(--ink)}
.mypage .cando .cd-lines span{font:500 var(--fs-12)/1.4 var(--ui);color:var(--mute)}
.mypage .cando .cd-head .n{font:700 var(--fs-20)/1 var(--hand);color:var(--ink)}
.mypage .cando .cd-head .n small{font:600 var(--fs-12)/1 var(--ui);color:var(--mute)}
.mypage .cando .cd-prog{height:8px;background:#fff;border:1px solid var(--line)}
.mypage .cando .cd-prog i{background:var(--ink)}
.mypage .cando .cd-list li{padding:11px 0;border-top:1px dashed var(--line2)}
.mypage .cando .cd-list li:first-child{border-top:0}
.mypage .cando .cd-ck{border:2px solid var(--line2);background:#fff}
.mypage .cando .cd-list li.done .cd-ck{background:var(--ink);border-color:var(--ink)}
.mypage .cando .cd-list .w{font:400 var(--fs-14)/1.45 var(--ui);color:var(--ink2)}
.mypage .cando .cd-list li.done .w{font-weight:600;color:var(--ink)}
.mypage .cando .cd-list .ko{font-size:var(--fs-14);color:var(--sky-d)}
.mypage .cando .cd-src{height:auto;min-height:24px;padding:0 9px;font:700 var(--fs-12)/24px var(--ui);background:#fff;border:1px solid var(--line2);color:var(--ink2)}
.mypage .cando a.cd-src{min-height:32px;line-height:32px}
.mypage .cando a.cd-src:hover{background:var(--sky-l)}
.mypage .cando .cd-chips a{min-height:44px;align-items:center;border:1px solid var(--line2);background:#fff;color:var(--ink)}
.mypage .cando .cd-chips a:hover{border-color:var(--ink);background:#fff}
.mypage .cando .ks-btn{min-height:44px;padding:0 14px;border:1px solid var(--line2);border-radius:var(--rd-pill);background:#fff;font:600 var(--fs-14)/1 var(--ui);color:var(--ink)}
.mypage .cando .ks-pv{font-size:var(--fs-12)}
.mypage .cando .cd-chips span{font:500 var(--fs-12)/1.3 var(--ui);color:var(--mute)}

/* ================= 8 · rows: practice again · more · cat's things ================= */
.mypage .mpredo{gap:0;margin-top:8px}
.mypage .mpredo a,.mypage .mpmore a{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:52px;margin:0;padding:8px 0;border-top:1px solid var(--line);border-radius:0;color:var(--ink);text-decoration:none}
.mypage .mpredo a:first-child{border-top:0}
.mypage .mpredo a:hover,.mypage .mpmore a:hover{background:none}
.mypage .mpredo a:hover b,.mypage .mpmore a:hover b{text-decoration:underline}
.mypage .mpredo b{font:700 var(--fs-16)/1.3 var(--kr);color:var(--ink)}
.mypage .mpredo span{font:400 24px/1 var(--pen);color:var(--me-red)}   /* the score, in red pen */
.mypage .mpmore a{display:grid;align-content:center;gap:2px}
.mypage .mpmore .mpk+a{border-top:0}
.mypage .mpmore a b{font:700 var(--fs-16)/1.3 var(--ui);color:var(--ink)}
.mypage .mpmore a span{font:400 var(--fs-14)/1.4 var(--ui);color:var(--mute)}
.mypage .mpthings{gap:10px}
.mypage .mpthings span{background:#fff;border:1px solid var(--line)}
.mypage .mpthings span i{font-size:14px}
.mypage .mpmorelink{display:inline-flex;align-items:center;min-height:44px;margin-top:6px;font:700 var(--fs-14)/1 var(--ui);color:var(--sky-d)}

/* ================= 9 · My cat tab — cream card, chip buttons ≥44px ================= */
.mypage .catbig{padding:18px 16px;background:var(--cream);border:1px solid var(--line);border-radius:var(--rd-m)}
.mypage .catbig>.hcat{width:min(220px,60vw);filter:none}
.mypage .catname .mpk{margin-bottom:2px}
.mypage .catname input{height:var(--h-l);padding:0 18px;border:1.5px solid var(--line2);border-radius:var(--rd-pill);background:#fff;font:700 var(--fs-16)/1 var(--kr);color:var(--ink)}
.mypage .catname input:focus{outline:none;border-color:var(--ink);box-shadow:var(--ring)}
.mypage .catbig .note{font:400 var(--fs-14)/var(--lh-body) var(--ui);color:var(--mute)}
.mypage .cathide{min-height:44px;font:600 var(--fs-14)/1.3 var(--ui);color:var(--ink2)}
.mypage .cathide input{width:20px;height:20px;accent-color:var(--ink)}
.mypage .catopts{gap:20px}
.mypage .catlv{background:#fff;border:1px solid var(--line);border-left:3px solid var(--me-red);border-radius:0 var(--rd-s) var(--rd-s) 0;font:500 var(--fs-14)/1.5 var(--ui);color:var(--ink2)}
.mypage .catlv b{color:var(--ink)}
.mypage .catlv p+p{color:var(--mute)}
.mypage .cated .mpk{font:700 var(--fs-20)/1.1 var(--hand);letter-spacing:0;text-transform:none;color:var(--ink)}
.mypage .catsw{gap:10px}
.mypage .catsw .dot{width:44px;height:44px;border:3px solid #fff;box-shadow:0 0 0 1px var(--line2)}
.mypage .catsw .dot.on{box-shadow:0 0 0 2px var(--ink)}
.mypage .catsw .dot.lock i{font-size:12px}
.mypage .catsw .mini{min-height:44px;padding:8px 6px 10px;border:1px solid var(--line2);border-radius:var(--rd-m);background:#fff;font:600 var(--fs-12)/1.3 var(--ui);color:var(--ink)}
.mypage .catsw .mini.on{background:var(--ink);border-color:var(--ink);box-shadow:none;color:#fff}
.mypage .catsw .mini.on .hcat{background:#fff;border-radius:50%}
.mypage .catsw .mini.lock{background:var(--cream);border-style:dashed}
.mypage .catsw .mini em{font:500 var(--fs-12)/1.3 var(--ui);color:var(--mute)}

/* ================= 10 · Purchases: orders as .tbl rows, plan + books ================= */
.mypage .mpone{gap:14px;max-width:860px}
.mypage .atab{background:transparent;border:0;border-radius:0;overflow-x:auto}
.mypage .atab table{min-width:0;font:400 var(--fs-14)/var(--lh-body) var(--ui)}
.mypage .atab th{padding:var(--sp-3) var(--sp-2);background:none;border-bottom:1.5px solid var(--ink);font:700 var(--fs-12)/1.3 var(--ui);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--mute)}
.mypage .atab td{padding:var(--sp-3) var(--sp-2);border-bottom:0;border-top:1px solid var(--line)}
.mypage .atab tbody tr:first-child td{border-top:0}
.mypage .atab td b{font-weight:700;color:var(--ink)}
.mypage .atab .act a,.mypage .atab .act button{white-space:nowrap;display:inline-flex;align-items:center;min-height:44px;padding:0 14px;border:1.5px solid var(--ink);border-radius:var(--rd-pill);background:#fff;font:700 var(--fs-14)/1 var(--ui);color:var(--ink)}
.mypage .atab .act .wa{border-color:#25d366;background:#25d366;color:#083b1f}
.mypage .mpreco h2{font:700 var(--fs-24)/1.1 var(--hand)}
.mypage .mprterms{grid-template-columns:repeat(2,minmax(0,1fr))}
.mypage .mprterms a{gap:2px;padding:12px 14px;background:#fff;border:1px solid var(--line);border-radius:var(--rd-s)}
.mypage .mprterms a:hover{border-color:var(--ink)}
.mypage .mprterms b{font:700 var(--fs-12)/1.3 var(--ui);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--mute)}
.mypage .mprterms strong{font:800 var(--fs-24)/1.1 var(--ui);letter-spacing:-.02em;color:var(--ink)}
.mypage .mprterms span{font:400 var(--fs-12)/1.4 var(--ui);color:var(--mute)}
.mypage .mprbooks img{border-radius:var(--rd-s);border:1px solid var(--line);background:#fff}
.mypage .mprbooks b{font:700 var(--fs-14)/1.3 var(--ui);color:var(--ink)}
.mypage .mprbooks span{font:400 var(--fs-14)/1.3 var(--ui);color:var(--mute)}
.mypage .mpc .btn{min-height:var(--h-l)}
.mypage .mpc .btn-sm{min-height:44px}

/* ================= 11 · My info: study record (diary) · account · form ================= */
.mypage .mprecst{grid-template-columns:minmax(0,1fr);gap:0;margin:0 0 14px;border-top:1px solid var(--line)}
.mypage .mprecst div{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:10px 0;background:none;border-radius:0;border-bottom:1px dashed var(--line2)}
.mypage .mprecst small{font:700 var(--fs-12)/1.3 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
.mypage .mprecst b{margin:0;font:700 var(--fs-20)/1.1 var(--hand);color:var(--ink);text-align:right}
.mypage .mpcalw em{font:600 var(--fs-12)/14px var(--ui);color:var(--mute)}
.mypage .mpcalw i{background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
.mypage .mpcalw i.l1{background:#cfe9ff;box-shadow:none}.mypage .mpcalw i.l2{background:#93d0ff;box-shadow:none}
.mypage .mpcalw i.l3{background:#42b0ff;box-shadow:none}.mypage .mpcalw i.l4{background:var(--sky-d);box-shadow:none}
.mypage .mpcalw i.fut{background:transparent;box-shadow:none}
.mypage .cartform .field>label{font:700 var(--fs-14)/var(--lh-snug) var(--ui);color:var(--ink)}
.mypage .cartform input[type=text],.mypage .cartform input[type=email],.mypage .cartform select,.mypage .cartform textarea{min-height:var(--h-l);padding:0 var(--sp-4);border:1.5px solid var(--line2);border-radius:var(--rd-pill);background:#fff;font:500 var(--fs-16)/1.2 var(--ui);color:var(--ink)}
.mypage .cartform input:focus,.mypage .cartform select:focus{outline:none;border-color:var(--ink);box-shadow:var(--ring)}
.mypage .cartform input[readonly]{background:var(--cream2);color:var(--me-mute)}
.mypage .linkbtn{display:inline-flex;align-items:center;min-height:44px;font:700 var(--fs-14)/1 var(--ui);color:var(--sky-d)}

/* ================= 12 · larger screens ================= */
@media (min-width:480px){
  .mypage .mprterms{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (min-width:720px){
  .mypage{padding-top:22px}
  .mypage .mpc{padding:20px}
  .mypage .mpcat{width:104px;height:104px}
  .mypage .mphi h1{font-size:var(--fs-40)}
  .mypage .mpcont{padding:22px 24px}
  .mypage .mprecst{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px}
}
@media (min-width:1024px){
  .mypage{background:var(--paper)}
  .mypage .mpgrid{gap:18px}
  .mypage .mpl,.mypage .mpr{gap:18px}
  .mypage .catbig{position:sticky;top:96px}
}
@media (max-width:640px){
  .mypage .mptabs{gap:var(--sp-4)}
  .mypage .mptabs a{flex:none;padding:0 2px}
  .mypage .mptop{align-items:center}
  .mypage .mpcat{width:84px;height:84px}
  .mypage .mpstars{font-size:16px}
  .mypage .catsw{gap:8px}
  /* order / request tables stack: date on top (caption), item + action on one row */
  .mypage .atab table,.mypage .atab tbody{display:block}
  .mypage .atab thead{display:none}
  .mypage .atab tr{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:4px 12px;padding:12px 0;border-top:1px solid var(--line)}
  .mypage .atab tbody tr:first-child{border-top:0;padding-top:4px}
  .mypage .atab td{padding:0;border:0}
  .mypage .atab td:first-child{grid-column:1/-1;font:700 var(--fs-12)/1.3 var(--ui);letter-spacing:.08em;text-transform:uppercase;color:var(--mute)}
  .mypage .atab td b{font-size:var(--fs-16);line-height:1.35}
  .mypage .catsw .mini{width:calc((100% - 16px) / 3)}
}

/* ================= 13 · 2026-10-30 mobile audit (fix-me) ================= */
/* plan status on Purchases (lifetime / self-study plan running) */
.mypage .mpplan{background:var(--green-l);border-color:#bfe0cc}
.mypage .mpplan h2{margin:0 0 4px;font:800 var(--fs-20)/1.2 var(--ui);color:var(--me-green)}
.mypage .mpplan p{margin:0;font:500 var(--fs-14)/1.45 var(--ui);color:var(--ink2)}
/* 2026-11-03 coupon box on Purchases (code → free days) */
.mypage .mpcoupon h2{margin:0 0 4px}
.mypage .mpcoupon p{margin:0 0 10px;font:500 var(--fs-14)/1.45 var(--ui);color:var(--ink2)}
.mypage .mpcpf{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.mypage .mpcpf input{flex:1 1 180px;min-width:0;min-height:44px;padding:8px 12px;border:1px solid var(--line2);border-radius:10px;font:700 var(--fs-16)/1.2 var(--ui);letter-spacing:.06em;text-transform:uppercase;background:var(--paper,#fff);color:var(--ink)}
.mypage .mpcpf .btn{min-height:44px}
.mypage .mpcpm{margin:10px 0 0}
.mypage .mpcpm.ok{color:var(--me-green);font-weight:700}
.mypage .mpcpm.no{color:#b3261e;font-weight:700}
/* last level-test result under the level menu */
.mypage .mptest{margin:6px 0 0;font:500 var(--fs-14)/1.4 var(--ui);color:var(--mute)}
.mypage .mptest b{color:var(--ink)}
.mypage .mptest a{display:inline-flex;align-items:center;min-height:44px;color:var(--sky-d);font-weight:700}
/* drawn lock (was the 🔒 emoji) */
.mypage .mplock{display:inline-block;vertical-align:-2px;color:var(--mute)}
.mypage .mpthings span i{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#fff;border:1px solid var(--line)}
.mypage .catsw .dot.lock i{display:grid;place-items:center;color:#fff}
.mypage .catsw .dot.lock .mplock{color:#fff;filter:drop-shadow(0 0 1px rgba(0,0,0,.6))}
/* "Hide my cat" — a bigger box */
.mypage .cathide{display:flex;align-items:center;gap:10px}
.mypage .cathide input{width:24px;height:24px;flex:none}
/* Lessons tab number tiles (booking.js) — captions at 13px */
.mypage .bk-tile span{font-size:13px}
/* tab row: fade at the right edge while more tabs are off-screen */
.mypage .mptabs.more{-webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 36px),transparent)}
@media (max-width:640px){
  .mypage .mptabs{gap:14px}
  /* grammar and class chips on the lesson path: 44px to tap, 13px text */
  .mypage .mpgr,.mypage .mppips{gap:8px}
  .mypage .mpgr a,.mypage .mppips a{min-height:44px;padding:0 12px;font-size:13px}
}
/* no all-caps labels on My page (design rule 2026-10-29; v2calm.css covers only .mpk) */
.mypage .mphd>span,.mypage .mpfor b,.mypage .mpcont small,.mypage .mpgoal,.mypage .mpnow,.mypage .atab th,.mypage .mprterms b,.mypage .mprecst small,.mypage .atab td:first-child{text-transform:none;letter-spacing:.005em}