
.nav-period:before{content:"¥";position:absolute;inset:1px 3px 2px;display:grid;place-items:center;border:2px solid currentColor;border-radius:50%;font-size:12px;font-weight:800}
.period-open{display:grid;grid-template-columns:1fr;gap:12px;margin-bottom:18px;padding:18px;border-radius:16px;background:var(--paper);box-shadow:var(--shadow)}
.period-open label{min-width:0;color:var(--muted);font-size:12px;font-weight:650}
.period-open input{width:100%;min-width:0;margin-top:7px;padding:12px;border:1px solid var(--line);border-radius:11px;background:#fff;color:var(--ink)}
.period-open .primary,.period-open .notice{grid-column:1/-1}
.period-open .primary{margin-top:4px}
.period-open .notice{margin:0}
.period-list{display:grid;gap:12px}
.period-card{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--paper)}
.period-head{display:flex;align-items:center;justify-content:space-between;padding:16px}
.period-head small{color:var(--forest-2);font-weight:750}
.period-head h3{margin:5px 0 0;font-size:15px}
.period-values{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.period-values div{padding:14px 10px;text-align:center}
.period-values div+div{border-left:1px solid var(--line)}
.period-values span,.period-values b{display:block}
.period-values span{color:var(--muted);font-size:10px}
.period-values b{margin-top:5px;font-size:13px}
.period-close{width:100%;min-height:48px;border:0;border-top:1px solid var(--line);background:var(--mint);color:var(--forest);font-weight:750}
