/* 発行画面（share-app）だけの見た目。共通の黒赤は pass-base.css。
   フォントはシステムのもの（外部からの読み込みなし） */

[hidden]{display:none !important;}
.mono{font-family:'SF Mono',Menlo,monospace;}
.muted{color:var(--muted);}
a.btn{text-decoration:none;}
.copy-buf{position:fixed;left:-9999px;top:0;width:1px;height:1px;opacity:0;}

/* ---------- 最初の表示を決めるまで（boot.js が html に booting を付ける） ---------- */
.boot{display:none;flex:1;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:60px 16px;color:var(--muted);font-size:12px;letter-spacing:.1em;}
html.booting .boot{display:flex;}
html.booting #landing,html.booting #main{display:none !important;}
#main{flex:1;display:flex;flex-direction:column;}

/* ---------- ヘッダー ---------- */
.brand{display:flex;align-items:baseline;gap:10px;color:var(--text);text-decoration:none;min-width:0;}
.brand-mark{font-size:21px;font-weight:900;letter-spacing:.01em;line-height:1;}
.brand-sub{font-size:11px;font-weight:700;letter-spacing:.14em;color:var(--muted);white-space:nowrap;}
.brand:hover .brand-mark{color:#fff;opacity:.85;}
.hdr-right{margin-left:auto;display:flex;align-items:center;gap:12px;min-width:0;}
.hdr-right .pill{margin-left:0;}
.hdr-user{font-size:11px;color:var(--muted);max-width:300px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.hdr-btn{flex:none;background:none;border:1px solid var(--line);color:var(--muted);font-family:inherit;font-size:11px;padding:6px 12px;cursor:pointer;transition:color .15s,border-color .15s;}
.hdr-btn:hover:not(:disabled){color:var(--text);border-color:var(--muted);}
.hdr-btn:disabled{opacity:.5;cursor:default;}
body.rv .header .pill{background:var(--red);border-color:var(--red);color:#fff;}
@media (max-width:760px){.hdr-user{display:none;}}
@media (max-width:480px){.brand-sub{display:none;}}

/* ---------- ログイン前（Google の確認用のトップページ） ---------- */
.card.wide{max-width:600px;}
.lead{font-size:13px;line-height:2;color:#d8d8d8;margin-bottom:18px;}
.points{list-style:none;display:grid;gap:9px;margin:0 0 24px;}
.points li{position:relative;padding-left:18px;font-size:12.5px;line-height:1.9;color:var(--muted);}
.points li::before{content:'';position:absolute;left:0;top:.95em;width:8px;height:2px;background:var(--red);}
.points b{color:var(--text);font-weight:700;}
.start-note{font-size:11px;color:var(--dim);line-height:1.8;margin-top:8px;}
.landing-links{margin-top:20px;font-size:11px;}
.landing-links a{color:var(--muted);}
.landing-links a:hover{color:var(--red);}
#landing .blocked,#landing .info{margin-bottom:6px;text-align:left;}
.info{border:1px solid var(--line);background:var(--panel2);color:#d0d0d0;padding:11px 14px;font-size:11.5px;line-height:1.8;margin-bottom:14px;}

/* ---------- 2段階認証 ---------- */
.card .blocked{margin-bottom:14px;text-align:left;}
.enroll{margin-bottom:6px;}
.qr{display:flex;justify-content:center;background:#fff;padding:12px;margin:0 auto 14px;width:max-content;}
.qr img{display:block;width:200px;height:200px;}
.secret{border:1px solid var(--line);background:var(--panel2);padding:12px 14px;margin-bottom:18px;}
.secret-k{font-size:10.5px;color:var(--muted);margin-bottom:6px;line-height:1.7;}
.secret-v{font-size:14px;word-break:break-all;letter-spacing:.08em;line-height:1.7;}
.secret .btn{width:auto;margin-top:10px;padding:8px 14px;font-size:11px;letter-spacing:.06em;}
.mfa-form .btn{margin-top:14px;}

/* ---------- 発行と一覧（.app-wrap の中だけ。pass-base の .btn・.eyebrow を上書き） ---------- */
.app-wrap{flex:1;width:100%;max-width:1120px;margin:0 auto;padding:28px 16px 60px;}
.app-wrap .eyebrow{margin:30px 0 12px;}
.app-wrap .eyebrow .btn{margin-left:auto;}
.app-wrap .panel{background:var(--panel);border:1px solid var(--line);padding:24px;}
.app-wrap .grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.app-wrap label,.app-wrap .lbl{display:block;font-size:10px;font-weight:700;letter-spacing:.2em;color:var(--muted);margin-bottom:7px;}
.app-wrap input,.app-wrap select{
  width:100%;padding:11px 12px;border:1px solid var(--line);background:#000;color:var(--text);
  font-family:inherit;font-size:13px;outline:none;transition:border-color .15s;appearance:none;-webkit-appearance:none;border-radius:0;
}
.app-wrap input:focus,.app-wrap select:focus{border-color:var(--red);}
.app-wrap select{background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:34px;}
/* 発行の応答を待つ間は、チームを切り替えられない */
.app-wrap select:disabled{opacity:.5;cursor:not-allowed;}
.app-wrap .btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;width:auto;margin-top:0;
  padding:13px 22px;font-size:12px;letter-spacing:.12em;
}
.app-wrap .btn.ghost{padding:8px 14px;font-size:11px;letter-spacing:.06em;}
.app-wrap .btn.danger{background:transparent;border:1px solid var(--red);color:var(--red);padding:7px 12px;font-size:10.5px;letter-spacing:.06em;}
.app-wrap .btn.danger:hover:not(:disabled){background:var(--red);color:#fff;}
.app-wrap .btn.wide{width:100%;}
.app-wrap .btn .ico{width:14px;height:14px;flex:none;}
.hint{font-size:10.5px;color:var(--dim);line-height:1.8;margin-top:10px;}
.empty{color:var(--muted);font-size:11.5px;padding:8px;line-height:1.8;}
.empty.err{color:#ff8d96;}

/* お知らせ（デモ・エラー・ドライブの接続） */
.banner{border:1px solid var(--line);background:var(--panel);padding:14px 18px;margin-bottom:12px;font-size:12px;line-height:1.8;}
.banner.info{color:var(--muted);font-size:11.5px;}
.banner.err{border-color:#7a2b00;background:#1c0e02;color:#f0a868;}
.banner.err .btn{margin-top:10px;}
.banner.conn{border:1px solid var(--red);border-left:4px solid var(--red);background:var(--red-deep);padding:18px 20px;}
.banner-t{font-size:16px;font-weight:900;margin-bottom:6px;color:#fff;}
.banner-x{font-size:12px;color:#ffc4c9;line-height:1.8;}
.banner-n{font-size:10.5px;color:var(--muted);margin-top:8px;}
.banner-a{margin:4px 0 10px;padding:9px 12px;border-left:3px solid #f0a868;background:rgba(0,0,0,.3);color:#ffd9b0;font-size:12px;line-height:1.8;}
.banner-no{margin-top:12px;font-weight:700;color:#fff;}
.app-wrap .banner .conn-btn{margin-top:12px;padding:14px 28px;font-size:13px;}
.team-bar{display:flex;align-items:center;gap:12px;margin-bottom:6px;max-width:420px;}
.team-bar label{margin:0;flex:none;}

/* 発行フォーム */
.issue{display:flex;flex-direction:column;gap:22px;}
.fld .lh{display:flex;align-items:baseline;gap:12px;margin-bottom:8px;}
.fld .lh label,.fld .lh .lbl{margin:0;}
.fld .lh .aside{margin-left:auto;font-size:10.5px;color:var(--dim);text-align:right;}
.issue input[type=text]{height:44px;}
.issue ::placeholder{color:#4a4a4a;}
.seg{display:flex;border:1px solid var(--line);background:#000;}
.seg button{
  flex:1;min-width:0;height:42px;padding:0 6px;background:none;border:none;border-left:1px solid var(--line);
  color:var(--muted);font-family:inherit;font-size:12.5px;font-weight:500;cursor:pointer;white-space:nowrap;
  transition:color .15s,background .15s;
}
.seg button:first-child{border-left:none;}
.seg button:hover:not(:disabled){color:var(--text);background:#0b0b0b;}
.seg button:disabled{opacity:.35;cursor:not-allowed;}
.seg button.on{color:#fff;font-weight:700;background:var(--red-deep);box-shadow:inset 0 -2px 0 var(--red);}
.seg button:focus-visible,.step button:focus-visible,.pick-f .x:focus-visible{outline:1px solid var(--red);outline-offset:-1px;}
.seg.big button{height:52px;font-size:13.5px;}
.mode-d{font-size:11px;color:var(--muted);margin-top:8px;line-height:1.7;}
.ropt{display:none;grid-template-columns:1fr 1fr;gap:14px 18px;border:1px solid #3d0a10;box-shadow:inset 2px 0 0 var(--red);background:#000;padding:16px 18px;margin-top:12px;}
.ropt.on{display:grid;}
.ropt .note2{grid-column:1 / -1;font-size:10.5px;color:var(--dim);line-height:1.8;}
.step{display:flex;border:1px solid var(--line);height:44px;}
.step button{width:44px;flex:none;background:none;border:none;color:var(--muted);font-size:16px;cursor:pointer;transition:color .15s,background .15s;}
.step button:hover{color:var(--text);background:#0b0b0b;}
.app-wrap .step input{flex:1;min-width:0;height:100%;border:none;border-left:1px solid var(--line);text-align:right;padding:0 4px;font-size:14px;font-weight:700;-moz-appearance:textfield;}
.step input::-webkit-inner-spin-button,.step input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0;}
.step .unit{display:flex;align-items:center;padding:0 12px 0 2px;font-size:12px;color:var(--muted);border-right:1px solid var(--line);}

/* 選んだファイル（1行ずつ：種類・名前・サイズ・✕） */
.app-wrap .pick-btn{width:100%;padding:14px 18px;font-size:12.5px;}
.pick{display:flex;flex-direction:column;gap:6px;margin-top:10px;}
.pick:empty{display:none;}
.pick-f{display:flex;align-items:center;gap:10px;background:#000;border:1px solid var(--line);padding:8px 8px 8px 10px;font-size:12.5px;}
.pick-f .ty{font:700 9.5px 'SF Mono',Menlo,monospace;padding:3px 0;width:40px;text-align:center;flex:none;background:#262626;color:#ddd;}
.pick-f .ty.v{background:#ffd400;color:#000;}
.pick-f .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pick-f .sz{color:var(--muted);font:11px 'SF Mono',Menlo,monospace;flex:none;}
.pick-f .x{background:none;border:none;color:var(--dim);cursor:pointer;font-size:12px;width:28px;height:24px;flex:none;}
.pick-f .x:hover{color:var(--text);}
.pick-err{border:1px solid #7a2b00;background:#1c0e02;color:#f0a868;padding:9px 12px;font-size:11.5px;line-height:1.7;word-break:break-all;}
.pick-cnt{font-size:11px;color:var(--muted);text-align:right;}
.pick-cnt.over{color:var(--red);font-weight:700;}

/* 2カラム：左で設定・右に受け取る人に届くもの */
.issue2{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:22px;align-items:start;}
.pv{position:sticky;top:16px;display:flex;flex-direction:column;gap:14px;min-width:0;}
.pv-card{background:var(--panel);border:1px solid var(--line);}
.pv-h{display:flex;align-items:center;gap:8px;padding:12px 18px;border-bottom:1px solid var(--line2);font-size:10px;font-weight:700;letter-spacing:.2em;color:var(--muted);}
.pv-h i{width:6px;height:6px;border-radius:50%;background:#2ee66b;display:inline-block;}
.pv-b{padding:18px;}
.pv-kind{font-size:10px;font-weight:700;letter-spacing:.2em;color:var(--red);}
.pv-to{font-size:19px;font-weight:900;margin-top:6px;word-break:break-all;}
.pv-to.empty{color:#444;}
.pv-mode{margin-top:12px;font-size:11.5px;line-height:1.75;color:#cfcfcf;background:#000;border:1px solid var(--line2);padding:10px 12px;}
.pv-files{margin-top:14px;border-top:1px solid var(--line2);max-height:300px;overflow:auto;}
.pv-f{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--line2);font-size:12px;}
.pv-f .ic{width:22px;height:22px;flex:none;display:flex;align-items:center;justify-content:center;background:#222;color:#bbb;}
.pv-f .ic .ico{width:11px;height:11px;}
.pv-f .ic.play{background:var(--red);color:#fff;}
.pv-f .nm{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pv-f .sz{color:var(--muted);font-size:10.5px;flex:none;}
.pv-empty{color:var(--dim);font-size:11.5px;padding:16px 0 4px;line-height:1.8;}
.pv-meta{display:grid;grid-template-columns:auto 1fr;gap:7px 16px;margin-top:14px;font-size:11.5px;}
.pv-meta dt{color:var(--muted);}
.app-wrap .btn-issue{width:100%;padding:17px;font-size:13px;}
.notes{list-style:none;font-size:10.5px;color:var(--dim);line-height:1.9;}
.notes li{padding-left:12px;position:relative;}
.notes li::before{content:'';position:absolute;left:0;top:.85em;width:4px;height:1px;background:var(--dim);}
.notes b{color:var(--muted);font-weight:700;}

/* 発行の結果 */
.issue-result:empty{display:none;}
.issue-result{display:flex;flex-direction:column;gap:10px;}
.result{border:1px solid var(--red);background:var(--panel2);padding:18px;}
.result.bad{border-color:#7a2b00;background:#1c0e02;}
.result-h{font-size:13px;font-weight:900;margin-bottom:14px;}
.result.bad .result-h{color:#f0a868;margin-bottom:6px;}
.result-msg{font-size:12px;color:#f0a868;line-height:1.8;}
.result .row{display:flex;align-items:center;gap:10px;margin-bottom:12px;flex-wrap:wrap;}
.result .k{font-size:9.5px;font-weight:700;letter-spacing:.16em;color:var(--muted);width:72px;flex:none;}
.result .v{font-size:12.5px;font-weight:500;word-break:break-all;flex:1;min-width:150px;}
.result .v.pw{font-family:'SF Mono',Menlo,monospace;font-size:20px;font-weight:700;letter-spacing:.3em;color:var(--red);}
.result .mail{border-top:1px solid var(--line2);padding-top:12px;margin-top:4px;display:flex;flex-direction:column;gap:8px;}
.result .mail .k{width:auto;}
.mail-text{width:100%;min-height:150px;background:#000;color:#d6d6d6;border:1px solid var(--line);font:11.5px/1.7 inherit;font-family:inherit;padding:10px;resize:vertical;border-radius:0;}
.pw-warn{border:1px solid #7a2b00;background:#1c0e02;color:#f0a868;padding:10px 14px;font-size:11px;line-height:1.7;}
.pw-warn b{color:#ffc58f;}

/* 一覧 */
.tbl-wrap{overflow-x:auto;}
.app-wrap table{width:100%;border-collapse:collapse;font-size:11.5px;}
.app-wrap th{
  text-align:left;font-size:9px;font-weight:700;letter-spacing:.2em;color:var(--muted);
  padding:10px;border-bottom:1px solid var(--line);white-space:nowrap;
}
.app-wrap td{padding:12px 10px;border-bottom:1px solid var(--line2);vertical-align:top;line-height:1.6;}
.lk-title{font-weight:700;word-break:break-all;}
.sub2{font-size:10px;color:var(--muted);margin-top:3px;}
.sub2.bad{color:#ff8d96;}
.fname{word-break:break-all;}
.st{display:inline-block;padding:2px 8px;font-size:9.5px;font-weight:700;letter-spacing:.08em;border:1px solid;white-space:nowrap;}
.st.active{color:#4ade80;border-color:#14532d;}
.st.dead{color:var(--muted);border-color:var(--line);}
.st.warn{color:#f0a868;border-color:#7a2b00;}
.st.review{color:#ffd400;border-color:#5c4d00;}
.st.dl{color:#cfcfcf;border-color:#3a3a3a;}
.st.apv-ok{color:#2ecc71;border-color:#1f7a45;}
.st.apv-fix{color:#ff9f1a;border-color:#8a5a12;}
.apv-badges{display:flex;flex-wrap:wrap;gap:4px;}
.acts{display:flex;flex-wrap:wrap;gap:6px;min-width:210px;max-width:300px;}
.note-s{max-width:220px;}
.lk-table .lk-title,.lk-table td:first-child .fname{max-width:340px;}
tr.hl td{background:#160406;}
tr.gone td{opacity:.55;}
tr.gone td.td-acts{opacity:1;}
/* 一覧の下：「さらに読み込む」と件数 */
.more-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:14px 2px 2px;}
.more-n{font-size:11px;color:var(--muted);line-height:1.7;}

/* コメント一覧 */
.cmt-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;font-size:11px;color:var(--muted);}
.cmt-head .t{font-size:13px;font-weight:700;color:var(--text);flex:1;min-width:200px;word-break:break-all;}
.apv-list{display:grid;gap:8px;margin:4px 0 16px;}
.apv-row{display:flex;align-items:flex-start;gap:12px;}
.apv-b{flex:none;width:170px;}
.apv-row .fname{margin-top:2px;}
.cmt-tc{font-family:'SF Mono',Menlo,monospace;font-weight:700;color:#ffd400;white-space:nowrap;}
.cmt-text{white-space:pre-wrap;word-break:break-word;min-width:200px;}
.cmt-name{white-space:nowrap;}
tr.done td{opacity:.5;}
tr.reply td:first-child{padding-left:22px;}

/* 動画レビューを選んでいる間は、設定フォーム（左パネル）だけ黒赤を反転＝赤地・黒文字（ダウンロード納品との取り違え防止）。
   ページ・一覧・右のカード・ヘッダーは黒のまま */
body.rv .panel.issue{
  --panel:#e50012; --line:rgba(0,0,0,.35); --line2:rgba(0,0,0,.2);
  --text:#000; --muted:rgba(0,0,0,.68); --dim:rgba(0,0,0,.55);
  --red:#000; --red-deep:#000; --red-hover:#1a1a1a;
  color:var(--text);border-color:#e50012;
}
body.rv .issue input{color:#fff;border-color:#000;}
body.rv .issue input:focus{border-color:#fff;}
body.rv .issue .seg,body.rv .issue .step{background:transparent;border-color:#000;}
body.rv .issue .seg button{color:rgba(0,0,0,.75);border-left-color:#000;}
body.rv .issue .seg button:hover:not(:disabled),body.rv .issue .step button:hover{background:rgba(0,0,0,.12);color:#000;}
body.rv .issue .seg button.on,body.rv .issue .seg button.on:hover{background:#262626;color:#fff;box-shadow:inset 0 -3px 0 #000;}
body.rv .issue .step button,body.rv .issue .step .unit{color:rgba(0,0,0,.75);border-color:#000;}
body.rv .issue .step input{border-color:#000;}
body.rv .ropt{background:transparent;border-color:#000;box-shadow:inset 3px 0 0 #000;}
body.rv .pick-f{color:#fff;border-color:#000;}
body.rv .pick-f .sz{color:#8a8a8a;}
body.rv .pick-f .x{color:#777;}
body.rv .pick-f .x:hover{color:#fff;}
body.rv .issue .pick-btn{color:#fff;}
body.rv .issue .hint{color:rgba(0,0,0,.7);}
body.rv .pv-card{border-color:#e50012;box-shadow:inset 0 3px 0 #e50012;}

/* ---------- 画面の中のダイアログ（window.confirm の代わり） ---------- */
dialog.dlg{
  background:var(--panel);color:var(--text);border:1px solid var(--line);border-top:2px solid var(--red);
  padding:0;margin:auto;width:calc(100% - 32px);max-width:500px;max-height:calc(100vh - 48px);overflow:auto;
}
dialog.dlg::backdrop{background:rgba(0,0,0,.72);}
.dlg-b{padding:24px 24px 6px;}
.dlg-t{font-size:16px;font-weight:900;margin-bottom:12px;line-height:1.5;}
.dlg-x{font-size:12.5px;color:#cfcfcf;line-height:1.9;}
.dlg-x p{margin-bottom:8px;}
.dlg-x p.dlg-sub{color:var(--muted);font-size:11.5px;word-break:break-all;}
.dlg-x .dlg-note{color:var(--muted);font-size:11px;}
.dlg-val{border:1px solid var(--line);background:#000;padding:12px 14px;margin:6px 0 12px;word-break:break-all;font-size:13px;color:var(--text);user-select:all;}
.dlg-val.pw{font-family:'SF Mono',Menlo,monospace;font-size:26px;font-weight:700;letter-spacing:.35em;color:var(--red);text-align:center;}
.dlg-x .btn{margin-top:6px;}
.dlg-f{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;padding:12px 24px 22px;}
.dbtn{font-family:inherit;font-size:12px;font-weight:700;letter-spacing:.08em;padding:11px 18px;cursor:pointer;border:1px solid var(--line);background:transparent;color:var(--muted);transition:background .15s,color .15s,border-color .15s;}
.dbtn:hover{color:var(--text);border-color:var(--muted);}
.dbtn.primary{background:var(--red);border-color:var(--red);color:#fff;}
.dbtn.primary:hover{background:var(--red-hover);border-color:var(--red-hover);}
.dbtn.danger{background:var(--red);border-color:var(--red);color:#fff;}
.dbtn.danger:hover{background:var(--red-hover);border-color:var(--red-hover);}
.dbtn:focus-visible{outline:2px solid #fff;outline-offset:2px;}

/* デモ用のファイル選択（本番は Google の画面） */
.dp-list{display:grid;gap:6px;max-height:50vh;overflow:auto;margin-top:12px;}
.dp-row{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#000;padding:8px 10px;cursor:pointer;}
.dp-row input{accent-color:var(--red);width:16px;height:16px;flex:none;}
.dp-nm{flex:1;min-width:0;font-size:12px;color:var(--text);word-break:break-all;line-height:1.6;}
.dp-meta{font-size:10px;color:var(--muted);white-space:nowrap;}

/* ---------- 狭い画面 ---------- */
@media (max-width:900px){
  .issue2{grid-template-columns:minmax(0,1fr);}
  .pv{position:static;}
}
@media (max-width:760px){
  /* 一覧とコメントは、1行を1枚のカードに */
  .lk-table thead,.cm-table thead{display:none;}
  .lk-table,.lk-table tbody,.lk-table tr,.lk-table td,
  .cm-table,.cm-table tbody,.cm-table tr,.cm-table td{display:block;width:100%;}
  .lk-table tr,.cm-table tr{border-bottom:1px solid var(--line);padding:10px 0;}
  .app-wrap .lk-table td,.app-wrap .cm-table td{border:none;padding:5px 2px;}
  .lk-table td[data-label]::before,.cm-table td[data-label]::before{
    content:attr(data-label);display:block;font-size:9px;font-weight:700;letter-spacing:.2em;color:var(--muted);margin-bottom:2px;
  }
  .acts{max-width:none;}
  .cmt-name{white-space:normal;}
  tr.reply td:first-child{padding-left:2px;}
  .tbl-wrap{overflow-x:visible;}
}
@media (max-width:620px){
  .app-wrap .panel{padding:18px 16px;}
  .app-wrap .grid,.ropt{grid-template-columns:1fr;}
  .fld .lh{flex-wrap:wrap;}
  .fld .lh .aside{margin-left:0;text-align:left;width:100%;}
  .seg button{font-size:11.5px;}
  .apv-row{flex-direction:column;gap:4px;}
  .apv-b{width:auto;}
}