table.list, table.list td, table.list th, table.form,
table.form td, table.form th{
    border: 1px solid black; padding: 0.2ex 1ex;
}
table.form, table.list {border-collapse: collapse;}
table th {background: #fcf;}		/* 単一値カラムと複数値カラムは	*/
th.multi {background: #fef;}		/* 別の背景色にしておく		*/


/* 「温存/編集/新規/削除」ボタンとラベルは完全透明にしておくが、 */
input.action, input.action + * {opacity: 0.0;}	/* 該当行をマウス hover	*/
tr:hover input.action, tr:hover input.action + *,	/* またはタップ	*/
tr:active input.action, tr:active input.action + * {	/* したら見せる	*/
  opacity: 1.0;}


/* 修正用input、新規入力input、「新規」チェック時の値表示、
	「修正」チェック時の値表示 は、すべて非表示にする */
span.edit, span.new, input[value="new"]:checked ~ span.value, 
input[value="edit"]:checked ~ span.value {/* 「修正」チェックで		*/
  display: none;}			  /* 値表示部分を非表示に	*/
input[value="edit"]:checked ~ span.edit { /* 「修正」チェックで		*/
  display: inline;}			  /* 修正用inputを表示する	*/

span.confirm {
    opacity: 1.0; visibility: hidden;}	/* 削除確認は透明不可視にしておくが、*/
input[value="rm"]:checked ~ span.confirm {/* 「削除」チェックで		*/
    visibility: visible;		  /* 可視化したうえで 		*/
    opacity: 1.0; transition: 3s; } /* 削除確認をじわじわ表示する	*/
input[value="rm"]:checked ~ span.value {  /* 「削除」チェックで		*/
  background: red;}			  /* 値表示部分の背景を赤に	*/
input[value="new"]:checked ~ span.new {	  /* 「新規」チェックで		*/
  display: inline;}			  /* 新規入力inputを表示する	*/

span.heresub {display: none;} /* 入力窓近くの送信/リセットボタン非表示	*/
input:not([value="keep"]):checked ~ span.heresub {
  display: inline;}		/* 「温存」以外がチェックされたら表示	*/

span.mtime {font-size: 70%;}
span.value {white-space: pre;}