@import url('/shared/ui-text-fonts-v1.css');
body[data-content-page]{--content-ink:#173f73;--content-copy:#355a85;--content-line:#173f7326;--content-paper:#fbf6ea;--content-blue:#e3f1fc;margin:0;min-height:100dvh;display:block;padding-left:216px;color:var(--content-ink);background:#fffdf7;font:15px/1.65 'Yuanti SC','STYuanti','Avenir Next','PingFang SC',sans-serif}
body[data-content-page] *{box-sizing:border-box;letter-spacing:0}
body[data-content-page] [hidden]{display:none!important}
body[data-content-page] :is(a,button,input,select,summary):focus-visible{outline:3px solid #4a90d9;outline-offset:3px}
body[data-content-page] :is(button,summary){cursor:pointer}
body[data-content-page] :is(button,a,summary){touch-action:manipulation}
body[data-content-page] button:disabled{cursor:not-allowed;opacity:.5}
body[data-content-page] :is(h1,h2,h3,p,a,button){overflow-wrap:anywhere}
body[data-content-page] .content-main{width:100%;max-width:1328px;margin:0 auto;padding:32px 40px 64px;min-width:0}
body[data-content-page] .content-main h1{font:400 44px/1.35 ContentHand,'PingFang SC',sans-serif;margin:0 0 8px;color:var(--content-ink)}
body[data-content-page] .content-main h2{font-family:ContentHand,'PingFang SC',sans-serif;font-weight:400}
.content-sidebar{position:fixed;inset:0 auto 0 0;width:216px;display:flex;flex-direction:column;gap:22px;padding:26px 18px;background:#fbf6ea;border-right:1px solid var(--content-line);overflow-y:auto;z-index:40}
.content-brand{display:flex;align-items:center;gap:6px;min-height:56px;color:var(--content-ink);text-decoration:none;font:32px/1 ContentHand,sans-serif}
.content-brand img{width:48px;height:48px;object-fit:contain}
.content-navigation{display:grid;gap:8px}
.content-nav-link{display:flex;align-items:center;gap:14px;min-height:48px;padding:10px 14px;border-radius:8px;color:var(--content-ink);text-decoration:none;font-weight:600}
.content-nav-link:hover{background:#edf3f5}
.content-nav-link[aria-current=page]{background:#dceefd;box-shadow:inset 3px 0 #173f73}
.content-symbol{display:inline-flex!important;width:25px!important;height:25px!important;flex:0 0 25px;object-fit:contain}
.content-symbol :is(img,svg){width:100%;height:100%;object-fit:contain}
.content-account-symbol{width:26px!important;height:26px!important;flex:0 0 26px!important;margin-right:12px}
.content-tools{display:grid;gap:8px;padding-top:16px;border-top:1px solid var(--content-line)}
.content-nav-caption{margin:0 8px 2px;font-size:12px;color:var(--content-copy)}
.content-tool-link{display:flex;align-items:center;gap:10px;padding:4px 8px;min-height:44px;color:var(--content-ink);text-decoration:none}
.content-tool-link img{width:36px;height:36px;object-fit:contain}
.content-club-link{margin-top:auto;background:#fff0bd;padding:14px;border-radius:8px;color:var(--content-ink);text-decoration:none;font-weight:600}
body[data-content-page] .content-topbar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:12px;height:72px;max-width:none;width:100%;margin:0;padding:12px 40px;border-bottom:1px solid var(--content-line);background:#fffdf7}
.content-breadcrumb,.content-top-actions{display:flex;align-items:center;gap:16px;min-width:0}
.content-breadcrumb{font-size:14px;font-weight:600}
.content-top-actions a{display:inline-flex;align-items:center;min-height:44px;padding:4px;color:var(--content-ink);font-size:13px;text-decoration:none}
.content-breadcrumb a{color:var(--content-copy);text-decoration:none}
.content-bottom-nav{display:none}
.content-skip{position:fixed;top:8px;left:230px;transform:translateY(-150%);z-index:1000;background:white;padding:12px;color:#173f73}
.content-skip:focus{transform:none}
body[data-content-page]>footer{max-width:none;width:100%;padding:20px 40px;border-top:1px solid var(--content-line);font-size:12px}
body[data-content-page] dialog{max-width:min(620px,calc(100% - 24px));max-height:calc(100dvh - 24px)}

/* Existing collections retain their original cards, handlers and source labels. */
body[data-content-page=works] .page-heading{margin:0 0 24px;display:block}
body[data-content-page=works] .page-eyebrow{font-size:13px;margin:0 0 8px;color:var(--content-copy)}
body[data-content-page=works] .page-heading p{font-size:14px}
body[data-content-page=works] .works-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin:18px 0 32px}
body[data-content-page=works] .work-card{min-width:0;padding:0 0 14px;border:1px solid var(--content-line);border-radius:8px;box-shadow:none;background:#fff;overflow:hidden}
body[data-content-page=works] .work-art{height:auto;aspect-ratio:1;max-width:100%;width:100%;object-fit:contain;background:#eef3f8;border-radius:0}
body[data-content-page=works] .work-card :is(h2,.work-meta,.storage-note,.cloud-work-actions){margin:10px 12px}
body[data-content-page=works] .work-card h2{font-size:22px;line-height:1.35}
body[data-content-page=works] .cloud-work-actions{display:flex;flex-wrap:wrap;gap:8px}
body[data-content-page=works] .gift-button{min-height:44px;border-radius:6px;padding:8px 12px;font-size:14px;white-space:normal;box-shadow:none}
body[data-content-page=works] .storage-note{font-size:13px;line-height:1.65}
body[data-content-page=works] .work-card .storage-note:empty{display:none}
body[data-content-page=works] .state-card{border:0;border-radius:0;box-shadow:none;background:transparent;text-align:center;padding:72px 16px}

/* Account remains one authenticated surface; hidden capabilities stay hidden. */
body[data-content-page=account] .content-main{display:block;max-width:1080px;flex:none}
body[data-content-page=account] .welcome{display:none}
body[data-content-page=account] .card{padding:0;border:0;border-radius:0;background:transparent;box-shadow:none}
body[data-content-page=account] .card-brand-icon{width:66px;height:66px;border:0;box-shadow:none;transform:none;margin:10px auto}
body[data-content-page=account] .card h2{font-size:40px}
body[data-content-page=account].is-signed-in .card-brand-icon{display:none}
body[data-content-page=account].is-signed-in :is(.card h2,#status){text-align:left}
body[data-content-page=account] #signed-out{max-width:440px;margin:28px auto 36px}
body[data-content-page=account] #signed-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:16px}
body[data-content-page=account] #signed-in>*{min-width:0;grid-column:1/-1;margin:0}
body[data-content-page=account] #points{grid-column:1;order:-4;background:#e7f3fc;padding:18px;border-radius:8px}
body[data-content-page=account] #signed-in>.club-account-entry{grid-column:2;order:-3;align-self:stretch;border:0;border-radius:8px;padding:22px;box-shadow:none;background:#fff1c7;display:flex;gap:12px;align-items:center}
body[data-content-page=account] .club-account-entry strong{font:26px/1.4 ContentHand,sans-serif}
body[data-content-page=account] .club-account-entry small{display:block;font-size:13px;margin-top:10px}
body[data-content-page=account] .points-hub>summary{font:24px/1.4 ContentHand,sans-serif;min-height:48px;padding:8px 0;border:0;background:transparent;transform:none;border-radius:0}
body[data-content-page=account] .points-hub>summary::before{display:none}
body[data-content-page=account] .points-hub>summary::after{content:none}
body[data-content-page=account] .points-hub-body{margin:8px 0 0;padding:0;border:0;background:transparent;border-radius:0}
body[data-content-page=account] .wallet{padding:12px 0;background:transparent;color:#173f73;text-align:left}
body[data-content-page=account] .wallet>div{justify-content:start}
body[data-content-page=account] .wallet-label{color:#355a85}
body[data-content-page=account] .wallet strong{font-size:44px}
body[data-content-page=account] .points-actions{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
body[data-content-page=account] .points-action{min-height:44px;border-radius:6px;padding:8px;font:14px/1.4 inherit}
body[data-content-page=account] .points-action span{font:14px/1.4 'PingFang SC',sans-serif}
body[data-content-page=account] .points-action small{display:none}
body[data-content-page=account] #show-history{grid-column:auto;min-height:44px}
body[data-content-page=account] :is(.primary,.secondary,.account-message-entry){border-radius:6px;box-shadow:none;min-height:44px}
body[data-content-page=account] #signed-in>a:not(.club-account-entry){text-align:left;display:flex;align-items:center;border:0;border-bottom:1px solid var(--content-line);padding:14px 8px}
body[data-content-page=account] #signed-in>.primary{margin-top:8px;justify-content:center;font-size:24px}
body[data-content-page=account] :is(.identity-card,.password-settings,.password-invitation){border:0;border-top:1px solid var(--content-line);border-radius:0;background:transparent;padding:16px 0}
body[data-content-page=account] .identity-card summary{min-height:44px;font-size:17px}
body[data-content-page=account] .points-panel{border-radius:6px;padding:16px 0;margin-top:16px}
body[data-content-page=account] #image-jobs{border-block:1px solid var(--content-line);padding:8px 0}
body[data-content-page=account] #image-job-list li{display:grid;grid-template-columns:minmax(140px,1fr) minmax(0,1.3fr) auto;gap:8px 20px;padding:18px 8px}
body[data-content-page=account] #image-job-list li>strong{font-size:15px;grid-column:1}
body[data-content-page=account] #image-job-list li>p{margin:0;grid-column:2}
body[data-content-page=account] #image-job-list .image-job-actions{grid-column:3;grid-row:1/4;align-items:center}
body[data-content-page=account] #image-job-list .secondary{margin:0;font-size:13px;width:auto}
body[data-content-page=account] #refresh-image-jobs{width:auto;margin-left:auto}
body[data-content-page=account] .account-help{margin-top:28px}

body[data-content-page=materials] .material-library{background:transparent}
body[data-content-page=materials] .material-heading{margin-bottom:12px}
body[data-content-page=materials] .material-toolbar{margin:0 0 20px;display:flex;flex-wrap:wrap;gap:8px}
body[data-content-page=materials] .material-tabs{border-bottom:1px solid var(--content-line);padding-bottom:8px}
body[data-content-page=materials] .material-tabs button{border-radius:6px;min-height:44px}
body[data-content-page=materials] .material-search{width:100%;max-width:460px;margin:16px 0;min-height:44px;border-radius:6px}
body[data-content-page=materials] .material-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
body[data-content-page=materials] .material-card{border-radius:8px;box-shadow:none;background:#fff;border-color:var(--content-line);min-width:0}
body[data-content-page=materials] .material-picture{height:auto;aspect-ratio:1}
body[data-content-page=materials] .material-actions{flex-wrap:wrap}
body[data-content-page=materials] .material-actions button{white-space:normal;min-height:44px}
@media(min-width:1000px){
  body[data-content-page=materials] #materials{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:16px 24px;align-items:center}
  body[data-content-page=materials] .material-heading{grid-column:1;grid-row:1;margin:0}
  body[data-content-page=materials] .material-toolbar{grid-column:2;grid-row:1;margin:0;justify-content:end}
  body[data-content-page=materials] .material-tabs{grid-column:1;grid-row:2}
  body[data-content-page=materials] .material-search{grid-column:2;grid-row:2;margin:0}
  body[data-content-page=materials] :is(.material-status,.material-batch,.material-selection-bar,.material-grid){grid-column:1/-1}
  body[data-content-page=materials] .material-status:empty{display:none}
}

body[data-content-page=messages] .inbox-heading{margin-bottom:28px;align-items:end}
body[data-content-page=messages] .inbox-eyebrow{color:var(--content-copy);font-size:14px}
body[data-content-page=messages] .message-row{padding:18px 12px;margin-bottom:8px;border:1px solid var(--content-line);border-radius:8px;background:#fffdf9}
body[data-content-page=messages] .message-row:not(.is-read){background:#e8f3fd}
body[data-content-page=messages] .message-row[aria-expanded=true]{outline:2px solid #4a90d9;outline-offset:-2px}
body[data-content-page=messages] .message-dot{background:#f07a3e}
body[data-content-page=messages] .message-row.is-read .message-dot{background:transparent}
body[data-content-page=messages] .message-card-dialog{background:#fffdf7}
body[data-content-page=messages] .inbox-columns{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:start}
@media(min-width:1000px){
  body[data-content-page=messages] .inbox-columns:has(.message-card-dialog[open]){grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
  body[data-content-page=messages] .message-card-dialog[open]{position:sticky;inset:auto;top:20px;margin:0;width:100%;max-width:none;max-height:calc(100dvh - 40px);border:1px solid var(--content-line);padding:48px 16px 20px}
}

body[data-content-page=club] .content-main{max-width:1160px}
body[data-content-page=club] .invitation-view{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:36px;align-items:center}
body[data-content-page=club] .section-intro{grid-column:1/-1;padding:10px 0 24px;text-align:left}
body[data-content-page=club] .mail-stage{grid-column:1;grid-row:2/6;display:block;width:100%;margin:0;padding:20px 12px 30px}
body[data-content-page=club] .side-note{text-align:center;transform:none;font-size:20px;margin:20px 0}
body[data-content-page=club] .envelope{max-width:420px;margin:0 auto}
body[data-content-page=club] .offer{grid-column:2;flex-wrap:wrap;justify-content:start;gap:14px;background:#e6f2fc;padding:24px;border-radius:8px}
body[data-content-page=club] .seat-availability{grid-column:2;width:100%;max-width:none;margin:18px 0;padding:12px 0}
body[data-content-page=club] .fine-print{grid-column:2;text-align:left;margin:0 0 18px;font-size:13px}
body[data-content-page=club] .benefits{grid-column:2;gap:14px;padding:16px 0;background:transparent;justify-content:start;flex-wrap:wrap}
body[data-content-page=club] .benefits>div{gap:8px;font-size:17px}
body[data-content-page=club] .benefits .sticker{width:38px;height:38px}
body[data-content-page=club] .activity-rules{grid-column:1/-1;width:100%;max-width:none;margin:28px 0 0;padding:16px 0;border-top:1px solid var(--content-line);font-size:14px}
body[data-content-page=club] .activity-rules summary{min-height:44px}
body[data-content-page=club] .account-view{padding:0;max-width:none}
body[data-content-page=club] .page-status{margin:0 0 12px;padding:0;text-align:left}
body[data-content-page=club] .primary{background:#173f73;color:#fff;box-shadow:none}

@media(max-width:1199px){
  body[data-content-page]{padding-left:184px}.content-sidebar{width:184px;padding-inline:12px}.content-brand{font-size:28px}.content-brand img{width:42px;height:42px}
  body[data-content-page] .content-main{padding:28px 24px 48px}body[data-content-page] .content-topbar{padding-inline:24px}
  body[data-content-page=works] .works-grid,body[data-content-page=materials] .material-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:799px){
  body[data-content-page]{padding-left:0;padding-bottom:calc(78px + env(safe-area-inset-bottom))}
  .content-sidebar{display:none}.content-skip{left:12px}
  body[data-content-page] .content-topbar{height:60px;padding:8px 18px}
  .content-top-actions{gap:12px}.content-top-actions #language{font-size:12px;padding:6px}
  body[data-content-page] .content-main{padding:24px 18px 36px}
  body[data-content-page] .content-main h1{font-size:34px}
  .content-bottom-nav{position:fixed;inset:auto 0 0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));height:calc(70px + env(safe-area-inset-bottom));padding:6px 8px calc(6px + env(safe-area-inset-bottom));border-top:1px solid var(--content-line);background:#fffdf7;z-index:80}
  .content-bottom-nav .content-nav-link{flex-direction:column;gap:2px;justify-content:center;padding:4px;min-height:54px;font-size:12px}
  .content-bottom-nav .content-nav-link[aria-current=page]{box-shadow:inset 0 -3px #173f73}
  body[data-content-page]>footer{padding:18px;flex-wrap:wrap;margin-inline:0}
  body[data-content-page=works] .works-grid,body[data-content-page=materials] .material-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  body[data-content-page=works] .work-card h2{font-size:21px}
  body[data-content-page=works] .cloud-work-actions{display:grid}
  body[data-content-page=works] .gift-button{width:100%;padding:8px;font-size:13px}
  body[data-content-page=account] #signed-in{grid-template-columns:minmax(0,1fr)}
  body[data-content-page=account] #points,body[data-content-page=account] #signed-in>.club-account-entry{grid-column:1}
  body[data-content-page=account] .club-account-entry{padding:18px}
  body[data-content-page=account] .card h2{font-size:34px}
  body[data-content-page=account] #image-job-list li{grid-template-columns:1fr;gap:8px}
  body[data-content-page=account] #image-job-list li>:is(strong,p,.image-job-actions){grid-column:1;grid-row:auto}
  body[data-content-page=account] .points-panel .section-heading{flex-wrap:wrap}
  body[data-content-page=materials] .material-card{padding:10px}
  body[data-content-page=materials] .material-actions{display:grid;grid-template-columns:1fr}
  body[data-content-page=materials] .material-actions button{width:100%}
  body[data-content-page=messages] .inbox-heading{gap:10px}
  body[data-content-page=messages] .inbox-heading button{flex-shrink:0}
  body[data-content-page=messages] .message-card-dialog{max-height:calc(100dvh - 20px);padding:48px 12px 18px}
  body[data-content-page=club] .invitation-view{display:block}
  body[data-content-page=club] .section-intro{text-align:center;padding:0 0 12px}
  body[data-content-page=club] .mail-stage{padding:0 12px;margin:20px 0}
  body[data-content-page=club] .side-note{display:none}
  body[data-content-page=club] .offer{padding:18px;justify-content:center}
  body[data-content-page=club] .benefits{justify-content:center}
  body[data-content-page=club] .activity-rules{margin-top:18px}
}
@media(prefers-reduced-motion:reduce){body[data-content-page] *,body[data-content-page] *::before,body[data-content-page] *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
