:root{--bg:#f3f7ff;--panel:#fff;--line:#d7e4ff;--text:#17305f;--muted:#60749d;--primary:#1560ff;--danger:#c33b48;--success:#15803d;--shadow:0 12px 30px rgba(34,79,170,.12);--title-lg:26px;--title-md:21px;--title-sm:17px} *{box-sizing:border-box} body{margin:0;font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",sans-serif;background:linear-gradient(180deg,#f8fbff,#eef5ff);color:var(--text)} button,input,select,textarea{font:inherit} .shell{max-width:1500px;margin:0 auto;padding:22px 18px 30px} .hero,.card{background:var(--panel);border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow)} .hero{padding:20px 22px;background:linear-gradient(135deg,#0f4fe0,#1686ff);color:#fff;margin-bottom:18px} .hero h1{margin:0 0 6px;font-size:30px;line-height:1.15} .hero-brand{display:flex;align-items:center;gap:14px;margin-bottom:6px;min-width:0} .hero-brand h1{margin:0} .hero-logo{width:56px;height:56px;object-fit:contain;flex:0 0 auto;filter:drop-shadow(0 6px 10px rgba(13,45,130,.2))} .hero p{margin:0;font-size:14px;line-height:1.65} .grid-top,.results-grid{display:grid;gap:16px} .grid-top{grid-template-columns:minmax(280px,.76fr) minmax(760px,1.24fr);align-items:stretch;margin-bottom:22px} .grid-top>.card{height:100%;display:flex;flex-direction:column} .results-grid{grid-template-columns:420px 1fr;align-items:stretch;height:calc(100vh - 32px);min-height:720px} .card{padding:16px;margin-bottom:16px} .results-sidebar,.results-main{min-width:0;min-height:0;max-height:100%;overflow:auto;overscroll-behavior:auto;scrollbar-gutter:stable} .results-sidebar{padding-right:4px} .results-main{padding-right:4px} .source-preview-card{position:static;top:auto;align-self:auto;z-index:2} .section-title{display:flex;justify-content:space-between;gap:10px;align-items:flex-start;margin-bottom:10px} .grid-top>.card>.section-title,#resultsSection>.section-title{padding-bottom:10px;margin-bottom:14px;border-bottom:1px solid #e6eeff} .grid-top>.card,.hero,#resultsSection{scroll-margin-top:20px} .card h2,.card h3,.card h4{margin:0;letter-spacing:.01em} .card h2{font-size:var(--title-lg);line-height:1.2} .card h3{font-size:var(--title-md);line-height:1.25} .card h4{font-size:var(--title-sm);line-height:1.3} .section-title .subhint{max-width:72ch;font-size:12px;line-height:1.55} .history-lead{max-width:none;white-space:nowrap} #resultsSection{margin-top:4px} .subhint,.muted{color:var(--muted);font-size:12px;line-height:1.55} .row,.chips,.source-tabs,.property-tabs,.meta-row,.mode-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center} .btn{border:none;border-radius:12px;padding:10px 14px;cursor:pointer;font-weight:700} .btn-primary{background:var(--primary);color:#fff} .btn-secondary{background:#fff;border:1px solid var(--line);color:var(--text)} .btn-danger{background:#fff1f2;border:1px solid #fecdd3;color:var(--danger)} .btn.active{background:#dfeaff;border:1px solid var(--primary);color:var(--primary)} .btn:disabled{opacity:.55;cursor:not-allowed} .dropzone,.image-dropzone{border:2px dashed #9ebcff;border-radius:18px;padding:24px;text-align:center;cursor:pointer;background:#f8fbff} .dropzone.drag,.image-dropzone.drag{border-color:var(--primary)} .chip,.pill,.source-pill,.badge,.mini-badge{display:inline-flex;align-items:center;border-radius:999px} .chip,.source-pill{padding:8px 12px;background:#eef4ff;border:1px solid var(--line)} .source-pill.active{background:#dfeaff;border-color:var(--primary)} .pill{padding:6px 10px;background:rgba(255,255,255,.18);margin-left:8px} .badge{padding:4px 8px;background:#eef4ff;color:var(--primary);font-size:12px} .status-badge{padding:6px 10px;background:#e8f7ed;border:1px solid #bbf7d0;color:var(--success);font-size:12px;font-weight:700} .mini-badge{padding:4px 8px;background:#f2f6ff;border:1px solid var(--line);font-size:11px;color:var(--muted)} .form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px} .field{display:flex;flex-direction:column;gap:5px} .field label{font-size:12px;color:var(--muted);font-weight:700} .priority-badge{display:inline-block;font-size:10px;font-weight:700;color:var(--primary);background:#eef4ff;border:1px solid #c7dcff;border-radius:4px;padding:0 4px;margin-right:5px;vertical-align:middle;line-height:16px} .field input,.field select,.field textarea{width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:12px} .field textarea{min-height:84px;resize:vertical} .preview{height:920px;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#f8fbff} .preview iframe{width:100%;height:100%;border:0;display:block} .preview img{width:100%;height:100%;border:0;display:block} .preview.preview--image{padding:12px;overflow:auto;display:block} .preview-image-shell{display:flex;align-items:center;justify-content:center;min-width:100%;min-height:100%}.preview-image{display:block;width:auto;height:auto;max-width:100%;max-height:100%;object-fit:contain;border:0} .preview-empty{height:920px;display:flex;align-items:center;justify-content:center;color:var(--muted)} .group{border-top:1px solid var(--line);padding-top:10px;margin-top:10px} .group:first-child{border-top:none;padding-top:0;margin-top:0} .details-group{padding:0;border-top:1px solid var(--line);margin-top:10px} .details-group summary{cursor:pointer;list-style:none;padding:12px 4px;font-weight:700;color:var(--text)} .details-group summary::-webkit-details-marker{display:none} .details-group[open] summary{color:var(--primary)} .details-body{padding:0 0 10px} .details-summary,.company-details-summary{display:flex;justify-content:space-between;gap:12px;align-items:center} .details-summary small,.company-details-summary small{font-weight:500;color:var(--muted)} .details-summary::after,.company-details-summary::after{content:'入力項目を開く';font-size:12px;color:var(--muted);padding:4px 10px;border:1px solid var(--line);border-radius:999px;background:#f8fbff;white-space:nowrap;flex-shrink:0} .details-group[open] .details-summary::after,.details-group[open] .company-details-summary::after{content:'閉じる';color:var(--primary);border-color:#9ebcff;background:#eef4ff} .company-details-summary{align-items:flex-start} .company-summary-text{display:grid;gap:6px;min-width:0} .company-summary-text span{display:block} .company-summary-text small{display:block;line-height:1.6} .history-note{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px;font-size:12px;color:var(--muted)} .history-badge{display:inline-flex;align-items:center;padding:2px 8px;border-radius:999px;border:1px solid var(--line);background:#f8fbff;color:var(--text);font-weight:700} .history-badge.is-edited{border-color:#9ebcff;background:#eef4ff;color:var(--primary)} .history-badge.is-deleted{border-color:#f4b4b4;background:#fff1f1;color:#b91c1c} .history-badge.is-completed{border-color:#b7e4c7;background:#effcf4;color:#166534}.history-badge.is-processing{border-color:#c7dcff;background:#eef4ff;color:#2f5db8} .prop-btn{padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;min-width:0;width:100%;text-align:left;cursor:pointer} .prop-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)} .property-tabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:8px;align-items:stretch} .prop-btn strong,.prop-btn span{display:block} .prop-btn strong{font-size:13px;line-height:1.25;font-weight:700} .prop-btn span{font-size:11px;line-height:1.35;opacity:.84;margin-top:2px} .group h4{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:15px;margin:0 0 10px} .group-meta{display:inline-flex;align-items:center;padding:4px 8px;border-radius:999px;background:#eef4ff;border:1px solid var(--line);font-size:11px;color:var(--primary);font-weight:700} .file-nav{display:grid;gap:10px;padding:14px 16px;border:1px solid var(--line);border-radius:18px;background:#f8fbff;margin-bottom:14px} .file-nav-top,.property-nav-top,.property-nav-bottom{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap} .file-nav-label{font-size:12px;font-weight:700;color:var(--primary);letter-spacing:.02em} .file-nav-title{font-size:18px;font-weight:800;line-height:1.3} .file-nav-meta{display:flex;gap:8px;flex-wrap:wrap;align-items:center} .nav-chip{display:inline-flex;align-items:center;padding:6px 10px;border-radius:999px;background:#fff;border:1px solid var(--line);font-size:12px;color:var(--muted);font-weight:700} .nav-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:flex-end} .nav-actions .btn{min-width:92px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:8px 12px;font-size:15px} .nav-picker{display:grid;gap:4px;min-width:260px;flex:1 1 280px} .nav-picker-label{font-size:10px;color:var(--muted);font-weight:700;padding-left:4px} .nav-select{width:100%;min-height:48px;padding:8px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--text);font-weight:700;font-size:15px} .nav-select:focus{outline:2px solid #c7dcff;outline-offset:2px} .property-nav{display:grid;gap:12px;padding-bottom:8px;border-bottom:1px solid #e6eeff;margin-bottom:8px} .property-nav-title{display:grid;gap:5px;min-width:0} .property-nav-title h3{font-size:28px;line-height:1.15;margin:0} .property-nav-title .subhint{font-size:14px} .property-nav-stats{display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end} .property-nav-bottom{padding-top:14px;margin-top:10px;border-top:1px solid #e6eeff} .btn-next{background:#0f4fe0;color:#fff} .btn-ghost{background:#f8fbff;border:1px solid var(--line);color:var(--text)} .img-item{display:grid;grid-template-columns:140px 1fr;gap:12px;padding:12px;border:1px solid var(--line);border-radius:16px;background:#fbfdff;margin-bottom:10px} .img-item img{width:140px;height:104px;object-fit:cover;border-radius:12px;background:#fff} .img-body{display:grid;gap:8px} .img-head{display:flex;justify-content:space-between;gap:8px;align-items:flex-start} .panel-note{padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#f8fbff;margin-bottom:10px} .template-panel{padding:12px;border:1px solid var(--line);border-radius:16px;background:#fbfdff;margin-bottom:10px} .template-panel.load{background:#f4f8ff;border-color:#c3d7ff} .template-panel.edit{background:#fffaf3;border-color:#f2d7a6} .template-label{display:block;font-size:12px;font-weight:700;color:var(--primary);margin-bottom:8px} .export-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .export-card{border:1px solid var(--line);border-radius:14px;padding:12px;background:#fbfdff} .export-card h4,.export-card p{margin:0 0 6px} .history-list{display:grid;gap:10px;width:100%} .history-header,.history-row{display:grid;grid-template-columns:136px minmax(0,1fr) 136px 124px;gap:16px;align-items:start} .history-header{padding:0 8px 2px;color:var(--muted);font-size:13px;font-weight:700} .history-card{border:1px solid var(--line);border-radius:18px;background:#fbfdff;padding:13px 15px;box-shadow:0 8px 24px rgba(34,79,170,.06);overflow:hidden;font-size:13px} .history-row>*{min-width:0} .history-date{display:grid;gap:2px;align-content:start} .history-date strong{font-size:13px;line-height:1.6;font-weight:400} .history-date span,.history-update{font-size:13px;line-height:1.6;color:var(--muted)} .history-files{margin:0;padding-left:18px;display:grid;gap:6px;font-size:13px;line-height:1.6} .history-files li{overflow-wrap:anywhere;word-break:break-word} .history-summary{display:grid;gap:8px;min-width:0} .history-metrics{display:flex;flex-wrap:nowrap;gap:8px;align-items:center;white-space:nowrap;overflow:hidden} .history-metric{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;border:1px solid transparent;line-height:1.4;white-space:nowrap;flex:0 0 auto} .history-metric.is-read{background:#eaf2ff;border-color:#c7dcff;color:#2f5db8} .history-metric.is-edited{background:#fff7df;border-color:#f1ddb1;color:#8b6500} .history-metric.is-deleted{background:#ffe7e7;border-color:#f4c2c2;color:#af3a3a} .history-metric.is-zero{background:#f5f7fb;border-color:#dce3ef;color:#7b879d} .history-metric strong{margin-left:0;font-size:13px;font-weight:700} .history-action{display:flex;justify-content:flex-end}.history-action-group{display:flex;flex-direction:column;gap:8px;align-items:flex-end}.history-action .btn,.history-action-group .btn{width:124px;white-space:nowrap;align-self:center}.history-date--updated{justify-self:start} .history-pager{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px;flex-wrap:wrap} .history-page-info{font-size:13px;color:var(--muted);font-weight:700} .history-page-buttons{display:flex;gap:8px;flex-wrap:wrap} .history-page-btn{min-width:42px;padding:8px 12px;border-radius:12px;border:1px solid var(--line);background:#fff;color:var(--text);font-weight:700;cursor:pointer} .history-page-btn.is-current{background:#dfeaff;border-color:var(--primary);color:var(--primary)} .history-page-btn:disabled{opacity:.45;cursor:not-allowed;background:#f5f7fb;color:var(--muted)} @media (max-width:1100px){.history-header{display:none}.history-row{grid-template-columns:1fr}.history-card{padding:14px}.history-action{justify-content:flex-start}.history-pager{justify-content:flex-start}.history-metrics{flex-wrap:wrap;white-space:normal;overflow:visible}.property-nav-top,.property-nav-bottom,.file-nav-top{align-items:flex-start}.property-nav-stats{justify-content:flex-start}} .image-current-grid,.image-page-grid,.image-uploaded-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px} .image-card,.image-summary-card{border:1px solid var(--line);border-radius:16px;background:#fbfdff;overflow:hidden} .image-card img,.image-summary-card img{width:100%;height:220px;object-fit:contain;display:block;background:#fff} .image-card-body,.image-summary-body{padding:12px} .image-card-body{display:grid;gap:8px} .image-card-head{display:flex;justify-content:space-between;gap:10px;align-items:flex-start} .image-card-title{font-weight:700;font-size:16px;line-height:1.35} .image-card-subtitle{font-size:12px;color:var(--muted);word-break:break-all;margin-top:2px} .image-section-head{display:flex;justify-content:space-between;align-items:center;gap:8px;margin:14px 0 8px} .image-page-summary{display:flex;justify-content:space-between;gap:12px;align-items:center;width:100%} .crop-summary-title{white-space:nowrap;color:#1e293b!important;font-size:var(--title-sm);font-weight:700;line-height:1.3} .crop-summary-toggle{display:inline-flex;align-items:center;padding:4px 10px;border-radius:999px;border:1px solid var(--line);background:#f8fbff;color:var(--muted);font-size:12px;font-weight:700;white-space:nowrap;flex-shrink:0} .image-toggle-row{display:flex;gap:8px;flex-wrap:wrap} .image-destination-field{gap:6px} .image-destination-row{display:flex;gap:8px;flex-wrap:wrap} .toggle-chip{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--text);font-size:13px;font-weight:700;cursor:pointer;white-space:nowrap;line-height:1.25} .toggle-chip input{margin:0} .toggle-chip.is-active{background:#eef4ff;border-color:#9ebcff;color:var(--primary)} .btn-image-delete{padding:8px 10px;font-size:12px;white-space:nowrap;align-self:flex-start} .image-category-field label{font-size:11px} .image-guide{background:linear-gradient(180deg,#fbfdff,#f5f9ff)} .image-tool-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px;margin-top:16px} .image-tool-card{border:1px solid var(--line);border-radius:16px;background:#fbfdff;padding:14px} #imageCropDetails{border-top:none;margin-top:0} #imageCropDetails>summary{padding-top:0} .crop-tool{display:grid;gap:12px} .crop-tool-top{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} .crop-stage-wrap{border:1px solid var(--line);border-radius:16px;background:#f8fbff;padding:10px} .crop-stage{position:relative;border-radius:12px;overflow:hidden;background:#fff} .crop-stage img{width:100%;height:auto;display:block} .crop-selection{position:absolute;border:2px solid #1560ff;background:rgba(21,96,255,.18);box-shadow:0 0 0 9999px rgba(15,23,42,.12) inset;pointer-events:none} .crop-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap} .ghost-empty{padding:16px;border:1px dashed #9ebcff;border-radius:16px;background:#f8fbff;color:var(--muted)} .progress-wrap{display:grid;gap:8px;margin-top:14px} .progress-track{height:10px;border-radius:999px;background:#e4edff;overflow:hidden} .progress-fill{height:100%;width:0;background:linear-gradient(90deg,#1560ff,#62a3ff);transition:width .35s ease} .progress-fill.indeterminate{width:35%;animation:progressSlide 1.3s ease-in-out infinite} @keyframes progressSlide{0%{transform:translateX(-120%)} 100%{transform:translateX(320%)} } .hidden{display:none!important} .toast{position:fixed;right:18px;bottom:18px;padding:12px 16px;border-radius:12px;background:#15803d;color:#fff;z-index:999} .toast.ng{background:#b91c1c}  @media (max-width:1200px){.grid-top,.results-grid{grid-template-columns:1fr;height:auto;min-height:0} .results-sidebar,.results-main{max-height:none;overflow:visible;padding-right:0} .source-preview-card{position:static} }  @media (max-width:800px){.form-grid,.export-grid{grid-template-columns:1fr} .shell{padding:12px} .card h2{font-size:23px} .card h3{font-size:19px} .hero h1{font-size:26px} .hero-brand{gap:10px} .hero-logo{width:44px;height:44px} .file-nav-title{font-size:16px} .property-nav-title h3{font-size:21px} .nav-actions{width:100%} .nav-actions .btn{flex:1 1 140px;min-width:0} .nav-picker{width:100%;min-width:0} .nav-select{font-size:15px}   .preview,.preview-empty{height:700px}   .img-item{grid-template-columns:1fr}   .image-card-head,.image-page-summary{display:grid}   .image-toggle-row{display:grid}   .image-destination-row,.crop-tool-top{display:grid}   .image-card img,.image-summary-card img{height:180px}   } .hero-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;flex-wrap:wrap}
.hero-copy{flex:1 1 520px;min-width:280px}
.hero-auth{flex:0 1 460px;min-width:300px}
.auth-login-view{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:end}
.auth-field{display:grid;gap:6px}
.auth-field label,.auth-remember{font-size:12px;font-weight:700;color:#eef4ff}
.auth-field input{width:100%;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.16);color:#fff}
.auth-field input::placeholder{color:rgba(255,255,255,.7)}
.auth-field input:-webkit-autofill,.auth-field input:-webkit-autofill:hover,.auth-field input:-webkit-autofill:focus{-webkit-text-fill-color:#fff;-webkit-box-shadow:0 0 0 1000px rgba(255,255,255,.16) inset;transition:background-color 9999s ease-in-out 0s}
.auth-remember{display:flex;gap:8px;align-items:center;align-self:start}
.btn-light{background:#fff;color:#0f4fe0;min-height:52px}
.auth-logged-in{display:flex;justify-content:flex-end;align-items:flex-start;gap:14px;flex-wrap:wrap}
.auth-status{display:grid;gap:4px;text-align:right}
.auth-status strong{font-size:16px}
.header-menu-wrap{position:relative}
.btn-menu{background:rgba(255,255,255,.15);border:1px solid rgba(255,255,255,.55);color:#fff;min-width:140px}
.header-menu{position:absolute;top:calc(100% + 10px);right:0;width:320px;padding:12px;border-radius:18px;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow);display:grid;gap:10px;z-index:30}
.header-menu-item{display:grid;gap:4px;width:100%;padding:14px 16px;border:1px solid var(--line);border-radius:16px;background:#fbfdff;color:var(--text);text-align:left}
.header-menu-item small{font-size:12px;color:var(--muted);font-weight:700}
.company-panel .mode-row,.company-panel #templateSelectPanel,.company-panel #templateSavePanel{display:none!important}
.company-panel{margin-top:-6px}
.dropzone.is-disabled{opacity:.6;cursor:not-allowed;pointer-events:none}
@media (max-width:1000px){.auth-login-view{grid-template-columns:1fr}.hero-auth{width:100%;max-width:none}.auth-logged-in{justify-content:space-between}.header-menu{width:min(320px,calc(100vw - 40px))}}
@media (max-width:800px){.hero-top{display:grid}.auth-status{text-align:left}.auth-logged-in{display:grid}.btn-menu{width:100%}}
.crop-summary-main{display:grid;gap:8px;min-width:0}
.crop-summary-copy{padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:#f8fbff;color:var(--text)}
.crop-summary-copy strong{display:block;margin-bottom:4px;font-size:13px;line-height:1.4}
.crop-summary-copy small{display:block;font-size:12px;line-height:1.7;color:var(--muted)}
@media (max-width:800px){
  .image-page-summary{align-items:flex-start}
  .crop-summary-toggle{align-self:flex-start}
}
.hero-pills{display:flex;gap:12px;align-items:center;flex-wrap:nowrap;margin-top:14px}
.hero-pills .pill{margin-left:0;white-space:nowrap}
.nav-action-save-group{display:flex;gap:8px;align-items:center;flex-wrap:nowrap;flex:0 0 auto}
.property-nav-bottom{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap}
.property-nav-bottom .nav-actions{flex:1 1 960px;min-width:0}
.property-nav-bottom .property-nav-stats{margin-left:auto;justify-content:flex-end;flex:0 0 auto}
@media (max-width:1100px){
  .property-nav-bottom .property-nav-stats{margin-left:0;justify-content:flex-start}
}
@media (max-width:1000px){
  .hero-pills{flex-wrap:wrap}
}
@media (max-width:800px){
  .nav-action-save-group{display:grid;width:100%}
  .property-nav-bottom{align-items:flex-start}
  .property-nav-bottom .nav-actions{flex-basis:100%}
  .hero-pills{display:grid;gap:8px}
}
.crop-summary-toggle .toggle-when-open{display:none}
#imageCropDetails[open] .crop-summary-toggle .toggle-when-closed{display:none}
#imageCropDetails[open] .crop-summary-toggle .toggle-when-open{display:inline}
.hero-auth{display:flex;justify-content:flex-end;align-items:flex-start}
.auth-menu-wrap{margin-left:auto}
.btn-menu{min-width:160px;min-height:56px}
.header-menu{width:min(360px,calc(100vw - 40px));padding:14px;gap:12px}
.auth-login-view{display:grid;grid-template-columns:1fr;gap:12px}
.auth-menu-title{display:grid;gap:4px}
.auth-menu-title strong{font-size:18px;line-height:1.3;color:var(--text)}
.auth-menu-title small{font-size:12px;line-height:1.6;color:var(--muted)}
.auth-login-view .auth-field label,.auth-login-view .auth-remember{color:var(--text)}
.auth-login-view .auth-field input{background:#fff;border:1px solid var(--line);color:var(--text)}
.auth-login-view .auth-field input::placeholder{color:var(--muted)}
.auth-login-button{width:100%;min-height:50px}
.auth-link-row{display:flex;gap:10px;flex-wrap:wrap}
.auth-link-button{appearance:none;border:none;background:transparent;color:var(--primary);font-weight:700;padding:0;cursor:pointer;text-align:left}
.auth-link-button--block{padding-top:2px}
.auth-link-button:hover{text-decoration:underline}
.auth-logged-in{display:grid;gap:10px;justify-content:normal}
.auth-status-card{display:grid;gap:4px;padding:12px 14px;border:1px solid var(--line);border-radius:16px;background:#f8fbff}
.auth-status-card strong{font-size:16px;line-height:1.3;color:var(--text)}
.auth-status-card small{font-size:12px;line-height:1.6;color:var(--muted)}
@media (max-width:800px){
  .hero-auth{width:100%;justify-content:flex-start}
  .auth-menu-wrap{margin-left:0}
  .btn-menu{width:100%}
}
.auth-menu-title small{display:none}
.auth-logged-in > *{width:100%}
.header-menu{width:320px;justify-items:stretch}
.auth-login-view,.auth-logged-in{justify-items:stretch}
.auth-login-view .auth-field,.auth-login-view .auth-remember,.auth-login-button,.header-menu-item{width:100%}
.auth-login-view .auth-remember{margin-top:-2px}
#resetRequestMessage{padding:8px 10px;border-radius:12px;background:#f8fbff;border:1px solid var(--line)}
.hero-auth.is-logged-in .btn-menu{position:relative;padding-right:88px}
.hero-auth.is-logged-in .btn-menu::after{content:'ログイン済';position:absolute;right:12px;top:50%;transform:translateY(-50%);padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.45);font-size:11px;line-height:1;color:#fff}
@media (max-width:800px){
  .header-menu{width:min(320px,calc(100vw - 28px))}
  .hero-auth.is-logged-in .btn-menu{padding-right:84px}
}
.hero-top{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start}
.hero-copy{min-width:0}
.hero-auth{flex:none!important;width:auto!important;min-width:0!important;justify-self:end;display:flex;justify-content:flex-end;align-items:flex-start}
.auth-menu-wrap{margin-left:0!important;width:auto;min-width:0}
.header-menu{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;right:0;left:auto;width:280px!important;max-width:min(280px,calc(100vw - 28px));min-width:0;box-sizing:border-box;padding:10px}
.header-menu-item{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;flex:0 0 auto;width:100%!important;max-width:100%;text-align:left;padding:12px 14px;margin:0}
.header-menu-item-danger{background:#fff5f5;border-color:#f3c2c8;color:var(--danger)}
.header-menu-item-danger small{color:#a94450}
.auth-login-view,.auth-logged-in{width:100%;justify-items:stretch}
@media (max-width:1000px){
  .hero-top{grid-template-columns:1fr}
  .hero-auth{justify-self:stretch;width:100%!important;justify-content:flex-end}
}
@media (max-width:800px){
  .hero-auth{justify-self:stretch;width:100%!important;justify-content:stretch}
  .auth-menu-wrap{width:100%}
  .btn-menu{width:100%}
  .header-menu{width:100%!important;max-width:none;right:0;left:0}
}

.history-action-group{display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.history-inline-btn{min-width:92px;width:auto}
.history-page-buttons{max-width:100%;row-gap:10px}
.history-page-btn.is-ellipsis{display:inline-flex;align-items:center;justify-content:center;cursor:default;background:#f5f7fb;color:var(--muted);border-style:dashed;min-width:42px}
@media (max-width:1100px){
  .history-action-group{align-items:flex-start}
}
@media (max-width:800px){
  .history-page-buttons{justify-content:flex-start}
  .history-inline-btn{flex:1 1 120px}
}

.preview.preview--image{
  padding:12px;
  overflow:auto;
  display:block;
  overscroll-behavior:contain;
}

.preview.preview--image .preview-image-shell{
  display:block;
  min-width:100%;
  min-height:auto;
}

.preview.preview--image .preview-image-viewport{
  overflow:auto;
  width:100%;
  height:auto;
  max-width:100%;
  max-height:none;
  touch-action:pan-x pan-y;
}

.preview.preview--image .preview-image{
  display:block;
}