/* ═══════════════════════════════════════════════════════════
   NJ-98425 — /mypage redesign (indexV2) styles.
   All rules scoped under .ncv3 so they never collide with the
   layout's global CSS or the existing /mypage. Ported from the
   BE-approved prototype (SPECS/NJ-98425/NativeCamp Home.html).
   ═══════════════════════════════════════════════════════════ */
.ncv3{
  --ncv3-bg:#fdf5ec; --ncv3-navy:#0c2748; --ncv3-navy2:#16263a;
  --ncv3-orange:#f5821f; --ncv3-orange-d:#c95f0a;
  --ncv3-teal:#1ec8a0; --ncv3-teal-d:#0e9b78;
  --ncv3-cyan:#0BCAFA; --ncv3-cyan-d:#07a0cf;
  --ncv3-gold:#f6b51e;
  --ncv3-muted:#8295a8; --ncv3-muted2:#6a7a8c; --ncv3-muted3:#94a5b8;
  --ncv3-line:#eef2f7; --ncv3-line2:#dde3ec; --ncv3-line3:#e6edf5;
  --ncv3-scrim:rgba(12,39,72,.75);
  background:var(--ncv3-bg);
  color:var(--ncv3-navy2);
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  min-height:100vh;
}
.ncv3 *{box-sizing:border-box}
.ncv3 .num{font-variant-numeric:tabular-nums}
.ncv3 button{font-family:inherit}

