/* The personal account, in the home page's styles (DESIGN.md): Inter capitals for titles and names, PT Serif for words, washi paper, the header's margins.
   Its headings need one line in tomita-pages-20261101.css, whose layer otherwise sets every heading in PT Serif. */
.tm-acct{padding:48px var(--tm-edge) 96px;color:#4c4942;font:400 16px/1.7 "PT Serif",Georgia,serif}
.tm-acct [hidden]{display:none!important}
.tm-acct p{margin:0}
.tm-acct h1,.tm-acct h2,.acct-dialog h2{margin:0;font:400 clamp(20px,1.8vw,28px)/1.25 Inter,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#302f2a}
.acct-label,.acct-field,.tm-acct dt,.acct-tabs a,.acct-or,.acct-link,.acct-filter button{font:500 10px/1.6 Inter,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#6b655c}
.acct-name{display:block;font:400 13px/1.4 Inter,Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#302f2a;text-decoration:none;margin:0}
.acct-ref{display:block;font:italic 400 14px/1.5 "PT Serif",Georgia,serif;color:#6b655c}
.acct-sub{font:italic 400 18px/1.7 "PT Serif",Georgia,serif;color:#6b655c;min-height:1.7em}
.acct-a{padding:0;border:0;background:none;font:italic 400 14px/1.4 "PT Serif",Georgia,serif;letter-spacing:.02em;color:#302f2a;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;cursor:pointer;text-align:left}
.acct-a:hover{color:#4c4942}
.acct-a-danger{color:#a3451f}
.tm-acct a:not([class]){color:inherit;text-underline-offset:4px}
.tm-acct strong{font-weight:400;color:#302f2a}

/* buttons */
.acct-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 32px;border:1px solid #302f2a;border-radius:0;background:#302f2a;color:#fff;font:500 10px/1.6 Inter,Arial,sans-serif;letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background-color .3s,color .3s}
.acct-btn:hover{background:#4c4942}
.acct-btn:disabled{opacity:.55;cursor:wait}
.acct-btn.wide{width:100%}
.acct-btn.ghost{background:transparent;color:#302f2a;border-color:#a79f93}
.acct-btn.ghost:hover{border-color:#302f2a;background:transparent}
.acct-btn.orange{background:#fc8702;border-color:#fc8702;color:#2a1f18}
.acct-btn.orange:hover{background:#e87c00;border-color:#e87c00}
.acct-btn.danger{background:transparent;border-color:#a3451f;color:#a3451f}
.acct-btn.danger:hover{background:#a3451f;color:#fff}
.acct-link{min-height:44px;padding:0;border:0;background:none;cursor:pointer}
.acct-link:hover{color:#302f2a}
.acct-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px}
.acct-saved{font:italic 400 14px/1.5 "PT Serif",Georgia,serif;color:#6b655c}
.acct-msg{margin-top:16px!important;font:400 14px/1.6 "PT Serif",Georgia,serif;color:#b23a0c}
.acct-small{margin-top:24px!important;font:400 14px/1.7 "PT Serif",Georgia,serif}
.acct-gap{margin-top:40px!important}

/* fields */
.acct-field{display:flex;flex-direction:column;gap:4px}
.acct-opt{font-weight:400;letter-spacing:.15em}
.acct-field input,.acct-field select,.acct-field textarea{width:100%;min-height:44px;padding:9px 0;border:0;border-bottom:1px solid #a79f93;border-radius:0;background:transparent;font:400 16px/1.5 "PT Serif",Georgia,serif;letter-spacing:0;text-transform:none;color:#302f2a;outline-offset:4px;-webkit-appearance:none;appearance:none}
.acct-field select{padding-right:24px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none' stroke='%23302f2a'%3E%3Cpath d='m1 1.5 5 5 5-5'/%3E%3C/svg%3E") right 2px center no-repeat}
.acct-field textarea{min-height:96px;resize:vertical}
.acct-field input:focus,.acct-field select:focus,.acct-field textarea:focus{border-bottom-color:#302f2a}
.acct-field ::placeholder{color:#6b655c;opacity:1}
.acct-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
.acct-span{grid-column:1/-1}
.acct-check{display:flex;align-items:flex-start;gap:12px;margin-top:32px;font:400 14px/1.7 "PT Serif",Georgia,serif;color:#302f2a;cursor:pointer}
.acct-check input{flex:none;width:18px;height:18px;margin:3px 0 0;accent-color:#302f2a}

/* opening */
.acct-loading{display:flex;align-items:center;gap:16px;min-height:50vh}
.acct-spin{width:22px;height:22px;border:1.5px solid #d6cfc2;border-top-color:#fc8702;border-radius:50%;animation:acctspin .8s linear infinite}
@keyframes acctspin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.acct-spin{animation:none}}
.acct-wait{padding:40px 0;font:italic 400 16px/1.7 "PT Serif",Georgia,serif;color:#6b655c}

/* before the account: words beside a photograph */
.acct-entry{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;align-items:start}
.acct-entry-words{grid-column:1/6}
.acct-entry-photo{grid-column:7/13;margin:0}
.acct-entry-photo img{display:block;width:100%;height:auto}
.acct-entry h1{margin:14px 0 24px}
.acct-lede{margin-bottom:32px!important}
.acct-or{display:flex;align-items:center;gap:16px;margin:24px 0}
.acct-or::before,.acct-or::after{content:"";flex:1;height:1px;background:#c8c0b5}
#link-form .acct-btn,#confirm-form .acct-btn{margin-top:20px}
#create-form .acct-row{margin-top:28px}

/* the account's head and tabs */
.acct-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.acct-head h1{margin-bottom:6px}
.acct-tabs{display:flex;gap:40px;margin-top:32px;border-bottom:1px solid #c8c0b5;overflow-x:auto;scrollbar-width:none}
.acct-tabs::-webkit-scrollbar{display:none}
.acct-tabs a{display:flex;align-items:center;min-height:44px;white-space:nowrap;text-decoration:none;border-bottom:1px solid transparent;margin-bottom:-1px}
.acct-tabs a:hover{color:#302f2a}
.acct-tabs a[aria-current=page]{color:#302f2a;border-bottom-color:#fc8702}
.acct-tabs .n{margin-left:8px;font-weight:400;letter-spacing:.08em}
.acct-pane{padding-top:56px}
.tm-acct .acct-pane:focus,.acct-dialog:focus{outline:0!important}
.acct-pane>section+section{margin-top:88px}
.acct-section-head{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:32px}
.acct-empty{padding:40px 0;max-width:36em}
.acct-empty h2{margin-bottom:16px}
.acct-empty p{margin-bottom:24px}

/* what is waiting to be requested */
.acct-selection{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-bottom:64px;padding:20px 0;border-top:1px solid #c8c0b5;border-bottom:1px solid #c8c0b5}
.acct-selection span{color:#302f2a}

/* first visit */
.acct-welcome{max-width:36em;margin-bottom:48px}
.acct-welcome h2{margin-bottom:16px}
.acct-covers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px 24px}
.acct-cover{display:block;text-decoration:none}
.acct-cover img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;margin-bottom:14px;background:#e6dfd3}

/* a sample request */
.acct-req{padding:32px 0;border-top:1px solid #c8c0b5}
.acct-req:last-child{border-bottom:1px solid #c8c0b5}
.acct-req-top{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 20px}
.acct-state{margin-top:16px!important;font-style:italic;color:#6b655c}
.acct-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;max-width:760px;margin:24px 0 0;padding:0;list-style:none}
.acct-steps li{padding-top:10px;border-top:2px solid #d6cfc2;font:500 10px/1.5 Inter,Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#6b655c}
.acct-steps li.past{border-top-color:#fc8702}
.acct-steps li.now{border-top-color:#fc8702;color:#302f2a}
.acct-facts{display:flex;flex-wrap:wrap;gap:16px 48px;margin:24px 0 0}
.acct-facts dd{margin:4px 0 0;font:400 14px/1.6 "PT Serif",Georgia,serif;color:#302f2a}
.acct-late{color:#b23a0c!important}
.acct-items{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px 24px;margin:28px 0 0;padding:0;list-style:none}
.acct-items a{display:grid;grid-template-columns:56px 1fr;column-gap:16px;align-items:center;text-decoration:none}
.acct-items img,.acct-noimg{grid-row:1/3;display:block;width:56px;height:56px;object-fit:cover;background:#e6dfd3}
.acct-items .acct-name{align-self:end;font-size:11px;letter-spacing:.1em}
.acct-items .acct-ref{align-self:start}
.acct-actions{display:flex;flex-wrap:wrap;gap:12px 32px;margin-top:24px}
.acct-actions .acct-a{display:inline-flex;align-items:center;min-height:28px}

/* designs */
.acct-tiles{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:48px 24px}
.acct-im{display:block;aspect-ratio:1;overflow:hidden;background:#e6dfd3}
.acct-im img{display:block;width:100%;height:100%;object-fit:cover}
.acct-tile-top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;margin-top:6px}
.acct-tile-top .acct-name{padding-top:10px}
.acct-heart{flex:none;display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin:0 -14px -8px 0;padding:0;border:0;background:none;cursor:pointer}
.acct-heart svg{fill:#fc8702;stroke:#fc8702;stroke-width:1.2}
.acct-heart:hover svg{fill:none}
.acct-tile-acts{display:flex;flex-direction:column;align-items:flex-start;margin-top:8px}
.acct-tile-acts .acct-a{display:flex;align-items:center;min-height:36px}
.acct-tile-acts [aria-pressed=true]{color:#6b655c}
.acct-filter{display:flex;flex-wrap:wrap;gap:4px 28px;margin-bottom:32px}
.acct-filter button{min-height:44px;padding:0;border:0;border-bottom:1px solid transparent;background:none;cursor:pointer}
.acct-filter button[aria-pressed=true]{color:#302f2a;border-bottom-color:#fc8702}

/* boards */
.acct-boards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px 24px}
.acct-board{display:block;text-decoration:none}
.acct-mosaic{display:grid;grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr;gap:8px;aspect-ratio:3/2;margin-bottom:14px;background:#e6dfd3}
.acct-mosaic img{display:block;width:100%;height:100%;object-fit:cover;min-height:0}
.acct-mosaic img:first-child{grid-row:1/3}
.acct-mosaic.n1 img{grid-column:1/3;grid-row:1/3}
.acct-mosaic.n2 img:last-child{grid-row:1/3}
.acct-mosaic:not(.n0){background:none}
.acct-board:hover .acct-name{color:#4c4942}
.acct-board-head{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:20px 32px;margin-top:32px}
.acct-board-head h2{margin-bottom:6px;overflow-wrap:anywhere}
.acct-board-note{max-width:640px;margin-top:40px}
.acct-board-note .acct-saved{display:block;min-height:1.5em;margin-top:8px}
.acct-board-designs{margin-top:56px}
.acct-board-more{margin-top:56px;padding-top:8px;border-top:1px solid #c8c0b5}
.acct-board-foot{margin-top:32px}

/* details */
.acct-split{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:24px;row-gap:64px}
.acct-split-title{grid-column:1/5}
.acct-split-title h2{margin-bottom:12px}
.acct-split-title p{font-size:14px}
.acct-split-body{grid-column:5/11}
.acct-split-body>p+p{margin-top:12px}
.acct-rule{margin-top:64px;padding-top:64px;border-top:1px solid #c8c0b5}
.acct-dl{display:grid;grid-template-columns:160px 1fr;gap:12px 24px;margin:0 0 32px}
.acct-dl dt{padding-top:3px}
.acct-dl dd{margin:0;font:400 14px/1.6 "PT Serif",Georgia,serif;color:#302f2a}

/* help */
.acct-help{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 32px;margin-top:96px;padding-top:24px;border-top:1px solid #c8c0b5;font:400 14px/1.7 "PT Serif",Georgia,serif}

/* windows and notes */
.acct-dialog{width:min(480px,calc(100vw - 48px));max-height:calc(100vh - 48px);padding:32px;border:0;background:#f8f5ef;color:#4c4942;font:400 16px/1.7 "PT Serif",Georgia,serif}
.acct-dialog::backdrop{background:rgba(18,18,16,.55)}
.acct-dialog h2{margin-bottom:16px;font-size:20px;overflow-wrap:anywhere}
.acct-dialog p{margin:0 0 24px}
.acct-dialog form .acct-row{margin-top:24px}
.acct-pick{margin-bottom:24px}
.acct-pick-row{display:flex;align-items:center;gap:16px;width:100%;min-height:56px;padding:8px 0;border:0;border-bottom:1px solid #d6cfc2;background:none;text-align:left;cursor:pointer}
.acct-pick-row img{flex:none;width:44px;height:44px;object-fit:cover}
.acct-pick-row .acct-name{flex:1;min-width:0;overflow-wrap:anywhere}
.acct-pick-row .acct-ref{flex:none}
.acct-pick-row[aria-pressed=true]{box-shadow:inset 2px 0 0 #fc8702;padding-left:12px}
.acct-pick-new{display:flex;align-items:flex-end;gap:16px;margin-top:16px}
.acct-pick-new .acct-field{flex:1;min-width:0}
.acct-toast{position:fixed;left:50%;bottom:24px;z-index:60;display:flex;align-items:center;gap:20px;width:max-content;max-width:calc(100vw - 48px);padding:14px 20px;background:#121210;color:#fff;font:400 14px/1.5 "PT Serif",Georgia,serif;transform:translateX(-50%)}
.acct-toast button{flex:none;min-height:28px;padding:0;border:0;background:none;color:#fff;font:italic 400 14px/1.4 "PT Serif",Georgia,serif;text-decoration:underline;text-underline-offset:5px;cursor:pointer}

@media (max-width:1000px){
  .acct-split-title{grid-column:1/-1}
  .acct-split-body{grid-column:1/-1}
  .acct-split{row-gap:28px}
  .acct-split-body+.acct-split-title{margin-top:36px}
  .acct-covers,.acct-boards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .acct-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:767px){
  .tm-acct{padding-top:32px;padding-bottom:72px}
  .tm-acct a.acct-a,.tm-acct button.acct-a{display:inline-flex;align-items:center;min-height:44px}
  .acct-tile-top .acct-name{min-height:44px;margin-bottom:-8px}
  .acct-actions{gap:0 24px}
  .acct-check{min-height:44px}
  .acct-field>span.acct-opt{display:inline}
  .acct-entry{display:block}
  .acct-entry-photo{margin-top:48px}
  .acct-tabs{gap:24px;margin-left:calc(-1*var(--tm-edge));margin-right:calc(-1*var(--tm-edge));padding:0 var(--tm-edge)}
  .acct-pane{padding-top:40px}
  .acct-pane>section+section{margin-top:64px}
  .acct-grid2{grid-template-columns:minmax(0,1fr)}
  .acct-tiles{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 16px}
  .acct-boards{grid-template-columns:minmax(0,1fr)}
  .acct-covers{gap:32px 16px}
  .acct-steps li{letter-spacing:.06em;font-size:10px}
  .acct-items{grid-template-columns:minmax(0,1fr)}
  .acct-selection .acct-btn,.acct-board-head .acct-btn{width:100%}
  .acct-board-head>div{width:100%}
  .acct-dl{grid-template-columns:minmax(0,1fr);gap:4px}
  .acct-dl dd{margin-bottom:12px}
  .acct-dialog{padding:24px}
  .acct-help{margin-top:72px}
  .acct-pick-new{flex-wrap:wrap}
  .acct-pick-new .acct-btn{width:100%}
}
@media print{
  header,footer,.tm-back,.acct-head,.acct-tabs,.acct-help,.acct-toast,.acct-actions,.acct-tile-acts,.acct-heart,.acct-board-head .acct-btn,.acct-board-more,#b-add,.acct-saved,.acct-pane>.acct-a,#menuDialog,dialog{display:none!important}
  body{background:#fff!important}
  .tm-acct{padding:0}
  .acct-pane{padding-top:0}
  .acct-tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 16px}
  .acct-tile{break-inside:avoid}
  .acct-field textarea{border:0;min-height:0;height:auto}
}
