/* 会員の画面の見た目（1 本）。CMO 設計書 第2版 design/2026-11-11_会員の画面_設計書.md §3・§3-1・§4 と見本 2026-11-11_会員の画面_見本.html の CSS を写した（見本の CSS が正＝§8 の 11）。
   見本からの違い：見本の切り替えの帯（.proto・.memo）を外した／見本で style 属性に書いていた値をクラスにした（CSP がインラインを止めるため）／
   会員証のロゴは下の .fruit に data: で持つ（元 Organization/CTO/Output/Webサイト/実装/2026-06-17_grapetime-top-production/assets/logo/logo_trans_white.png・加工なし）／
   入口の札と行の印は本物のアイコン（public/apps/<app>.svg）を入れる形にした／下の知らせは画面の下に固定した。
   作成日：2026-11-11 ／ 担当：CTO（見た目は CMO）／ 仕様：docs/仕様書/10_部品/10_画面.md */
:root{
  color-scheme:light;
  /* 図鑑 design-vars.css・しらべ app.css と同じ名前・同じ値 */
  --page:#EEEDF1; --paper:#FFFFFF; --surface:#F4F3F7; --surface-2:#F7F2F6;
  --ink:#1C1720; --ink-2:#655C6B; --ink-3:#756A73;
  --rule:#E8E5EC; --rule-2:#CFC9D6; --rule-3:#A08F9C;
  --plum:#500046; --plum-ink:#320028; --plum-bright:#920783; --plum-soft:#F3ECF2;
  --focus-ring:var(--plum-bright);
  --tap:44px; --r-card:14px; --r-ctl:12px; --r-pill:999px;
  --sans:"Noto Sans JP","Hiragino Sans",system-ui,sans-serif;
  --num:"Inter","Noto Sans JP",system-ui,sans-serif;
  /* 会員の画面で足す名前（値はデザインシステムの状態色・ゴールド） */
  --field-line:#756A73;
  --danger:#ce0000; --caution:#ac3e00; --ok:#115a36;
  --gold:#D4B57E;
  --on-plum:#FFFFFF; --on-plum-2:#E9D3E6;
  --scrim:rgba(28,23,32,.42);
  --gut:max(16px,env(safe-area-inset-left,0px)); --gut-r:max(16px,env(safe-area-inset-right,0px));
}
*{box-sizing:border-box}
body{margin:0;font-family:var(--sans);font-size:16px;line-height:1.7;letter-spacing:.02em;color:var(--ink);background:var(--page);-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:100%}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0} h1,h2,h3,b,strong{font-weight:500} ul,ol{padding:0;list-style:none}
button,input,select{font:inherit;color:inherit}
button{background:none;border:0;padding:0;cursor:pointer;text-align:left;-webkit-tap-highlight-color:transparent}
a{color:var(--plum);text-underline-offset:3px;-webkit-tap-highlight-color:transparent}
.num{font-family:var(--num);font-variant-numeric:tabular-nums lining-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{overflow-wrap:anywhere}
/* 焦点の輪：紫 1 本。指で押したときは描かない（Tab の印 html[data-kb] があるときだけ） */
:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
html:not([data-kb]) :focus-visible{outline:none!important}
[tabindex="-1"]:focus{outline:none}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ===== 器 ===== */
.shell{max-width:560px;margin:0 auto;background:var(--paper);min-height:100vh;min-height:100dvh;position:relative;overflow:hidden;padding-bottom:env(safe-area-inset-bottom,0px)}
.top{padding:0 var(--gut-r) 0 var(--gut);box-shadow:0 .5px 0 var(--rule);padding-top:env(safe-area-inset-top,0px)}
.nav{display:flex;align-items:center;gap:8px;min-height:48px}
.nav h1{font-size:17px;line-height:1.3;letter-spacing:.02em;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nav h1.sr{flex:none}
.nav .brand-sub{flex:none;font-size:14px;color:var(--ink-2);line-height:1.3}
.nav .brand-sub.end{margin-left:auto}
.nav .back{text-decoration:none;display:inline-flex;align-items:center;gap:4px;min-height:var(--tap);padding-right:8px;color:var(--plum);font-size:17px;white-space:nowrap;flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.nav .back svg{width:12px;height:20px;flex:none}
.pad{padding:24px var(--gut-r) 48px var(--gut);display:flex;flex-direction:column;gap:24px}
.pad.g32{gap:32px}
.h{font-size:24px;line-height:1.35;letter-spacing:.01em;word-break:auto-phrase}
.h3{font-size:20px;line-height:1.4}
.cap{font-size:14px;font-weight:400;line-height:1.4;color:var(--ink-2)}
.lead{color:var(--ink)}
.note{font-size:16px;line-height:1.7;color:var(--ink-2)}
.stack{display:flex;flex-direction:column;gap:12px}
.stack.g4{gap:4px} .stack.g16{gap:16px} .stack.g10{gap:10px} .stack.g24{gap:24px} .stack.g40{gap:40px}
.gh{font-size:14px;color:var(--ink-2);line-height:1.4;padding:0 var(--gut-r) 8px var(--gut)}
.gh.mt{margin-top:32px}
.links{display:flex;flex-wrap:wrap;gap:0 20px}
.mecard{padding:20px var(--gut-r) 24px var(--gut)}
.foot1{padding:24px var(--gut-r) 8px var(--gut);gap:4px 20px}
.foot2{padding:8px var(--gut-r) 40px var(--gut)}
.m0{margin:0!important} .mb12{margin-bottom:12px!important}
.pad.pb32{padding-bottom:32px} .pad.pt32{padding-top:32px}

/* 入口の絵：アプリの一覧を 1 本の枝に並べる（1 つでも 5 つでも同じ形。3 列で折り返す） */
.apps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 0;margin:0}
.apps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 2px 0;font-size:14px;line-height:1.4;letter-spacing:0;color:var(--ink-2);text-align:center;overflow-wrap:anywhere;word-break:auto-phrase}
.apps li::before{content:"";position:absolute;left:0;right:0;top:0;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 22' preserveAspectRatio='none'%3E%3Cg fill='none' stroke='%23A08F9C' stroke-width='1.6' stroke-linecap='round'%3E%3Cpath vector-effect='non-scaling-stroke' d='M0 8c20-8 40 8 60 0s40 8 60 0'/%3E%3Cpath vector-effect='non-scaling-stroke' d='M60 8v14'/%3E%3C/g%3E%3C/svg%3E") center/100% 100% no-repeat}
.apps .tile{width:56px;height:56px;border-radius:14px;background:var(--plum-soft);display:grid;place-items:center;overflow:hidden}
.apps .tile img{width:56px;height:56px;display:block}
.apps .tile .gi{width:34px;height:34px}
/* 第5版 §8 の 23：無料会員で使えないアプリの札（淡く・名前の下に「〔使える会員の種類〕が使えます」） */
.apps li b{font-weight:400;color:var(--ink)}
.apps li small{display:block;font-size:14px;margin-top:2px}
.apps li small span{white-space:nowrap}
.apps li.off .tile{opacity:.5}

/* 欄 */
.fld label,.lbl{display:block;font-size:16px;font-weight:500;line-height:1.6;margin-bottom:8px}
.fs{border:0;padding:0;margin:0;min-width:0}
.fs legend.lbl{padding:0}
.fld .help{font-size:16px;color:var(--ink-2);line-height:1.7;margin-top:8px}
.inp{width:100%;height:52px;border-radius:var(--r-ctl);border:1px solid var(--field-line);background:var(--paper);padding:0 14px;font-size:17px;caret-color:var(--plum-bright);-webkit-appearance:none;appearance:none}
.inp[aria-invalid="true"]{border:2px solid var(--danger);padding:0 13px}
.inp.code{font-family:var(--num);font-variant-numeric:tabular-nums lining-nums;font-size:28px;letter-spacing:.32em;height:64px;text-align:center;padding-left:.32em}
.inp.code[aria-invalid="true"]{padding-left:.32em}
.inp:disabled{background:var(--surface);color:var(--ink-2);border-color:var(--rule-2)}
/* 欄の下の知らせ：記号＋文。色だけにしない */
.msg{display:flex;gap:8px;align-items:flex-start;font-size:16px;line-height:1.7;margin-top:8px}
.msg i{flex:none;width:22px;height:22px;border-radius:11px;margin-top:3px;font-style:normal;font-size:14px;font-weight:500;line-height:22px;letter-spacing:0;text-align:center;color:var(--paper);background:var(--danger)}
.msg.info i{background:var(--ink-2)}
.msg.ok i{background:var(--ok)}
.box{background:var(--surface);border-radius:var(--r-card);padding:16px}

/* ボタン：塗り／輪郭／文字の 3 段 */
.btn{text-decoration:none;display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:52px;border-radius:var(--r-ctl);padding:8px 16px;font-size:17px;font-weight:500;line-height:1.3;text-align:center;background:var(--plum);color:var(--on-plum)}
.btn:active{background:var(--plum-ink)}
.btn.ghost{background:var(--paper);color:var(--plum-ink);box-shadow:inset 0 0 0 1px var(--field-line)}
.btn.ghost:active{background:var(--surface)}
.btn.ghost.del{color:var(--danger);box-shadow:inset 0 0 0 1px var(--danger)}
.btn[aria-disabled="true"]{background:var(--surface);color:var(--ink-2);box-shadow:none;cursor:default}
.btn.busy[aria-disabled="true"]{background:var(--plum);color:var(--on-plum)}
.tbtn{display:inline-flex;align-items:center;min-height:var(--tap);color:var(--plum);font-size:16px;text-decoration:underline;text-underline-offset:3px}
.tbtn.del{color:var(--danger);text-decoration:none}
.tbtn.center{align-self:center}
.spin{width:18px;height:18px;border-radius:9px;border:2px solid var(--on-plum-2);border-top-color:var(--on-plum);animation:sp .9s linear infinite}
@keyframes sp{to{transform:rotate(360deg)}}

/* チェック（ラベル全体が押せる） */
.chk{position:relative;display:flex;gap:12px;align-items:flex-start;min-height:var(--tap);padding:8px 0;cursor:pointer}
.chk .tx > .badge{display:table;margin:2px 0 8px}
.chk input{position:absolute;opacity:0;width:28px;height:28px;margin:0}
.chk .bx{flex:none;width:28px;height:28px;border-radius:8px;border:2px solid var(--field-line);background:var(--paper);display:grid;place-items:center;margin-top:0}
.chk .bx svg{width:18px;height:18px;opacity:0}
.chk input:checked + .bx{background:var(--plum);border-color:var(--plum)}
.chk input:checked + .bx svg{opacity:1}
.chk input:focus-visible + .bx{outline:3px solid var(--focus-ring);outline-offset:2px}
html:not([data-kb]) .chk input:focus-visible + .bx{outline:none}
.chk.bad .bx{border-color:var(--danger)}
.chk .tx{flex:1;min-width:0}
.badge{display:inline-block;font-size:14px;line-height:1;padding:5px 8px;border-radius:6px;margin-right:8px;vertical-align:2px;font-weight:500}
.badge.req{background:var(--plum);color:var(--on-plum)}

/* 1 つ選ぶ列（✓ の位置で示す） */
.opts{border:1px solid var(--rule-2);border-radius:var(--r-card);overflow:hidden}
.opts label{position:relative;display:flex;align-items:center;gap:12px;min-height:52px;padding:8px 14px;border-top:1px solid var(--rule);cursor:pointer}
.opts label:first-child{border-top:0}
.opts input{position:absolute;opacity:0}
.opts .ck{margin-left:auto;width:20px;height:20px;flex:none;opacity:0;color:var(--plum)}
.opts input:checked ~ .ck{opacity:1}
.opts input:checked ~ span{font-weight:500;color:var(--plum-ink)}
.opts label:has(input:focus-visible){outline:3px solid var(--focus-ring);outline-offset:-3px}
html:not([data-kb]) .opts label:has(input:focus-visible){outline:none}

/* 確定文の囲み：読む文＝淡い面（枠なし）。操作する物（欄・選ぶ列・ボタン）＝枠。段落の間は 16px */
.law{background:var(--surface);border-radius:var(--r-card);padding:16px;font-size:16px;line-height:1.7}
.law p + p{margin-top:16px}
.law p{text-wrap:pretty}
.law p.lawh{font-weight:500}
.law p.li{padding-left:1em;text-indent:-1em}
.law p.li + p.li{margin-top:12px}
.law a{word-break:break-all}

/* 進みぐあい（登録のときだけ） */
.steps{display:flex;align-items:center;gap:8px;font-size:14px;line-height:1.3;color:var(--ink-2)}
.steps li{display:flex;align-items:center;gap:6px}
.steps .d{width:22px;height:22px;border-radius:11px;display:grid;place-items:center;font-family:var(--num);font-size:14px;background:var(--surface);color:var(--ink-2)}
.steps .done .d{background:var(--plum-soft);color:var(--plum)}
.steps .now{color:var(--plum-ink);font-weight:500}
.steps .now .d{background:var(--plum);color:var(--on-plum)}
.steps .bar{flex:1;height:1px;background:var(--rule-2);min-width:12px}

/* 会員証（この画面のただ 1 つの主役） */
.card{position:relative;border-radius:18px;background:var(--plum);color:var(--on-plum);padding:18px 20px 16px;overflow:hidden;box-shadow:0 1px 2px rgba(28,23,32,.08),0 10px 28px rgba(80,0,70,.22)}
.card.ph{min-height:168px;background:var(--surface);box-shadow:none}
.box.ph{height:120px}
.card .ttl{font-size:14px;line-height:1.3;color:var(--gold);letter-spacing:.08em}
.card .name{font-size:26px;line-height:1.35;margin-top:14px;padding-right:96px;overflow-wrap:anywhere}
.card .name small{font-size:16px;margin-left:4px;color:var(--on-plum-2)}
.card .name.none{font-size:17px;color:var(--on-plum-2)}
.card .row{display:flex;flex-wrap:wrap;gap:4px 20px;margin-top:16px;padding-top:12px;border-top:1px solid rgba(212,181,126,.45);font-size:14px;line-height:1.4;color:var(--on-plum-2)}
.card .row b{display:block;font-size:17px;color:var(--on-plum);font-weight:400}
.card .fruit{position:absolute;right:16px;top:14px;width:80px;height:80px;opacity:.94;background:url("data:image/png;base64,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") center/contain no-repeat}

/* 行の束（設定の形） */
.grp{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.r{display:flex;align-items:center;gap:12px;min-height:60px;padding:12px var(--gut-r) 12px var(--gut);border-top:1px solid var(--rule);width:100%;text-decoration:none;color:inherit}
.r:first-child{border-top:0}
button.r:active,a.r:active{background:var(--surface)}
.r .t{flex:1;min-width:0}
.r .t b{display:block;font-size:17px;line-height:1.35}
.r .t small{display:block;font-size:16px;color:var(--ink-2);line-height:1.6;overflow-wrap:anywhere}
.r .v{color:var(--ink-2);font-size:16px;max-width:50%;text-align:right;overflow-wrap:anywhere}
.r .chev{width:9px;height:16px;color:var(--rule-3);flex:none}
.r .ic{width:40px;height:40px;border-radius:10px;background:var(--plum-soft);display:grid;place-items:center;flex:none;overflow:hidden}
.r .ic img{width:40px;height:40px;display:block}
.r .ic .gi{width:26px;height:26px}
/* 第5版 §8 の 26：使えないアプリの行（押せない・› なし） */
.r.off .ic{opacity:.5}
.r.off .t b{color:var(--ink-2)}
.r.col{flex-direction:column;align-items:stretch;gap:8px;padding-top:16px;padding-bottom:12px}
.r.col .t{font-size:16px;line-height:1.7}
.swrow{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:var(--tap);cursor:pointer}
.r.center{justify-content:center;color:var(--danger);font-size:17px}
.sw{position:relative;width:51px;height:31px;display:block;flex:none}
.sw input{position:absolute;inset:0;opacity:0;margin:0;width:100%;height:100%;cursor:pointer}
.sw .tr{position:absolute;inset:0;border-radius:16px;background:var(--field-line);transition:background .2s;pointer-events:none}
.sw .tr::after{content:"";position:absolute;left:2px;top:2px;width:27px;height:27px;border-radius:14px;background:var(--paper);box-shadow:0 1px 3px rgba(28,23,32,.3);transition:transform .2s}
.sw input:checked + .tr{background:var(--plum)}
.sw input:checked + .tr::after{transform:translateX(20px)}
.sw input:focus-visible + .tr{outline:3px solid var(--focus-ring);outline-offset:2px}
html:not([data-kb]) .sw input:focus-visible + .tr{outline:none}
.swst{font-size:17px;line-height:1.4}

/* 退会の確認：「・」は確定文のまま、ぶら下げで見せる */
.warn li{padding-left:1em;text-indent:-1em;margin-top:16px}
.warn li:first-child{margin-top:0}
.warn li .note{text-indent:0}

/* 知らせ（下）とダイアログ */
.toast{position:fixed;left:0;right:0;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:30;margin:0 auto;width:calc(100% - 24px);max-width:536px;background:var(--ink);color:var(--paper);border-radius:14px;padding:12px 14px;display:flex;gap:10px;align-items:flex-start;font-size:16px;line-height:1.5;box-shadow:0 8px 28px rgba(28,23,32,.25)}
.toast i{flex:none;width:22px;height:22px;border-radius:11px;background:#51b883;color:var(--ink);font-style:normal;font-size:14px;line-height:22px;text-align:center;margin-top:1px}
.toast.fail i{background:var(--danger);color:var(--paper)}
.dlgw{position:fixed;inset:0;background:var(--scrim);display:flex;align-items:flex-end;justify-content:center;padding:16px;z-index:20;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}
.dlg{width:100%;max-width:420px;max-height:100%;overflow-y:auto;background:var(--paper);border-radius:18px;padding:24px 16px 16px;display:flex;flex-direction:column;gap:16px}
.dlg h2{font-size:20px;line-height:1.4}

/* 管理画面（オーナーだけ・簡素。見本 #admin・#adminm） */
.kpi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:var(--r-card);overflow:hidden;margin:0}
.kpi div{background:var(--paper);padding:12px 14px}
.kpi dt{font-size:14px;color:var(--ink-2);line-height:1.4}
.kpi dd{font-family:var(--num);font-variant-numeric:tabular-nums lining-nums;font-size:28px;line-height:1.3}
.kpi dd small{font-family:var(--sans);font-size:14px;color:var(--ink-2);margin-left:2px}
.kv{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 16px;font-size:16px;margin:0}
.kv dt{color:var(--ink-2)} .kv dd{overflow-wrap:anywhere}
.adm{box-shadow:inset 0 3px 0 var(--ink)}

/* 全面のお知らせ（エラー） */
.full{padding:56px var(--gut-r) 48px var(--gut);display:flex;flex-direction:column;gap:16px}
.full .mark{width:56px;height:56px;border-radius:28px;background:var(--surface);display:grid;place-items:center;color:var(--ink-2);font-size:28px;line-height:1;font-family:var(--num)}

/* 会員規約・プライバシーポリシーのページ（src/legal.js）。仮の見た目：見出しの大きさ・番号のぶら下げ・下のリンクの語は CMO が決める（CFO 確定文 §12 第7版の CMO） */
.legal{gap:0;font-size:16px;line-height:1.8}
.legal section + section{margin-top:24px}
.legal .h{margin-bottom:8px}
.legal .date{color:var(--ink-2);font-size:14px}
.legal .lh{font-size:18px;font-weight:500;line-height:1.5;margin-bottom:8px;scroll-margin-top:16px}
.legal .lh3{font-size:17px;font-weight:500;line-height:1.5;margin-bottom:4px}
.legal p + p{margin-top:8px}
.legal p.li{padding-left:1.6em;text-indent:-1.6em}
.legal a{color:var(--plum);word-break:break-all;text-underline-offset:3px}
.legal-foot{padding-top:0}
.legal-foot .links a{display:inline-flex;align-items:center;min-height:var(--tap);color:var(--plum);font-size:16px;text-underline-offset:3px}