/* WebPion Read UX — dedicated light/dark identity, scoped to Read only. */
.wpread{--rd-bg:#f5f8ff;--rd-panel:#fff;--rd-panel-soft:#f8fbff;--rd-text:#0b1837;--rd-muted:#5e6d8c;--rd-line:#dbe4f2;--rd-blue:#2c7cff;--rd-cyan:#2fd0ef;--rd-violet:#8b55ff;--rd-pink:#d94ebc;--rd-good:#28a66f;--rd-warn:#df8a20;--rd-danger:#da5263;--rd-shadow:0 18px 52px rgba(44,68,120,.10);color:var(--rd-text);display:grid;gap:20px;margin-block:22px 34px}
html[data-theme="dark"] .wpread{--rd-bg:#050b17;--rd-panel:#0b1425;--rd-panel-soft:#0e192d;--rd-text:#eef4ff;--rd-muted:#aab7d1;--rd-line:#263a58;--rd-blue:#53a7ff;--rd-cyan:#49d9f5;--rd-violet:#9a6dff;--rd-pink:#df62c6;--rd-good:#52d49c;--rd-warn:#f0ae4f;--rd-danger:#ff7b8c;--rd-shadow:0 22px 60px rgba(0,0,0,.28)}
.wpread *{box-sizing:border-box}.wpread svg{width:1.25em;height:1.25em;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.wpread h1,.wpread h2,.wpread p{margin-top:0}.wpread a{text-decoration:none}
.wpread-hero,.wpread-step,.wpread-itylos,.wpread-guidance-group,.wpread-help,.wpread-next{border:1px solid var(--rd-line);background:var(--rd-panel);box-shadow:var(--rd-shadow);border-radius:24px}
.wpread-hero{display:grid;grid-template-columns:minmax(0,1.06fr) minmax(420px,.94fr);gap:18px;padding:clamp(22px,3vw,36px);align-items:start;background:radial-gradient(circle at 72% 12%,color-mix(in srgb,var(--rd-violet) 10%,transparent),transparent 34%),linear-gradient(150deg,var(--rd-panel),color-mix(in srgb,var(--rd-blue) 3%,var(--rd-panel)))}
.wpread-brandline{display:flex;align-items:center;gap:10px;text-transform:uppercase;letter-spacing:.14em;font-weight:900;font-size:.78rem;color:var(--rd-muted)}.wpread-brandline img{width:40px;height:30px;object-fit:contain}.wpread-hero-copy{display:grid;align-content:start;min-width:0}.wpread-hero h1{font-size:clamp(2.2rem,4.5vw,4.4rem);line-height:.98;letter-spacing:-.045em;max-width:11ch;margin:.55rem 0 1rem}.wpread-lead{max-width:66ch;color:var(--rd-muted);font-size:1.04rem;line-height:1.65}
.wpread-chips{display:flex;flex-wrap:wrap;gap:9px}.wpread-chips span{display:inline-flex;align-items:center;gap:7px;padding:8px 12px;border:1px solid var(--rd-line);border-radius:999px;background:var(--rd-panel-soft);font-size:.82rem;font-weight:750}.wpread-chips svg{color:var(--rd-blue)}
.wpread-hero-side{display:grid;grid-template-columns:1fr;grid-auto-rows:minmax(0,1fr);gap:12px;align-self:stretch;align-content:start}.wpread-support,.wpread-know{border:1px solid var(--rd-line);border-radius:20px;padding:18px;background:color-mix(in srgb,var(--rd-panel) 94%,transparent)}.wpread-support h2,.wpread-know h2{font-size:1rem;margin-bottom:13px}.wpread-support article{display:flex;gap:12px;align-items:center;border:1px solid var(--rd-line);border-radius:14px;padding:12px;margin-top:10px;background:var(--rd-panel-soft)}.wpread-support article:first-of-type{margin-top:0}.wpread-support article div{min-width:0}.wpread-support strong,.wpread-support small{display:block}.wpread-support strong{font-size:.98rem}.wpread-support small{color:var(--rd-muted);font-size:.75rem;margin-top:2px;line-height:1.45}.wpread-support-icon{width:38px;height:38px;display:grid;place-items:center;border-radius:10px;flex:0 0 auto}.wpread-support-icon.is-image{color:#397dfa;background:color-mix(in srgb,#397dfa 10%,transparent)}.wpread-support-icon.is-pdf{color:#ef6780;background:color-mix(in srgb,#ef6780 10%,transparent)}.wpread-support-icon.is-text{color:#35ae75;background:color-mix(in srgb,#35ae75 10%,transparent)}
.wpread-know h2{display:flex;align-items:center;gap:8px}.wpread-know h2 svg{color:var(--rd-violet)}.wpread-know ul{margin:0;padding-left:1.2rem;color:var(--rd-muted);font-size:.8rem;line-height:1.58}.wpread-know li+li{margin-top:8px}.wpread-warning{display:flex;align-items:flex-start;gap:8px;margin:14px 0 0!important;padding:11px 12px;border:1px solid color-mix(in srgb,var(--rd-warn) 45%,var(--rd-line));border-radius:12px;background:color-mix(in srgb,var(--rd-warn) 7%,transparent);font-size:.76rem;line-height:1.52;color:color-mix(in srgb,var(--rd-warn) 80%,var(--rd-text))}.wpread-warning svg{flex:0 0 auto}
.wpread-workflow{display:grid;grid-template-columns:minmax(0,.98fr) minmax(0,1.06fr) minmax(0,1.26fr);gap:14px;align-items:start}.wpread-step{padding:18px;min-width:0;display:flex;flex-direction:column}.wpread-step>header{display:flex;align-items:center;gap:10px;margin-bottom:14px}.wpread-step>header>span{width:31px;height:31px;display:grid;place-items:center;border-radius:50%;background:color-mix(in srgb,var(--rd-blue) 12%,transparent);color:var(--rd-blue);font-weight:900}.wpread-step>header h2{margin:0;font-size:1.08rem}.wpread-step-output>header small{margin-left:auto;color:var(--rd-muted)}
.wpread-drop{flex:none;min-height:260px;border:1.5px dashed color-mix(in srgb,var(--rd-blue) 68%,var(--rd-line));border-radius:20px;display:grid;place-items:center;text-align:center;padding:24px;cursor:pointer;background:radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--rd-violet) 10%,transparent),transparent 48%),linear-gradient(155deg,color-mix(in srgb,var(--rd-blue) 4%,var(--rd-panel-soft)),var(--rd-panel-soft));transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.wpread-drop:hover,.wpread-drop:focus-visible,.wpread-drop.dragover{border-color:var(--rd-blue);box-shadow:0 0 0 4px color-mix(in srgb,var(--rd-blue) 12%,transparent),0 18px 48px color-mix(in srgb,var(--rd-violet) 12%,transparent);transform:translateY(-2px);outline:none}.wpread-drop-content{display:grid;place-items:center;gap:8px}.wpread-upload-icon{width:78px;height:78px;display:grid;place-items:center;border-radius:24px;color:white;background:linear-gradient(135deg,var(--rd-cyan),var(--rd-blue) 50%,var(--rd-violet));box-shadow:0 18px 45px color-mix(in srgb,var(--rd-violet) 24%,transparent)}.wpread-upload-icon svg{width:48px;height:48px;stroke-width:1.6}.wpread-drop strong{font-size:1.12rem}.wpread-drop small{color:var(--rd-muted);max-width:29ch;line-height:1.45}.wpread-drop b{display:inline-flex;margin-top:8px;padding:11px 20px;border-radius:12px;background:linear-gradient(90deg,var(--rd-blue),var(--rd-violet),#e77e92);color:#fff;font-size:.88rem;box-shadow:0 12px 30px color-mix(in srgb,var(--rd-violet) 20%,transparent)}.wpread-formats{font-size:.73rem;color:var(--rd-muted);line-height:1.5;margin:12px 2px 0}.wpread-progress{margin-top:12px}.wpread-progress>div{display:flex;justify-content:space-between;font-size:.75rem;color:var(--rd-muted)}.wpread-progress>i{display:block;height:6px;border-radius:999px;background:color-mix(in srgb,var(--rd-line) 70%,transparent);overflow:hidden;margin-top:6px}.wpread-progress>i>span{display:block;width:0;height:100%;background:linear-gradient(90deg,var(--rd-cyan),var(--rd-violet));transition:width .2s ease}
.wpread-preview-frame{min-height:210px;display:grid;place-items:center;border:1px solid var(--rd-line);border-radius:16px;background:var(--rd-panel-soft);overflow:hidden}.wpread-preview-frame img{display:block;width:100%;height:210px;object-fit:contain}.wpread-preview-frame canvas{max-width:100%;max-height:210px}.wpread-preview-frame pre{width:100%;height:210px;overflow:auto;padding:16px;margin:0;white-space:pre-wrap;font:500 .78rem/1.5 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;color:var(--rd-text)}.wpread-preview-empty{text-align:center;color:var(--rd-muted);padding:24px}.wpread-preview-empty img{width:74px;height:58px;object-fit:contain;opacity:.65;margin:auto}.wpread-preview-empty p{margin:8px 0 0}.wpread-file-meta{display:flex;justify-content:space-between;gap:10px;margin-top:12px;padding:9px 10px;border:1px solid var(--rd-line);border-radius:12px;background:var(--rd-panel-soft);font-size:.78rem}.wpread-file-meta span{color:var(--rd-muted)}.wpread-file-summary{display:block;margin-top:8px;color:var(--rd-muted);font-size:.75rem;overflow-wrap:anywhere}.wpread-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:12px}.wpread-options label{display:flex;justify-content:space-between;gap:14px;align-items:center;border:1px solid var(--rd-line);border-radius:13px;padding:10px;background:var(--rd-panel-soft)}.wpread-options label span{min-width:0}.wpread-options strong,.wpread-options small{display:block}.wpread-options strong{font-size:.77rem}.wpread-options small{color:var(--rd-muted);font-size:.69rem;margin-top:2px}.wpread-options input{width:34px;height:18px;accent-color:var(--rd-violet)}.wpread-local-note{display:flex;gap:8px;align-items:flex-start;margin:10px 0 0!important;color:var(--rd-muted);font-size:.72rem;line-height:1.45}.wpread-local-note svg{color:var(--rd-good);flex:0 0 auto}
.wpread-step-output textarea{width:100%;flex:none;min-height:300px;resize:vertical;border:1px solid var(--rd-line);border-radius:16px;background:var(--rd-panel-soft);color:var(--rd-text);padding:16px;font:500 .86rem/1.58 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;outline:none}.wpread-step-output textarea:focus{border-color:var(--rd-violet);box-shadow:0 0 0 4px color-mix(in srgb,var(--rd-violet) 12%,transparent)}.wpread-actions{display:grid;grid-template-columns:1.1fr 1fr;gap:8px;margin-top:12px}.wpread-btn{border:1px solid var(--rd-line);border-radius:11px;background:var(--rd-panel-soft);color:var(--rd-text);padding:10px 12px;font:inherit;font-size:.77rem;font-weight:800;cursor:pointer}.wpread-btn:hover:not(:disabled){border-color:color-mix(in srgb,var(--rd-blue) 50%,var(--rd-line));transform:translateY(-1px)}.wpread-btn:disabled{opacity:.45;cursor:not-allowed}.wpread-btn-primary{background:linear-gradient(90deg,var(--rd-blue),var(--rd-violet),#e77e92);color:white;border-color:transparent}.wpread-btn-quiet{grid-column:1/-1;background:transparent}
.wpread-itylos{display:grid;grid-template-columns:180px minmax(0,1fr) auto;gap:22px;align-items:center;padding:18px 20px;overflow:hidden;background:linear-gradient(110deg,color-mix(in srgb,#31cae9 7%,var(--rd-panel)),color-mix(in srgb,#8d55e7 8%,var(--rd-panel)) 60%,color-mix(in srgb,#d35bb2 8%,var(--rd-panel)))}.wpread-itylos-logo{height:96px;border-radius:17px;background:color-mix(in srgb,#07101e 92%,var(--rd-panel));display:grid;place-items:center;overflow:hidden}.wpread-itylos-logo img{width:100%;height:100%;object-fit:contain}.wpread-itylos-copy span{font-size:.68rem;text-transform:uppercase;letter-spacing:.14em;font-weight:900;color:var(--rd-cyan)}.wpread-itylos-copy h2{font-size:1.2rem;margin:.25rem 0 .3rem}.wpread-itylos-copy p{margin:0;color:var(--rd-muted);max-width:68ch;font-size:.82rem;line-height:1.5}.wpread-itylos-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 16px;border-radius:12px;background:linear-gradient(90deg,#22bce6,#7c5cff,#d957b8);color:white;font-weight:850;white-space:nowrap;box-shadow:0 12px 30px color-mix(in srgb,var(--rd-violet) 18%,transparent)}
.wpread-guidance{display:grid;grid-template-columns:1fr 1fr;gap:14px}.wpread-guidance-group{padding:17px}.wpread-guidance-group h2{display:flex;align-items:center;gap:8px;font-size:1rem;margin-bottom:12px}.wpread-guidance-group.is-good h2{color:var(--rd-good)}.wpread-guidance-group.is-limit h2{color:var(--rd-danger)}.wpread-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.wpread-mini-grid article{display:flex;align-items:flex-start;gap:9px;border:1px solid var(--rd-line);background:var(--rd-panel-soft);border-radius:14px;padding:11px;min-width:0}.wpread-mini-grid article>svg{width:28px;height:28px;flex:0 0 auto}.is-good .wpread-mini-grid article>svg{color:var(--rd-good)}.is-limit .wpread-mini-grid article>svg{color:var(--rd-danger)}.wpread-mini-grid strong{font-size:.76rem;display:block}.wpread-mini-grid p{font-size:.68rem;line-height:1.45;color:var(--rd-muted);margin:.25rem 0 0}
.wpread-help{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(360px,.7fr);gap:16px;align-items:center;padding:17px 20px;background:linear-gradient(100deg,color-mix(in srgb,var(--rd-blue) 5%,var(--rd-panel)),color-mix(in srgb,var(--rd-violet) 5%,var(--rd-panel)))}.wpread-help>div{display:flex;gap:12px;align-items:center}.wpread-help img{width:54px;height:42px;object-fit:contain}.wpread-help h2{font-size:1rem;margin-bottom:.2rem}.wpread-help p{margin:0;color:var(--rd-muted);font-size:.76rem;line-height:1.5}.wpread-help ul{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:0;margin:0;list-style:none}.wpread-help li{border-left:1px solid var(--rd-line);padding:8px 10px;font-size:.7rem;color:var(--rd-muted)}
.wpread-next{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;padding:17px 20px}.wpread-next>div span{font-size:.66rem;text-transform:uppercase;letter-spacing:.14em;color:var(--rd-muted);font-weight:900}.wpread-next h2{font-size:1rem;margin:.25rem 0 0}.wpread-next nav{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}.wpread-next a{display:grid;grid-template-columns:34px 1fr auto;align-items:center;gap:9px;border:1px solid var(--rd-line);border-radius:13px;padding:10px;color:var(--rd-text);background:var(--rd-panel-soft)}.wpread-next a:hover{border-color:color-mix(in srgb,var(--rd-violet) 50%,var(--rd-line));transform:translateY(-1px)}.wpread-next i{width:32px;height:32px;border-radius:9px;display:grid;place-items:center;color:var(--rd-violet);background:color-mix(in srgb,var(--rd-violet) 9%,transparent)}.wpread-next strong,.wpread-next small{display:block}.wpread-next strong{font-size:.76rem}.wpread-next small{font-size:.63rem;color:var(--rd-muted);margin-top:2px}.wpread-next b{font-weight:700;color:var(--rd-muted)}
@media(max-width:1180px){.wpread-hero{grid-template-columns:1fr}.wpread-workflow{grid-template-columns:1fr 1fr}.wpread-step-output{grid-column:1/-1}.wpread-step-output textarea{min-height:250px}.wpread-itylos{grid-template-columns:140px 1fr}.wpread-itylos-btn{grid-column:2}.wpread-guidance{grid-template-columns:1fr}.wpread-next{grid-template-columns:1fr}.wpread-next nav{grid-template-columns:repeat(2,1fr)}}
@media(max-width:820px){.wpread-options{grid-template-columns:1fr}.wpread{gap:14px;margin-top:14px}.wpread-hero{padding:20px}.wpread-hero-side,.wpread-workflow{grid-template-columns:1fr}.wpread-step-output{grid-column:auto}.wpread-itylos{grid-template-columns:1fr;text-align:left}.wpread-itylos-logo{height:110px}.wpread-itylos-btn{grid-column:auto;justify-self:start}.wpread-mini-grid{grid-template-columns:1fr}.wpread-help{grid-template-columns:1fr}.wpread-help ul{grid-template-columns:1fr}.wpread-help li{border-left:0;border-top:1px solid var(--rd-line)}.wpread-next nav{grid-template-columns:1fr 1fr}.wpread-drop{min-height:210px}}
@media(max-width:520px){.wpread-hero h1{font-size:clamp(2rem,11vw,3rem)}.wpread-hero-side{display:grid}.wpread-support,.wpread-know,.wpread-step,.wpread-guidance-group,.wpread-help,.wpread-next{border-radius:18px}.wpread-chips span{font-size:.73rem}.wpread-next nav{grid-template-columns:1fr}.wpread-actions{grid-template-columns:1fr}.wpread-btn-quiet{grid-column:auto}.wpread-preview-frame,.wpread-preview-frame img,.wpread-preview-frame pre{height:auto;min-height:210px}.wpread-step-output textarea{min-height:230px}}
@media(prefers-reduced-motion:reduce){.wpread *{scroll-behavior:auto!important;transition:none!important}}