@keyframes ncv3-floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
/* NOTE: the tour DOM lives OUTSIDE .ncv3, so --ncv3-* vars don't resolve here → colors hardcoded. */
@keyframes ncv3-glow{0%,100%{box-shadow:0 0 0 4px #f5821f,0 0 0 8px rgba(245,130,31,.2),0 0 0 9999px rgba(12,39,72,.75)}50%{box-shadow:0 0 0 4px #f5821f,0 0 0 12px rgba(245,130,31,.32),0 0 0 9999px rgba(12,39,72,.75)}}
@keyframes ncv3-pop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
@keyframes ncv3-fade{from{opacity:0}to{opacity:1}}
@keyframes ncv3-welin{from{opacity:0;transform:translate(-50%,-46%) scale(.94)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
@keyframes ncv3-badgein{from{opacity:0;transform:translate(-50%,14px)}to{opacity:1;transform:translate(-50%,0)}}

/* shell + content */
.ncv3 .ncv3-shell{overflow-x:auto}
.ncv3 .ncv3-content{max-width:1280px;margin:0 auto;padding:22px 48px 90px}

/* NOTICE */
.ncv3 .ncv3-notice{display:flex;align-items:center;gap:16px;background:#fdf0e6;border:1.5px solid #f5d9c0;border-radius:18px;padding:11px 20px}
.ncv3 .ncv3-notice-t{flex:none;display:inline-flex;align-items:center;gap:7px;background:var(--ncv3-orange);color:#fff;font-weight:700;font-size:13px;padding:7px 15px;border-radius:999px;box-shadow:0 4px 0 var(--ncv3-orange-d);white-space:nowrap}

/* TOP ROW: textbook + hero (textbook sizes to content; hero drives the height) */
.ncv3 .ncv3-toprow{display:flex;gap:24px;margin-top:22px;align-items:flex-start}
.ncv3 .ncv3-hero{flex:1}
.ncv3 .ncv3-hero-in{background:linear-gradient(130deg,#0d2d5c 0%,#154e8a 50%,#1a6a96 100%);border-radius:28px;padding:44px 50px;position:relative;overflow:hidden;height:100%}
.ncv3 .ncv3-hero-h1{font-size:46px;font-weight:900;color:#fff;line-height:1.1;margin-bottom:14px;letter-spacing:-.5px}
.ncv3 .ncv3-btn-hero{border:none;cursor:pointer;background:var(--ncv3-orange);color:#fff;font-weight:800;font-size:16px;padding:15px 30px;border-radius:999px;box-shadow:0 5px 0 var(--ncv3-orange-d);transition:transform .06s,box-shadow .06s}
.ncv3 .ncv3-btn-hero:active{transform:translateY(4px);box-shadow:0 1px 0 var(--ncv3-orange-d)}
.ncv3 .ncv3-hero-cta{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ncv3 .ncv3-btn-hero2{border:1.5px solid rgba(255,255,255,.35);cursor:pointer;background:rgba(255,255,255,.08);color:#fff;font-weight:800;font-size:15px;padding:14px 26px;border-radius:999px}
.ncv3 .ncv3-btn-hero2:hover{background:rgba(255,255,255,.16)}
.ncv3 .ncv3-hero-coins{display:inline-flex;align-items:center;gap:7px;color:#cde0f0;font-size:14px;font-weight:600}
.ncv3 .ncv3-hero-coins .coin{width:20px;height:20px}
.ncv3 .ncv3-hero-coins b{color:#fff;font-weight:800}

/* STATS STRIP (streak / lessons done / live count) — BE prototype */
.ncv3 .ncv3-stats{display:flex;gap:16px;margin-top:18px}
.ncv3 .ncv3-stat{flex:1;background:#fff;border:1.5px solid var(--ncv3-line);border-radius:18px;box-shadow:0 4px 16px rgba(14,45,82,.06);padding:18px 20px;display:flex;flex-direction:column;gap:11px}
.ncv3 .ncv3-stat-top{display:flex;align-items:center;gap:12px}
.ncv3 .ncv3-stat-ic{width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;flex:none}
.ncv3 .ncv3-stat-ic--fire{background:#fdecd8}
.ncv3 .ncv3-stat-ic--blue{background:#d9eefb}
.ncv3 .ncv3-stat-ic--bolt{background:rgba(246,181,30,.22)}
.ncv3 .ncv3-stat-head{display:flex;flex-direction:column;line-height:1.1}
.ncv3 .ncv3-stat-num{font-size:26px;font-weight:900;color:var(--ncv3-navy2)}
.ncv3 .ncv3-stat-l{font-size:12px;font-weight:700;color:var(--ncv3-muted)}
.ncv3 .ncv3-stat-msg{font-size:13px;font-weight:700;color:var(--ncv3-orange-d)}
.ncv3 .ncv3-stat-bar{height:7px;border-radius:999px;background:var(--ncv3-line2);overflow:hidden}
.ncv3 .ncv3-stat-bar i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--ncv3-orange),var(--ncv3-gold))}
.ncv3 .ncv3-stat-foot{display:flex;justify-content:space-between;font-size:11px;font-weight:600;color:var(--ncv3-muted3)}
/* dark "live" card */
.ncv3 .ncv3-stat--live{background:var(--ncv3-navy);border-color:var(--ncv3-navy)}
.ncv3 .ncv3-stat--live .ncv3-stat-num{color:#fff}
.ncv3 .ncv3-stat--live .ncv3-stat-l{color:#9fb6cd}
.ncv3 .ncv3-stat--live .ncv3-stat-msg{color:#cdE0f0;font-weight:600}
.ncv3 .ncv3-stat--live .ncv3-stat-cta{color:var(--ncv3-gold);font-weight:800;font-size:13px;cursor:pointer;text-decoration:none}

/* SECTION headings */
.ncv3 .ncv3-sec-t{font-weight:900;font-size:24px;letter-spacing:-.4px;display:flex;align-items:center;gap:12px}
.ncv3 .ncv3-sec-t .dim{font-weight:500;font-size:16px;color:var(--ncv3-muted2);margin-left:6px}

/* ═══ TOUR ═══ */
.ncv3-launcher{position:fixed;bottom:24px;left:24px;z-index:5200;background:var(--ncv3-teal,#1ec8a0);color:#fff;border-radius:40px;padding:13px 24px 13px 14px;display:none;align-items:center;gap:12px;box-shadow:0 10px 26px rgba(30,200,160,.45);cursor:pointer;animation:ncv3-floaty 4s ease-in-out infinite;border:none}
.ncv3-launcher.on{display:flex}
.ncv3-launcher .b{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;font-size:18px}
.ncv3-wel-scrim{position:fixed;inset:0;z-index:4000;background:rgba(12,39,72,.72);backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);display:none;animation:ncv3-fade .3s ease both}
.ncv3-wel-scrim.on{display:block}
.ncv3-wel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:#fff;border-radius:28px;padding:52px 48px 44px;width:580px;max-width:calc(100vw - 32px);box-shadow:0 24px 60px rgba(12,39,72,.28);text-align:center;animation:ncv3-welin .45s cubic-bezier(.34,1.56,.64,1) both;font-family:"Noto Sans JP",sans-serif}
.ncv3-wel .mascot{width:96px;height:96px;object-fit:contain;display:block;margin:0 auto;animation:ncv3-floaty 3.5s ease-in-out infinite}
.ncv3-wel .eyebrow{color:#f5821f;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-top:14px}
.ncv3-wel h2{color:#16263a;font-size:32px;font-weight:800;margin:8px 0 0;letter-spacing:-.4px}
.ncv3-wel p{color:#767676;font-size:16px;line-height:1.65;margin:16px auto 0;max-width:420px}
.ncv3-btn-start{border:none;cursor:pointer;background:#f5821f;color:#fff;border-radius:14px;padding:15px 36px;font-weight:800;font-size:15px;box-shadow:0 8px 20px rgba(245,130,31,.35)}
.ncv3-btn-skip{border:none;cursor:pointer;background:#f0ede8;color:#6B7785;border-radius:14px;padding:15px 28px;font-weight:800;font-size:15px}
.ncv3-tour-root{position:absolute;top:0;left:0;width:0;height:0;z-index:3900;display:none}
.ncv3-tour-root.on{display:block}
.ncv3-tour-catch{position:fixed;inset:0;z-index:3900}
.ncv3-spot{position:absolute;z-index:3950;border-radius:14px;pointer-events:none;background:transparent;box-shadow:0 0 0 4px #f5821f,0 0 0 8px rgba(245,130,31,.2),0 0 0 9999px rgba(12,39,72,.75);animation:ncv3-glow 2.2s ease-in-out infinite}
.ncv3-tip{position:absolute;z-index:3960;width:372px;background:#fff;border-radius:20px;padding:26px 26px 22px;box-shadow:0 16px 48px rgba(12,39,72,.22);font-family:"Noto Sans JP",sans-serif}
.ncv3-tip-step{color:#f5821f;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.ncv3-tip h3{color:#16263a;font-size:19px;font-weight:800;margin:0}
.ncv3-tip p{color:#767676;font-size:14px;line-height:1.65;margin:8px 0 0}
.ncv3-tip-dots{display:flex;gap:6px;margin-bottom:16px}
.ncv3-tip-dots i{height:7px;width:7px;background:#E2DACE;border-radius:30px;transition:width .25s}
.ncv3-tip-dots i.on{width:20px;background:#f5821f}
.ncv3-tip-leg{background:#FCFAF7;border-radius:12px;padding:16px 18px;margin-top:18px;display:flex;flex-direction:column;gap:16px}
.ncv3-btn-back{border:none;cursor:pointer;background:#f0ede8;color:#191919;border-radius:12px;padding:12px 20px;font-weight:800;font-size:14px}
.ncv3-btn-next{flex:1;border:none;cursor:pointer;color:#fff;border-radius:12px;padding:12px 20px;font-weight:800;font-size:14px}
.ncv3-done{position:fixed;bottom:40px;left:50%;transform:translateX(-50%);z-index:4000;background:#32d74b;color:#fff;border-radius:40px;padding:16px 24px;font-weight:700;font-size:16px;line-height:1.625;box-shadow:0 8px 22px rgba(50,215,75,.4);cursor:pointer;display:none;align-items:center;gap:8px;font-family:"Noto Sans JP",sans-serif}
.ncv3-done.on{display:flex;animation:ncv3-badgein .4s ease both}

/* ═══ FAVORITES — restyle the element's own お気に入り講師 title to a section heading ═══ */
.ncv3 .ncv3-favs{margin-top:22px}
.ncv3 .favorite-teacher-banner .banner-title-container{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.ncv3 .favorite-teacher-banner .banner-title{display:flex;align-items:center;gap:11px}
.ncv3 .favorite-teacher-banner .banner-title .icon-heart{width:24px;height:auto}
.ncv3 .favorite-teacher-banner .banner-title .icon-heart #icon_favorite,.ncv3 .favorite-teacher-banner .banner-title .icon-heart path{fill:#ef4d6e}
.ncv3 .favorite-teacher-banner .banner-title h3{font-weight:900;font-size:24px;letter-spacing:-.4px;color:var(--ncv3-navy2);margin:0}
.ncv3 .favorite-teacher-banner .see-more-container .btn-refresh{cursor:pointer;background:transparent;border:none;padding:6px;border-radius:10px}

/* ═══ AVAILABLE-TUTORS toolbar — sort + view-switch (tile/middle/large) + refresh.
   Pinned top-right of #nc-tutorlist so it aligns with the 利用可能な講師 heading row
   regardless of how deep lecturers_list nests it. Redundant 講師一覧 h3 is hidden. ═══ */
.ncv3 #nc-tutorlist{position:relative}
.ncv3 .sec_online_list > h3{display:none}
.ncv3 #nc-tutorlist .common_teacher_status_and_sort_flex{position:absolute;top:0;right:0;margin:0;display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:flex-end}
.ncv3 .common_teacher_status_and_sort_flex .desc_lesson_status_circle{display:none}
.ncv3 .sec_online_list .options-section{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:flex-end}
.ncv3 .sort-options,.ncv3 .display-options{display:flex;align-items:center;gap:8px}
.ncv3 .display-label,.ncv3 .sort-label{font-size:12px;color:var(--ncv3-muted3);font-weight:600;white-space:nowrap}
.ncv3 .size_switch_area_inner{display:flex;gap:6px;list-style:none;padding:0;margin:0}
.ncv3 .btn_switch_size{width:38px;height:38px;border-radius:11px;background:#fff;border:1.5px solid var(--ncv3-line2);display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--ncv3-muted3)}
.ncv3 .btn_switch_size.on{background:var(--ncv3-teal);border-color:var(--ncv3-teal);color:#fff}
.ncv3 .sort-options select{background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:999px;padding:9px 34px 9px 18px;font-weight:800;font-size:14px;color:var(--ncv3-navy2);cursor:pointer;min-width:170px;appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%238295a8' d='M1 1l5 5 5-5'/></svg>");background-repeat:no-repeat;background-position:right 14px center}
.ncv3 .sort-options select:focus{outline:none;border-color:var(--ncv3-teal)}
.ncv3 .btn-refresh{cursor:pointer;background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:11px;padding:6px 8px;height:38px;box-sizing:border-box}

/* list grid — the view-mode class on ul#list drives columns */
.ncv3 ul.user_list_style-box{list-style:none;padding:0;margin:0;display:grid;gap:14px}
.ncv3 ul.user_list_style-box.switch_large{grid-template-columns:1fr}
.ncv3 ul.user_list_style-box.switch_middle{grid-template-columns:1fr 1fr}
.ncv3 ul.user_list_style-box.switch_tile{grid-template-columns:repeat(5,1fr)}

/* card */
.ncv3 .user_list_item{background:#fff;border-radius:20px;box-shadow:0 4px 16px rgba(14,45,82,.07);border:1.5px solid var(--ncv3-line);overflow:hidden;list-style:none;position:relative;transition:box-shadow .15s,transform .06s}
.ncv3 .user_list_item:hover{box-shadow:0 8px 26px rgba(14,45,82,.12)}
.ncv3 .user_list_item_inner{display:flex;gap:20px;padding:20px 22px;text-decoration:none;color:inherit;align-items:center}
.ncv3 .user_list_style-box.switch_large .user_list_item_inner{align-items:center}
.ncv3 .user_list_style-box.switch_tile .user_list_item_inner,.ncv3 .user_list_style-box.switch_middle .user_list_item_inner{flex-direction:column;align-items:stretch;gap:12px}
/* tile view: stack photo → info vertically, contain overflow (real cards have flag+rating text) */
.ncv3 .user_list_style-box.switch_tile .clm_l .clm_inner,.ncv3 .user_list_style-box.switch_middle .clm_l .clm_inner{flex-direction:column;align-items:flex-start;gap:10px;width:100%;min-width:0}
.ncv3 .user_list_style-box.switch_tile figure.thumb,.ncv3 .user_list_style-box.switch_middle figure.thumb{width:100%}
.ncv3 .user_list_item,.ncv3 .user_list_item_inner{min-width:0;max-width:100%}
.ncv3 .name .overflow{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ncv3 .clm_r .clm_inner{display:flex;flex-wrap:wrap;gap:10px 16px;align-items:center}
.ncv3 figure.thumb{margin:0;flex:none}
.ncv3 figure.thumb .pic{width:130px;height:140px;object-fit:cover;border-radius:16px;display:block}
/* gradient-avatar fallback painted by JS on old-markup thumbs (favorites/recommended) */
.ncv3 figure.thumb.ncv3-av{position:relative;border-radius:16px;overflow:hidden}
.ncv3 figure.thumb.ncv3-av .ncv3-av-i{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:900;font-size:44px;text-shadow:0 2px 8px rgba(0,0,0,.14);z-index:0;pointer-events:none}
.ncv3 figure.thumb.ncv3-av .pic{position:relative;z-index:1}
.ncv3 .user_list_style-box.switch_tile figure.thumb .pic{width:100%;height:180px}
.ncv3 .clm_l,.ncv3 .clm_r{display:block}
.ncv3 .clm_l .clm_inner{display:flex;gap:18px;align-items:center}
.ncv3 .name_area .name{font-weight:900;font-size:21px;color:var(--ncv3-navy2);display:flex;align-items:center;gap:9px;margin:0}
.ncv3 .name .overflow{white-space:normal}
.ncv3 .lesson_status_circle{width:15px;height:15px;border-radius:50%;background:#c6d2df;display:inline-block;flex:none}
.ncv3 .lesson_status_circle--online,.ncv3 .lesson_status_circle--possible{background:#15b6e4}
.ncv3 .lesson_status_circle--warmup{background:#f6b51e}
.ncv3 .coin_area .coin_count{font-weight:800;color:var(--ncv3-navy2);font-size:15px}
.ncv3 .coin_area .coin{width:20px;height:20px;vertical-align:middle}
.ncv3 .data_area .ui-rating_area{display:flex;align-items:center;gap:6px;font-weight:800;color:var(--ncv3-navy2)}
.ncv3 .data_area .rate::before{content:"★ ";color:var(--ncv3-gold)}
.ncv3 .data_area .lesson_count{color:var(--ncv3-muted);font-weight:600}
.ncv3 .teacher--box-flag{display:flex;align-items:center;gap:7px}
.ncv3 .teacher--box-flag .flag-img img{width:20px;height:auto;border-radius:2px}
.ncv3 .teacher--box-flag .flag-name p{color:var(--ncv3-muted2);font-weight:600;font-size:14px;margin:0}
.ncv3 .fav_area{position:absolute;top:12px;right:12px;z-index:2}
.ncv3 .fav_area .fav_icon{font-size:22px}
.ncv3 .fav_area .fav_icon.off{width:22px;height:22px}

/* ═══════════════════════════════════════════════════════════
   FRESH FILTER BAR (T015-T017) — clean bar per BE prototype.
   The real teacher_search_form stays in the DOM (hidden) as the
   source of truth for getSearchData(); these controls read/write
   its inputs then call updateTeacherList(). Own .ncv3-f* classes.
   ═══════════════════════════════════════════════════════════ */
/* real form kept functional but out of view (NOT display:none — its date/layout JS needs box) */
.ncv3 .ncv3-realform{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.ncv3 .ncv3-fbar{margin-top:20px;display:flex;flex-direction:column;gap:14px}
.ncv3 .ncv3-fbar-row{display:flex;gap:16px;align-items:stretch;flex-wrap:wrap}
.ncv3 .ncv3-field{flex:1;min-width:180px;background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:16px;padding:11px 18px;display:flex;flex-direction:column;gap:3px;transition:border-color .12s}
.ncv3 .ncv3-field:focus-within{border-color:var(--ncv3-teal)}
.ncv3 .ncv3-field label{font-size:11px;font-weight:600;color:var(--ncv3-muted);letter-spacing:.02em}
.ncv3 .ncv3-field .ncv3-sel{border:none;background:transparent;font-size:16px;font-weight:800;color:var(--ncv3-navy2);cursor:pointer;appearance:none;padding-right:22px;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%238295a8' d='M1 1l5 5 5-5'/></svg>");background-repeat:no-repeat;background-position:right center}
.ncv3 .ncv3-field .ncv3-sel:focus{outline:none}
/* row 2 */
.ncv3 .ncv3-fbar-row2{align-items:center}
.ncv3 .ncv3-fpop{position:relative}
.ncv3 .ncv3-pill{height:46px;box-sizing:border-box;display:inline-flex;align-items:center;gap:6px;background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:999px;padding:0 20px;font-size:14px;font-weight:700;color:var(--ncv3-navy2);cursor:pointer;white-space:nowrap}
.ncv3 .ncv3-pill:hover{border-color:var(--ncv3-muted3)}
.ncv3 .ncv3-pill[disabled]{opacity:.5;cursor:not-allowed}
.ncv3 .ncv3-pop{position:absolute;top:calc(100% + 8px);left:0;z-index:60;min-width:280px;background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:16px;box-shadow:0 16px 40px rgba(14,45,82,.18);padding:6px;display:none;max-height:340px;overflow:auto}
.ncv3 .ncv3-pop.on{display:block}
.ncv3 .ncv3-pop-head{padding:8px 14px 4px;font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--ncv3-muted);text-transform:uppercase}
.ncv3 .ncv3-pop-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 14px;border-radius:10px;font-size:15px;font-weight:600;color:var(--ncv3-navy2);cursor:pointer}
.ncv3 .ncv3-pop-row:hover{background:var(--ncv3-bg)}
.ncv3 .ncv3-pop-row input[type=checkbox]{width:18px;height:18px;flex:none;cursor:pointer;accent-color:var(--ncv3-teal)}

/* custom dropdown (replaces native <select> so the open panel matches the design) */
.ncv3 .ncv3-ddl{position:relative}
.ncv3 .ncv3-ddl-lbl{font-size:11px;font-weight:600;color:var(--ncv3-muted);letter-spacing:.02em}
.ncv3 .ncv3-ddl-btn{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;border:none;background:transparent;padding:0;cursor:pointer;font-family:inherit}
.ncv3 .ncv3-ddl-val{font-size:16px;font-weight:800;color:var(--ncv3-navy2);text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ncv3 .ncv3-ddl-car{color:var(--ncv3-muted3);font-size:11px;flex:none}
.ncv3 .ncv3-ddl-menu{min-width:100%;left:0;right:auto}
.ncv3 .ncv3-ddl-opt{padding:11px 14px;border-radius:10px;font-size:15px;font-weight:600;color:var(--ncv3-navy2);cursor:pointer;white-space:nowrap}
.ncv3 .ncv3-ddl-opt:hover{background:var(--ncv3-bg)}
.ncv3 .ncv3-ddl-opt.ncv3-on{color:var(--ncv3-teal-d);font-weight:800}
.ncv3 .ncv3-ddl-opt.ncv3-on::before{content:"✓ "}
/* sort-by variant: pill trigger */
.ncv3 .ncv3-ddl--pill .ncv3-sortbtn{background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:999px;padding:9px 16px 9px 18px;min-width:170px}
.ncv3 .ncv3-ddl--pill .ncv3-ddl-val{font-size:14px}
.ncv3 .ncv3-ddl--pill .ncv3-ddl-menu{left:auto;right:0}
.ncv3 .ncv3-search{flex:1;min-width:220px;height:46px;box-sizing:border-box;display:flex;align-items:center;gap:9px;background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:999px;padding:0 18px}
.ncv3 .ncv3-search:focus-within{border-color:var(--ncv3-teal)}
.ncv3 .ncv3-search .ncv3-search-i{color:var(--ncv3-muted3);font-size:15px}
.ncv3 .ncv3-search input{flex:1;border:none;background:transparent;font-size:14px;color:var(--ncv3-navy2);font-family:inherit}
.ncv3 .ncv3-search input:focus{outline:none}
.ncv3 .ncv3-fbar-actions{display:flex;gap:10px;margin-left:auto}
.ncv3 .ncv3-btn-reset{height:46px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:999px;padding:0 28px;font-size:14px;font-weight:800;color:var(--ncv3-navy2);cursor:pointer}
.ncv3 .ncv3-btn-reset:hover{border-color:var(--ncv3-muted3)}
.ncv3 .ncv3-btn-search{height:46px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;background:var(--ncv3-teal);border:none;border-radius:999px;padding:0 28px;font-size:14px;font-weight:800;color:#fff;cursor:pointer;box-shadow:0 4px 0 var(--ncv3-teal-d);transform:translateY(-2px);transition:transform .06s,box-shadow .06s}
.ncv3 .ncv3-btn-search:active{transform:translateY(1px);box-shadow:0 1px 0 var(--ncv3-teal-d)}

/* ═══════════════════════════════════════════════════════════
   FRESH TEACHER LIST — the mypage_v3_tutor_list markup that
   onlineTeachersV3() injects into
   .teacher-banner-list-wrap. Our own classes only (.ncv3-t*),
   so the template's global list CSS cannot touch it. View mode
   is driven by the switch_tile / switch_middle / switch_large
   class that changeListSize() toggles on ul#list.
   ═══════════════════════════════════════════════════════════ */
.ncv3 .ncv3-tlist{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.ncv3 .ncv3-tlist.switch_tile{grid-template-columns:repeat(5,1fr)}
.ncv3 .ncv3-tlist.switch_middle{grid-template-columns:1fr 1fr}
.ncv3 .ncv3-tlist.switch_large{grid-template-columns:1fr}

.ncv3 .ncv3-tcard{position:relative;background:#fff;border:1.5px solid var(--ncv3-line);border-radius:20px;overflow:hidden;box-shadow:0 4px 16px rgba(14,45,82,.07);transition:box-shadow .15s,transform .06s}
.ncv3 .ncv3-tcard:hover{box-shadow:0 10px 28px rgba(14,45,82,.13);transform:translateY(-2px)}
.ncv3 .ncv3-tcard-link{display:block;text-decoration:none;color:inherit}

/* photo → gradient-avatar + initial (BE prototype). img overlays; self-removes on 404 → gradient shows */
.ncv3 .ncv3-tphoto{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;background:#dfe8f0}
.ncv3 .ncv3-tphoto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ncv3 .ncv3-tinitial{color:#fff;font-weight:900;font-size:54px;line-height:1;letter-spacing:.5px;user-select:none;text-shadow:0 2px 10px rgba(0,0,0,.14)}
/* NJ-98425 real teacher photo overlays the gradient+initial (initial stays as onerror fallback) */
.ncv3 .ncv3-lc-av,.ncv3 .ncv3-2c-av{position:relative;overflow:hidden}
.ncv3 .ncv3-av-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit;z-index:1}
.ncv3 .ncv3-fcard-heart{z-index:2}
.ncv3 .ncv3-tlist.switch_large .ncv3-tinitial{font-size:44px}
.ncv3 .ncv3-grad-0{background:linear-gradient(135deg,#f4a7c0,#ec7ea0)}
.ncv3 .ncv3-grad-1{background:linear-gradient(135deg,#8fd0f0,#5aa9df)}
.ncv3 .ncv3-grad-2{background:linear-gradient(135deg,#f6d777,#eec152)}
.ncv3 .ncv3-grad-3{background:linear-gradient(135deg,#c3a5f4,#9b7ee4)}
.ncv3 .ncv3-grad-4{background:linear-gradient(135deg,#8ee4c8,#4fc7a0)}
.ncv3 .ncv3-grad-5{background:linear-gradient(135deg,#f4b58f,#ec8f5a)}
.ncv3 .ncv3-tlist.switch_tile .ncv3-tphoto{height:190px}
.ncv3 .ncv3-tlist.switch_middle .ncv3-tphoto{height:170px}

/* body */
.ncv3 .ncv3-tbody{padding:15px 17px 17px}
.ncv3 .ncv3-tname{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.ncv3 .ncv3-tname-txt{font-weight:900;font-size:17px;color:var(--ncv3-navy2);line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ncv3 .ncv3-dot{width:12px;height:12px;border-radius:50%;flex:none;background:#c6d2df}
.ncv3 .ncv3-dot.lesson_status_circle--online,.ncv3 .ncv3-dot.lesson_status_circle--possible{background:#15b6e4}
.ncv3 .ncv3-dot.lesson_status_circle--warmup{background:var(--ncv3-gold)}
.ncv3 .ncv3-dot.lesson_status_circle--on--offline{background:#c6d2df}
.ncv3 .ncv3-tflag{display:flex;align-items:center;gap:7px;margin-bottom:6px}
.ncv3 .ncv3-tflag img{width:20px;height:auto;border-radius:2px;flex:none}
.ncv3 .ncv3-tflag span{color:var(--ncv3-muted2);font-weight:600;font-size:13px}
.ncv3 .ncv3-trate{display:flex;align-items:center;gap:6px;font-weight:800;color:var(--ncv3-navy2);font-size:14px;margin-bottom:6px}
.ncv3 .ncv3-tlessons{color:var(--ncv3-muted);font-weight:600;font-size:13px}
.ncv3 .ncv3-tcoin{display:flex;align-items:center;gap:6px;font-weight:800;color:var(--ncv3-navy2);font-size:14px}
.ncv3 .ncv3-tcoin .coin{width:18px;height:18px}

/* favorite heart (top-right) */
.ncv3 .ncv3-fav{position:absolute;top:11px;right:11px;z-index:2;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 2px 8px rgba(14,45,82,.16);display:flex;align-items:center;justify-content:center;cursor:pointer}
.ncv3 .ncv3-fav .fav_icon{font-size:20px}
.ncv3 .ncv3-fav img.fav_icon{width:20px;height:20px}
.ncv3 .ncv3-fav .hide{display:none}

/* large (list) view: photo left, body right */
.ncv3 .ncv3-tlist.switch_large .ncv3-tcard-link{display:flex;align-items:center;gap:22px;padding:16px 18px}
.ncv3 .ncv3-tlist.switch_large .ncv3-tphoto{width:150px;height:150px;border-radius:16px;flex:none}
.ncv3 .ncv3-tlist.switch_large .ncv3-tbody{padding:0;flex:1;min-width:0}
.ncv3 .ncv3-tlist.switch_large .ncv3-tname-txt{font-size:20px}

.ncv3 .ncv3-empty{background:#fff;border:1.5px solid var(--ncv3-line);border-radius:20px;padding:48px 24px;text-align:center;color:var(--ncv3-muted2);font-weight:700;font-size:15px}

/* ═══ SELECTED TEXTBOOK card (preset_textbook, Angular-bound) — restyle to a clean card ═══ */
.ncv3 .ui_preset_textbook{background:#fff;border:1.5px solid var(--ncv3-line);border-radius:20px;box-shadow:0 4px 16px rgba(14,45,82,.07);overflow:hidden}
.ncv3 .ui_preset_textbook_inner{padding:18px 20px;display:flex;flex-direction:column;gap:12px;height:100%}
.ncv3 .ui_preset_textbook .section_title{font-size:12px;color:var(--ncv3-muted);font-weight:700;margin:0}
.ncv3 .ui_preset_textbook .section_title .fw_b{color:var(--ncv3-navy2);font-weight:800}
.ncv3 .ui_preset_textbook .cur_textbook_inner{display:flex;gap:12px;align-items:center}
.ncv3 .ui_preset_textbook .ic_textbook{margin:0;flex:none}
.ncv3 .ui_preset_textbook .ic_textbook img{width:60px;height:60px;object-fit:cover;border-radius:12px;background:#eef3f8;display:block}
.ncv3 .ui_preset_textbook .cat-name{font-weight:800;font-size:15px;color:var(--ncv3-navy2);margin:0;line-height:1.35}
.ncv3 .ui_preset_textbook .cur_textbook_details{font-size:13px;color:var(--ncv3-muted2)}
.ncv3 .ui_preset_textbook .sub-cat-name{margin:0;font-weight:700;color:var(--ncv3-navy2)}
.ncv3 .ui_preset_textbook .chapter-name{margin:2px 0 0}
.ncv3 .ui_preset_textbook .btn_wrap_flex{display:flex;gap:8px;margin-top:auto}
.ncv3 .ui_preset_textbook .btn_style{flex:1;text-align:center;border-radius:12px;padding:11px 12px;font-weight:800;font-size:13px;text-decoration:none;cursor:pointer;border:1.5px solid var(--ncv3-line2);color:var(--ncv3-navy2);background:#fff}
.ncv3 .ui_preset_textbook .btn_green{background:var(--ncv3-teal);border-color:var(--ncv3-teal);color:#fff;box-shadow:0 4px 0 var(--ncv3-teal-d)}
.ncv3 .ui_preset_textbook .btn_blue{background:var(--ncv3-cyan);border-color:var(--ncv3-cyan);color:#fff}

/* ═══ FAVORITES CAROUSEL — clean vertical cards (artifact). The card DOM is two columns
   (.clm_l=thumb/name/coin, .clm_r=flag/rating); flatten with display:contents and re-order
   into photo → name → country → rating → coins. Scoped to the favorites wrap only. ═══ */
.ncv3 .favorite-teacher-banner-list-wrap{padding:2px 0}
.ncv3 .favorite-teacher-banner-list-wrap .slick-slide{padding:0 8px;height:auto}
.ncv3 .favorite-teacher-banner-list-wrap .slick-track{display:flex;align-items:stretch}
.ncv3 .favorite-teacher-banner-list-wrap .user_list_item{background:#fff;border:1.5px solid var(--ncv3-line);border-radius:20px;box-shadow:0 4px 16px rgba(14,45,82,.07);overflow:hidden;position:relative;margin:0;max-width:232px}
.ncv3 .favorite-teacher-banner-list-wrap .user_list_item_inner{display:flex;flex-direction:column;align-items:stretch;text-decoration:none;color:inherit;padding:0}
/* flatten the two-column table layout so all pieces are direct flex items we can order */
.ncv3 .favorite-teacher-banner-list-wrap .clm_l,
.ncv3 .favorite-teacher-banner-list-wrap .clm_r,
.ncv3 .favorite-teacher-banner-list-wrap .clm_l .clm_inner,
.ncv3 .favorite-teacher-banner-list-wrap .clm_r .clm_inner{display:contents}
.ncv3 .favorite-teacher-banner-list-wrap figure.thumb{order:0;width:100%;margin:0;border-radius:0}
.ncv3 .favorite-teacher-banner-list-wrap figure.thumb.ncv3-av{border-radius:0}
.ncv3 .favorite-teacher-banner-list-wrap figure.thumb .pic{width:100%;height:180px;border-radius:0}
.ncv3 .favorite-teacher-banner-list-wrap figure.thumb.ncv3-av .ncv3-av-i{font-size:58px}
.ncv3 .favorite-teacher-banner-list-wrap .name_area{order:1;padding:13px 15px 0}
.ncv3 .favorite-teacher-banner-list-wrap .name_area .name{font-size:17px;margin:0}
.ncv3 .favorite-teacher-banner-list-wrap .teacher--box-flag-and-fav{order:2;padding:5px 15px 0}
.ncv3 .favorite-teacher-banner-list-wrap .data_area{order:3;padding:5px 15px 0}
.ncv3 .favorite-teacher-banner-list-wrap .coin_area{order:4;padding:8px 15px 15px}
.ncv3 .favorite-teacher-banner-list-wrap .coin_area figure{display:flex;align-items:center;gap:6px;margin:0}

/* ═══ RECOMMENDED sections — old-markup cards already styled by .user_list_item; style headings ═══ */
.ncv3 .recommended_native_speaker_teacher_list,.ncv3 .recommended_japanese_teacher_list{margin-top:30px}
.ncv3 .banner-title{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.ncv3 .banner-title h3{font-weight:900;font-size:20px;letter-spacing:-.3px;color:var(--ncv3-navy2);margin:0}
.ncv3 .banner-title .flags{display:inline-flex;gap:4px;align-items:center}
.ncv3 .banner-title .flags img{width:22px;height:auto;border-radius:2px}

/* ══════════════════════════════════════════════════════════════════════════
   STATIC DESIGN v2 (artifact match, mock data). Own .ncv3-* classes only.
   ══════════════════════════════════════════════════════════════════════════ */
/* What's new banner */
.ncv3 .ncv3-notice-body{flex:1;font-size:14px;color:var(--ncv3-muted2)}
.ncv3 .ncv3-notice-body b{color:var(--ncv3-navy2);font-weight:800}
.ncv3 .ncv3-notice-dot{margin:0 8px;color:var(--ncv3-muted3)}
.ncv3 .ncv3-notice-count{flex:none;font-size:13px;font-weight:700;color:var(--ncv3-muted3)}

/* top row (stretch so textbook matches hero height) */
.ncv3 .ncv3-toprow{align-items:stretch}
.ncv3 .ncv3-tbcard{width:320px;flex:none;background:#fff;border:1.5px solid var(--ncv3-line);border-radius:22px;box-shadow:0 4px 16px rgba(14,45,82,.07);padding:24px;display:flex;flex-direction:column;gap:15px}
.ncv3 .ncv3-tbcard-t{font-size:13px;color:var(--ncv3-muted);font-weight:700}
.ncv3 .ncv3-tbcard-t b{color:var(--ncv3-navy2);font-weight:800}
.ncv3 .ncv3-tbcard-row{display:flex;gap:14px;align-items:center}
.ncv3 .ncv3-tbcard-ic{position:relative;overflow:hidden;width:64px;height:64px;flex:none;border-radius:16px;background:#d6f3ea;display:flex;align-items:center;justify-content:center;font-size:30px}
.ncv3 .ncv3-tbcard-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:inherit}
.ncv3 .ncv3-tbcard-img:not([src]),.ncv3 .ncv3-tbcard-img[src=""]{display:none}
.ncv3 .ncv3-tbcard-name{font-weight:800;font-size:17px;color:var(--ncv3-navy2);line-height:1.35}
.ncv3 .ncv3-tbcard-sub{font-size:14px;color:var(--ncv3-muted2);line-height:1.5}
.ncv3 .ncv3-tbcard-sub b{display:block;color:var(--ncv3-navy2);font-weight:700;font-size:14.5px}
.ncv3 .ncv3-tbcard-btns{display:flex;flex-direction:column;gap:11px;margin-top:8px}
.ncv3 .ncv3-btn-outline{background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:14px;padding:15px;font-weight:800;font-size:15px;color:var(--ncv3-navy2);cursor:pointer}
.ncv3 .ncv3-btn-outline:hover{border-color:var(--ncv3-muted3)}
.ncv3 .ncv3-tbcard .ncv3-btn-green{background:var(--ncv3-teal);border:none;border-radius:14px;padding:15px;font-weight:800;font-size:15px;color:#fff;cursor:pointer;box-shadow:0 4px 0 var(--ncv3-teal-d)}
.ncv3 .ncv3-tbcard .ncv3-btn-green:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ncv3-teal-d)}

/* hero extras */
.ncv3 .ncv3-hero-eyebrow{font-size:15px;color:#a0bdd4;font-weight:500;margin-bottom:10px}
.ncv3 .ncv3-hero-p{font-size:15px;color:#90b4cc;line-height:1.65;max-width:520px;margin-bottom:20px}

/* section head + pager */
.ncv3 .ncv3-sec{margin-top:26px}
.ncv3 .ncv3-sec-head,.ncv3 .ncv3-avail-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.ncv3 .ncv3-sec-heart{color:#F1890E;display:inline-flex;align-items:center}
.ncv3 .ncv3-sec-heart .ncv3-heart{width:24px}
.ncv3 .ncv3-pager{display:flex;align-items:center;gap:9px}
.ncv3 .ncv3-pager-l{font-size:13px;color:var(--ncv3-muted2);font-weight:600}
.ncv3 .ncv3-pager-btn{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--ncv3-line2);background:#fff;color:var(--ncv3-muted2);cursor:pointer;font-size:16px;display:inline-flex;align-items:center;justify-content:center}
.ncv3 .ncv3-pager-btn img{width:15px;height:15px;object-fit:contain;display:block;pointer-events:none}
.ncv3 .ncv3-pager-btn--on{border-color:var(--ncv3-teal);color:var(--ncv3-teal)}

/* status dots */
.ncv3 .ncv3-dot--on{background:#15b6e4}
.ncv3 .ncv3-dot--off{background:#c6d2df}
/* NJ-98425 full status LED spectrum (matches platform: common.css .lesson_status_circle--*) */
.ncv3 .ncv3-dot--wait{background:#0bcafa}      /* standby / available now */
.ncv3 .ncv3-dot--lesson{background:#f0295d}    /* in class */
.ncv3 .ncv3-dot--live{background:#f0295d}      /* live lesson */
.ncv3 .ncv3-dot--on-break{background:#fcc916}  /* on break */
.ncv3 .ncv3-dot--reserved{background:#f9ce15}  /* own reservation */
.ncv3 .ncv3-dot--offline{background:#c6d2df}   /* offline */
.ncv3 .ncv3-view--refresh.ncv3-spinning,.ncv3 .ncv3-pager-btn.ncv3-spinning{animation:ncv3-spin .7s linear}
@keyframes ncv3-spin{to{transform:rotate(360deg)}}

/* favorites grid */
.ncv3 .ncv3-favgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.ncv3 .ncv3-fcard{background:#fff;border:1.5px solid var(--ncv3-line);border-radius:20px;box-shadow:0 4px 16px rgba(14,45,82,.07);overflow:hidden}
.ncv3 .ncv3-fcard[data-detail-url]{cursor:pointer}
.ncv3 .ncv3-fcard-av{position:relative;height:186px;display:flex;align-items:center;justify-content:center}
.ncv3 .ncv3-fcard-av .ncv3-tinitial{font-size:58px}
.ncv3 .ncv3-fcard-heart{position:absolute;top:12px;right:14px;color:#F1890E;cursor:pointer;user-select:none;line-height:0}
.ncv3 .ncv3-fcard-b{padding:13px 15px 15px}
.ncv3 .ncv3-fcard-name{display:flex;align-items:center;gap:8px;font-size:17px;font-weight:900;color:var(--ncv3-navy2)}
.ncv3 .ncv3-fcard-loc{display:flex;align-items:center;gap:7px;font-size:13px;color:var(--ncv3-muted2);font-weight:600;margin:6px 0}
.ncv3 .ncv3-loc-dot{width:8px;height:8px;border-radius:50%;background:#ef4444;flex:none}
.ncv3 .ncv3-fcard-rate{font-size:14px;color:var(--ncv3-navy2);font-weight:800;margin-bottom:6px}
.ncv3 .ncv3-star{color:var(--ncv3-gold)}
.ncv3 .ncv3-muted{color:var(--ncv3-muted);font-weight:600}
.ncv3 .ncv3-fcard-coin{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:800;color:var(--ncv3-navy2)}
.ncv3 .ncv3-fcard-coin .coin,.ncv3 .ncv3-hero-coins .coin,.ncv3 .ncv3-lc-coins .coin{width:18px;height:18px}
.ncv3 .ncv3-morelink{display:inline-block;margin-top:14px;color:var(--ncv3-cyan-d);font-weight:800;font-size:14px;text-decoration:underline;cursor:pointer}

/* available-tutors toolbar */
.ncv3 .ncv3-avail{margin-top:26px}
.ncv3 .ncv3-avail-count{font-size:15px;color:var(--ncv3-muted2);font-weight:600;margin-left:8px}
.ncv3 .ncv3-avail-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.ncv3 .ncv3-tool-l{font-size:12px;color:var(--ncv3-muted3);font-weight:600}
.ncv3 .ncv3-sortsel{background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:999px;padding:9px 34px 9px 18px;font-weight:800;font-size:14px;color:var(--ncv3-navy2);cursor:pointer;appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path fill='%238295a8' d='M1 1l5 5 5-5'/></svg>");background-repeat:no-repeat;background-position:right 14px center}
.ncv3 .ncv3-views{display:flex;gap:6px}
.ncv3 .ncv3-view{width:38px;height:38px;border-radius:11px;border:1.5px solid var(--ncv3-line2);background:#fff;color:var(--ncv3-muted3);cursor:pointer;font-size:15px;display:inline-flex;align-items:center;justify-content:center}
.ncv3 .ncv3-view--on{background:var(--ncv3-teal);border-color:var(--ncv3-teal);color:#fff}

/* rich LIST-view teacher card */
.ncv3 .ncv3-tutors{display:flex;flex-direction:column;gap:16px}
.ncv3 .ncv3-lc{display:flex;gap:22px;background:#fff;border:1.5px solid var(--ncv3-line);border-radius:20px;box-shadow:0 4px 16px rgba(14,45,82,.07);padding:22px 24px}
.ncv3 .ncv3-lc-av{width:128px;height:128px;flex:none;border-radius:18px;display:flex;align-items:center;justify-content:center}
.ncv3 .ncv3-lc-av .ncv3-tinitial{font-size:46px}
.ncv3 .ncv3-lc-main{flex:1;min-width:0}
.ncv3 .ncv3-lc-name{display:flex;align-items:center;gap:9px;font-size:20px;font-weight:900;color:var(--ncv3-navy2)}
.ncv3 .ncv3-lc-name .ncv3-dot{width:11px;height:11px;border-radius:50%}
.ncv3 .ncv3-lc-age{font-size:12px;color:var(--ncv3-muted2);font-weight:700;margin-left:2px}
.ncv3 .ncv3-lc-flag{font-size:17px}
.ncv3 .ncv3-lc-speaks{font-size:13px;color:var(--ncv3-muted2);font-weight:600;margin:7px 0}
.ncv3 .ncv3-caret{color:var(--ncv3-muted3)}
.ncv3 .ncv3-lc-tag{font-size:14px;color:var(--ncv3-navy2);line-height:1.5;margin-bottom:6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:anywhere;word-break:break-word}
.ncv3 .ncv3-lc-tag.is-open{display:block;-webkit-line-clamp:none;overflow:visible;text-overflow:clip}
.ncv3 .ncv3-lc-tag b{font-weight:800}
.ncv3 .ncv3-lc-more{color:var(--ncv3-navy2);font-weight:700;font-size:13px;text-decoration:underline;cursor:pointer}
.ncv3 .ncv3-lc-pop{font-size:12px;color:var(--ncv3-muted2);font-weight:600;margin-top:9px}
.ncv3 .ncv3-lc-pop b{color:var(--ncv3-navy2)}
.ncv3 .ncv3-lc-side{width:236px;flex:none;border-left:1.5px solid var(--ncv3-line);padding-left:22px;display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.ncv3 .ncv3-lc-coins{display:flex;align-items:center;justify-content:space-between;width:100%}
.ncv3 .ncv3-lc-coins-l{display:flex;align-items:center;gap:6px;font-size:14px;color:var(--ncv3-muted);font-weight:700}
.ncv3 .ncv3-lc-coins-l b{font-size:22px;font-weight:900;color:var(--ncv3-navy2)}
.ncv3 .ncv3-lc-fav{color:#c6d2df;cursor:pointer;line-height:0}
.ncv3 .ncv3-lc-fav.on{color:#F1890E}
.ncv3 .ncv3-heart{width:21px;height:auto;fill:currentColor;display:block;pointer-events:none;transition:color .15s}
.ncv3 .ncv3-lc-stats{display:flex;gap:18px}
.ncv3 .ncv3-lc-stats div{display:flex;flex-direction:column;line-height:1.2}
.ncv3 .ncv3-lc-stats b{font-size:15px;font-weight:900;color:var(--ncv3-navy2)}
.ncv3 .ncv3-lc-stats span{font-size:11px;color:var(--ncv3-muted);font-weight:600}
.ncv3 .ncv3-lc-specs{display:flex;flex-wrap:wrap;gap:7px}
.ncv3 .ncv3-lc-spec{background:#fdecd8;color:var(--ncv3-orange-d);border-radius:999px;padding:6px 14px;font-size:12px;font-weight:800}
.ncv3 .ncv3-btn-profile{display:block;box-sizing:border-box;text-align:center;text-decoration:none;width:100%;background:var(--ncv3-cyan);border:none;border-radius:13px;padding:13px;font-weight:800;font-size:14px;color:#fff;cursor:pointer}
.ncv3 .ncv3-btn-profile:hover{background:var(--ncv3-cyan-d);color:#fff}
.ncv3 .ncv3-fcard-heart.off{color:#c6d2df}

/* 2-COLUMN view */
.ncv3 .ncv3-twocol{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ncv3 .ncv3-2c{background:#fff;border:1.5px solid var(--ncv3-line);border-radius:20px;box-shadow:0 4px 16px rgba(14,45,82,.07);padding:18px 20px;display:flex;flex-direction:column;gap:14px}
.ncv3 .ncv3-2c-top{display:flex;gap:16px}
.ncv3 .ncv3-2c-av{width:96px;height:96px;flex:none;border-radius:16px;display:flex;align-items:center;justify-content:center}
.ncv3 .ncv3-2c-av .ncv3-tinitial{font-size:38px}
.ncv3 .ncv3-2c-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.ncv3 .ncv3-2c-name{display:flex;align-items:center;gap:8px;font-size:18px;font-weight:900;color:var(--ncv3-navy2)}
.ncv3 .ncv3-2c-btns{display:flex;gap:10px}
.ncv3 .ncv3-btn-lesson{flex:1;background:var(--ncv3-cyan);border:none;border-radius:12px;padding:12px;font-weight:800;font-size:14px;color:#fff;cursor:pointer}
.ncv3 .ncv3-btn-lesson:hover{background:var(--ncv3-cyan-d)}
.ncv3 .ncv3-btn-outline2{flex:1;display:flex;align-items:center;justify-content:center;box-sizing:border-box;text-decoration:none;background:#fff;border:1.5px solid var(--ncv3-line2);border-radius:12px;padding:12px;font-weight:800;font-size:14px;color:var(--ncv3-navy2);cursor:pointer}
.ncv3 .ncv3-btn-outline2:hover{border-color:var(--ncv3-muted3);color:var(--ncv3-navy2)}

/* launcher text + welcome buttons */
.ncv3-launcher-txt{display:flex;flex-direction:column;line-height:1.15;text-align:left}
.ncv3-launcher-txt .s{font-size:11px;font-weight:600;color:#d4f6f1}
.ncv3-launcher-txt .l{font-size:16px;font-weight:800}
.ncv3-wel-btns{display:flex;gap:12px;justify-content:center;margin-top:30px}

@media (max-width:1080px){.ncv3 .ncv3-favgrid{grid-template-columns:repeat(2,1fr)}.ncv3 .ncv3-lc{flex-wrap:wrap}.ncv3 .ncv3-lc-side{width:100%;border-left:none;border-top:1.5px solid var(--ncv3-line);padding-left:0;padding-top:16px}}

/* ── Teddy loader (shared pattern from DEV) ── */
.ncv3-teddy-box{display:flex;flex-direction:column;align-items:center;gap:10px;background:rgba(255,255,255,.9);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border-radius:22px;padding:20px 34px;box-shadow:0 14px 40px rgba(31,45,61,.16)}
.ncv3-teddy-box img{width:110px;height:110px;object-fit:contain;animation:ncv3-teddy-bob 1.05s ease-in-out infinite}
.ncv3-teddy-txt{font-weight:800;font-size:14px;color:var(--ncv3-navy2);letter-spacing:.02em}
@keyframes ncv3-teddy-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
/* main-list search/refresh loader (re-applied from DEV 40f29f6) */
#ncv3-tutor-list-wrap{position:relative}
.ncv3-teddy-loader{position:absolute;inset:0;display:none;z-index:20;pointer-events:none}
.ncv3-teddy-loader.is-on{display:block}
.ncv3-teddy-loader .ncv3-teddy-box{position:sticky;top:110px;width:-moz-max-content;width:max-content;margin:70px auto}

/* ── Favorites: teddy carousel overlay + toast + unfavorite confirm modal (NJ-98425) ── */
.ncv3 .ncv3-sec[data-tour="favorites"]{position:relative}
.ncv3-fav-teddy{position:absolute;inset:0;z-index:30;display:none;align-items:center;justify-content:center;background:rgba(253,245,236,.74);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border-radius:20px}
.ncv3-fav-teddy.is-on{display:flex}

.ncv3-toast{position:fixed;left:50%;bottom:32px;transform:translateX(-50%) translateY(20px);z-index:100050;display:flex;align-items:center;gap:10px;background:#16263a;color:#fff;font-weight:800;font-size:14px;padding:14px 22px;border-radius:999px;box-shadow:0 12px 34px rgba(12,39,72,.32);opacity:0;pointer-events:none;transition:opacity .25s,transform .25s}
.ncv3-toast.is-on{opacity:1;transform:translateX(-50%) translateY(0)}
.ncv3-toast .ncv3-toast-ic{font-size:17px;line-height:1}

.ncv3-fav-scrim{position:fixed;inset:0;z-index:100040;background:rgba(12,39,72,.55);display:none;align-items:center;justify-content:center;padding:20px;animation:ncv3-fade .2s ease both}
.ncv3-fav-scrim.is-on{display:flex}
.ncv3-fav-modal{background:#fff;border-radius:22px;padding:34px 34px 26px;width:400px;max-width:100%;box-shadow:0 24px 60px rgba(12,39,72,.3);text-align:center;font-family:"Noto Sans JP",sans-serif;animation:ncv3-pop .28s ease both}
.ncv3-fav-modal h3{font-size:20px;font-weight:900;color:var(--ncv3-navy2);margin:0 0 10px}
.ncv3-fav-modal p{font-size:14px;color:var(--ncv3-muted2);margin:0 0 24px;line-height:1.55}
.ncv3-fav-modal-btns{display:flex;gap:12px}
.ncv3-fav-modal-btns button{flex:1;border:none;cursor:pointer;border-radius:14px;padding:14px;font-weight:800;font-size:15px;font-family:inherit}
.ncv3-fav-cancel{background:#eef2f7;color:var(--ncv3-navy2)}
.ncv3-fav-remove{background:#f0295d;color:#fff;box-shadow:0 4px 0 #c21146}
.ncv3-fav-remove:active{transform:translateY(3px);box-shadow:0 1px 0 #c21146}

/* ── Important announcements banner (reused Elements/important_announcements.php; v2-themed, rem→px) ── */
.ncv3 .important-announcements-container{background:#fdecec;border:1.5px solid #f3c9c9;border-radius:18px}
/* content-box so jQuery slideUp/Down (height + padding) animates smoothly, matching legacy */
.ncv3 .important-announcements-container .announcement-group{box-sizing:content-box;padding:12px 20px;border-bottom:1px solid #f2d6d6}
.ncv3 .important-announcements-container .announcement-group:last-child{border-bottom:none}
.ncv3 .important-announcements-container .announcement-group:last-child{border-bottom:none}
.ncv3 .important-announcements-container .announcement-item{display:flex;align-items:center;justify-content:space-between;gap:14px}
.ncv3 .important-announcements-container .announcement-header{display:flex;align-items:center;gap:12px;min-width:0}
.ncv3 .important-announcements-container .announcement-tag{flex:none;color:#fff;background:#e0245e;padding:5px 14px;border-radius:999px;font-size:12px;font-weight:800;white-space:nowrap}
.ncv3 .important-announcements-container .announcement-content{color:#c81e4f;font-weight:800;font-size:14px;text-decoration:underline;cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0}
.ncv3 .important-announcements-container .announcement-details{display:flex;align-items:center;gap:14px;flex:none}
.ncv3 .important-announcements-container .announcement-count{color:var(--ncv3-navy2);font-size:13px;font-weight:600;white-space:nowrap}
.ncv3 .important-announcements-container .announcement-toggle{cursor:pointer;line-height:0}
.ncv3 .important-announcements-container .announcement-toggle .on,.ncv3 .important-announcements-container .announcement-toggle .off{box-sizing:border-box;padding:6px;width:28px;height:28px;border-radius:50%}
.ncv3 .important-announcements-container .announcement-toggle .on{background:#798998}
.ncv3 .important-announcements-container .announcement-toggle .off{background:#e0245e}
.ncv3 .important-announcements-container .announcement-toggle.on .off{display:none}
.ncv3 .important-announcements-container .announcement-toggle.off .on{display:none}
.ncv3 .important-announcements-container .announcement-group:not(:first-child) .announcement-details{display:none}
/* announcement modal prev/next arrows (modal lives OUTSIDE .ncv3) */
.dialog_important_information .arrow{position:absolute;top:50%;transform:translateY(-50%);width:24px;height:40px;cursor:pointer}
.dialog_important_information .arrow.prev{left:14px}
.dialog_important_information .arrow.next{right:14px}
.dialog_important_information .arrow.disabled{opacity:.3;pointer-events:none;cursor:default}

/* ── Campaign PC banner interleaved into the tutor list (BE requirement; all 3 views) ── */
.ncv3 .ncv3-list-banner{margin:6px 0;width:100%}
.ncv3 .ncv3-favgrid .ncv3-list-banner,.ncv3 .ncv3-twocol .ncv3-list-banner{grid-column:1/-1} /* span full width inside the grids */
.ncv3 .ncv3-list-banner .banner_area{border-radius:16px;overflow:hidden;box-shadow:0 4px 16px rgba(14,45,82,.06)}
.ncv3 .ncv3-list-banner .fio_banner{display:block;line-height:0}
.ncv3 .ncv3-list-banner img{display:block;width:100%;height:auto}

@media (prefers-reduced-motion:reduce){.ncv3 *,.ncv3-spot,.ncv3-wel,.ncv3-wel .mascot,.ncv3-launcher,.ncv3-teddy-box img{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition:none !important}}
