.myrank-wrap{padding-bottom:64px;}

.auth-card{
  max-width:360px;margin:24px auto 0;
  background:var(--surface);border:1px solid var(--border);border-radius:2px;
  padding:24px 22px;
}
.auth-reassure{
  font-size:13.5px;color:var(--ink-soft);line-height:1.6;margin:0 0 18px;
  padding:10px 12px;background:var(--bg);border:1px solid var(--border);border-radius:2px;
}
.auth-tabs{display:flex;gap:6px;margin-bottom:20px;}
.auth-tab{
  flex:1;padding:10px;border:1px solid var(--border);background:none;
  color:var(--ink-faint);font-size:14.5px;font-weight:700;cursor:pointer;border-radius:2px;
}
.auth-tab.active{background:var(--ink);color:var(--bg);border-color:var(--ink);}

.auth-form{display:flex;flex-direction:column;gap:10px;}
.auth-form label{font-size:13.5px;color:var(--ink-faint);margin-top:4px;}
.auth-form input{
  padding:11px 12px;border:1px solid var(--border);border-radius:2px;
  background:var(--bg);color:var(--ink);font-size:15px;font-family:var(--font-body);
}
.auth-submit-btn{
  margin-top:8px;padding:14px;border:none;border-radius:2px;
  background:var(--accent-fill);color:var(--on-accent);font-family:var(--font-body);
  font-size:15px;font-weight:900;cursor:pointer;
}
.auth-msg{font-size:13.5px;color:var(--ink-faint);margin:6px 0 0;min-height:16px;}
.auth-msg.error{color:var(--marathon);}
.auth-msg.ok{color:var(--ink);}
.auth-note{font-size:13.5px;line-height:1.7;color:var(--ink-soft);margin:0 0 6px;}
.auth-alt{margin:14px 0 0;text-align:center;font-size:13.5px;}
.auth-alt a{color:var(--ink-soft);text-decoration:none;border-bottom:1px dashed var(--border);padding-bottom:1px;}
.auth-alt a:hover{color:var(--accent-ink);border-color:var(--accent);}

.dash-section{margin-top:24px;}
.dash-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;}
.dash-welcome{font-size:15px;color:var(--ink-soft);}
.dash-welcome span{color:var(--ink);font-weight:700;}
.signout-btn{
  padding:8px 14px;border:1px solid var(--border);background:none;
  color:var(--ink-faint);font-size:13.5px;font-weight:700;cursor:pointer;border-radius:2px;
}

.tier-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));
  gap:1px;background:var(--line);margin-bottom:28px;
}
.tier-card{background:var(--bg);padding:18px;text-align:center;}
.tier-sport{font-size:13.5px;color:var(--ink-faint);font-weight:900;letter-spacing:1px;margin:0 0 2px;}
.tier-dist{font-size:13.5px;color:var(--ink-soft);font-weight:700;letter-spacing:0.3px;margin:0 0 8px;}
.tier-time{font-size:20px;font-weight:900;color:var(--ink);margin:0 0 8px;}
.tier-badge{
  display:inline-block;font-size:13.5px;font-weight:900;letter-spacing:0.3px;
  padding:3px 10px;border:1px solid var(--marathon);color:var(--marathon);border-radius:1px;
}
.tier-badge-plain{border-color:var(--border);color:var(--ink-faint);}
.tier-empty{color:var(--ink-faint);font-size:14.5px;padding:24px 0;text-align:center;grid-column:1/-1;}

.record-form-card{
  background:var(--surface);border:1px solid var(--border);border-radius:2px;
  padding:20px;margin-bottom:24px;
}
.record-form-title{font-size:14.5px;font-weight:900;color:var(--ink);margin:0 0 14px;}

.import-box{
  background:var(--bg);border:1px dashed var(--border);border-radius:2px;
  padding:14px;margin-bottom:16px;
}
.import-label{
  display:block;font-size:13.5px;font-weight:700;color:var(--ink-soft);
  cursor:pointer;margin-bottom:8px;
}
.import-sub{font-weight:400;color:var(--ink-faint);font-size:13.5px;}
.import-input{
  width:100%;font-size:13.5px;color:var(--ink-faint);
}
.import-msg{font-size:13.5px;color:var(--ink-faint);margin:8px 0 0;}
.import-msg.success{color:var(--trail);}
.import-msg.error{color:var(--marathon);}

.record-form{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.record-form input,.record-form select{
  padding:11px 12px;border:1px solid var(--border);border-radius:2px;
  background:var(--bg);color:var(--ink);font-size:14.5px;font-family:var(--font-body);
}
.record-form input#rfName,.record-form input#rfNotes{grid-column:1/-1;}
.record-submit-btn{
  grid-column:1/-1;padding:13px;border:none;border-radius:2px;
  background:var(--accent-fill);color:var(--on-accent);font-family:var(--font-body);
  font-size:14.5px;font-weight:900;cursor:pointer;margin-top:4px;
}
.record-msg{font-size:13.5px;color:var(--ink-faint);margin:10px 0 0;grid-column:1/-1;}
.record-msg.error{color:var(--marathon);}

.record-list{display:flex;flex-direction:column;gap:1px;background:var(--line);}
.record-row{background:var(--bg);padding:16px 4px;display:flex;align-items:center;gap:14px;}
.rr-tag{font-size:13.5px;font-weight:900;letter-spacing:1px;color:var(--ink-faint);width:32px;flex-shrink:0;}
.rr-body{flex:1;min-width:0;}
.rr-name{font-size:15px;font-weight:700;color:var(--ink);margin:0 0 4px;}
.rr-meta{font-size:13.5px;color:var(--ink-faint);margin:0;}
.rr-delete{
  background:none;border:none;color:var(--ink-faint);font-size:15px;
  cursor:pointer;flex-shrink:0;padding:4px 8px;
}
.rr-delete:hover{color:var(--marathon);}

@media (max-width:600px){
  .record-form{grid-template-columns:1fr;}
  .record-form input#rfName,.record-form input#rfNotes{grid-column:1;}
}

.dash-top-actions{display:flex;align-items:center;gap:8px;}
.share-btn{
padding:8px 14px;border:1px solid var(--accent);border-radius:2px;
background:none;color:var(--accent-ink);font-size:13.5px;font-weight:700;
font-family:var(--font-body);cursor:pointer;
}
.share-btn:hover{background:var(--accent-fill);color:var(--on-accent);}

.share-modal-card{max-width:420px;}
.share-canvas{width:100%;height:auto;display:block;border-radius:2px;margin-bottom:16px;background:var(--bg);}
.share-actions{display:flex;flex-direction:column;gap:8px;}

/* 문장 안이 아니라 홀로 선 링크라 WCAG 2.2 AA(SC 2.5.8) 24×24px 가 그대로
   적용된다. 글자 크기는 그대로 두고 눌리는 영역만 넓힌다. */
.auth-alt a{display:inline-block;padding-block:4px;min-height:24px;}