.theme-switcher[data-v-ed697cd0]{position:fixed;right:clamp(14px,2.6vw,48px);bottom:clamp(14px,2.4vw,34px);z-index:1001;color:var(--color-text)}.theme-switcher__trigger[data-v-ed697cd0]{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border:1px solid var(--color-border);border-radius:999px;background:hsla(0,0%,100%,.88);color:var(--color-text);box-shadow:0 14px 34px var(--color-shadow);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.theme-switcher__trigger[data-v-ed697cd0]:hover{transform:translateY(-1px);border-color:var(--color-primary)}.theme-switcher__dots[data-v-ed697cd0],.theme-switcher__swatches[data-v-ed697cd0]{display:inline-flex;align-items:center}.theme-switcher__dots i[data-v-ed697cd0]{display:block;width:18px;height:18px;border:2px solid #fff;border-radius:50%;box-shadow:0 0 0 1px var(--color-border)}.theme-switcher__dots i+i[data-v-ed697cd0]{margin-left:-6px}.theme-switcher__label[data-v-ed697cd0]{font-size:13px;font-weight:800}.theme-switcher__panel[data-v-ed697cd0]{position:absolute;right:0;bottom:56px;width:min(86vw,340px);padding:12px;border:1px solid var(--color-border);border-radius:8px;background:hsla(0,0%,100%,.94);box-shadow:0 24px 70px var(--color-shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.theme-switcher__panel header[data-v-ed697cd0]{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:10px}.theme-switcher__panel header div[data-v-ed697cd0]{display:grid;gap:2px}.theme-switcher__panel header strong[data-v-ed697cd0]{color:var(--color-text);font-size:15px}.theme-switcher__panel header span[data-v-ed697cd0]{color:var(--color-text-soft);font-size:12px}.theme-switcher__panel header button[data-v-ed697cd0]{width:30px;min-height:30px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-bg-soft);color:var(--color-text);font-size:18px;line-height:1}.theme-switcher__list[data-v-ed697cd0]{display:grid;gap:8px}.theme-switcher__item[data-v-ed697cd0]{display:grid;grid-template-columns:48px minmax(0,1fr);gap:10px;align-items:center;width:100%;min-height:62px;padding:10px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-surface);color:var(--color-text);text-align:left;transition:border-color .18s ease,transform .18s ease,background .18s ease}.theme-switcher__item.active[data-v-ed697cd0],.theme-switcher__item[data-v-ed697cd0]:hover{transform:translateY(-1px);border-color:var(--color-primary);background:var(--gradient-soft)}.theme-switcher__swatches i[data-v-ed697cd0]{width:24px;height:34px;border:2px solid #fff;border-radius:8px;box-shadow:0 0 0 1px var(--color-border)}.theme-switcher__swatches i+i[data-v-ed697cd0]{margin-left:-10px}.theme-switcher__item span[data-v-ed697cd0]:last-child{display:grid;gap:2px;min-width:0}.theme-switcher__item strong[data-v-ed697cd0]{overflow:hidden;color:var(--color-text);font-size:14px;line-height:1.15;text-overflow:ellipsis;white-space:nowrap}.theme-switcher__item small[data-v-ed697cd0]{overflow:hidden;color:var(--color-text-soft);font-size:12px;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.theme-switcher__link[data-v-ed697cd0]{width:100%;min-height:38px;margin-top:10px;border:1px solid var(--color-border);border-radius:8px;background:var(--color-primary);color:var(--color-primary-contrast);font-weight:800}.theme-panel-enter-active[data-v-ed697cd0],.theme-panel-leave-active[data-v-ed697cd0]{transition:opacity .18s ease,transform .18s ease}.theme-panel-enter[data-v-ed697cd0],.theme-panel-leave-to[data-v-ed697cd0]{opacity:0;transform:translateY(8px) scale(.98)}@media (max-width:575px){.theme-switcher[data-v-ed697cd0]{right:12px;bottom:12px}.theme-switcher__trigger[data-v-ed697cd0]{width:44px;padding:0}.theme-switcher__panel[data-v-ed697cd0]{bottom:52px;width:min(92vw,320px)}}:root{--page-max:1440px;--page-max-wide:1600px;--page-max-narrow:1180px;--page-gap:24px;--page-gap-sm:16px;--page-gap-lg:32px;--page-px:24px;--page-px-mobile:16px;--section-gap:24px;--section-gap-sm:16px;--card-padding:20px;--card-padding-sm:16px;--card-radius:8px;--card-gap:16px;--fs-hero:clamp(36px,5vw,72px);--fs-page-title:clamp(28px,4vw,56px);--fs-section-title:clamp(26px,3vw,44px);--fs-card-title:clamp(18px,1.8vw,28px);--fs-body:16px;--fs-body-sm:14px;--fs-caption:13px;--lh-title:1.1;--lh-heading:1.22;--lh-body:1.65;--lh-compact:1.45;--fw-heavy:900;--fw-bold:800;--fw-semibold:700;--fw-medium:600;--fw-normal:400;--theme-name:navyCream;--color-bg:#f5efea;--color-bg-soft:#fbf8f4;--color-surface:#fff;--color-surface-strong:#122e8a;--color-primary:#122e8a;--color-primary-contrast:#fff;--color-secondary:#f5efea;--color-secondary-contrast:#122e8a;--color-text:#12203f;--color-text-soft:#54607a;--color-muted:#7d8494;--color-border:rgba(18,46,138,.14);--color-shadow:rgba(18,46,138,.13);--color-button:#122e8a;--color-button-text:#fff;--color-button-hover:#0d246e;--color-card-topline:#122e8a;--color-focus-shadow:rgba(18,46,138,.14);--color-success:#087a55;--color-warning:#a45d12;--color-danger:#c83245;--gradient-primary:linear-gradient(135deg,#122e8a,#274cc1);--gradient-soft:linear-gradient(135deg,rgba(18,46,138,.12),hsla(27,35%,94%,.82));--c-text:var(--color-text);--c-text-secondary:var(--color-text-soft);--c-text-muted:var(--color-muted);--c-bg:var(--color-bg);--c-surface:var(--color-surface);--c-border:var(--color-border);--toolbar-gap:16px;--toolbar-gap-sm:12px;--t-fast:0.15s ease;--t-normal:0.25s ease}body,html{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:Inter,PingFang SC,Microsoft YaHei,Helvetica Neue,Arial,sans-serif;line-height:var(--lh-body);word-break:normal;overflow-wrap:break-word;color:var(--c-text);background:var(--color-bg)}.hero-title,.page-title,h1{font-size:var(--fs-hero);line-height:var(--lh-title);font-weight:var(--fw-heavy)}.hero-title,.page-title,.section-title,h1,h2{letter-spacing:0;word-break:normal;overflow-wrap:break-word;text-wrap:balance}.section-title,h2{font-size:var(--fs-section-title);line-height:1.15;font-weight:var(--fw-bold)}.card-title,h3{font-size:var(--fs-card-title);line-height:var(--lh-heading);font-weight:var(--fw-bold);word-break:normal;overflow-wrap:break-word}.card-desc,.page-desc,.section-desc,.text-muted{line-height:var(--lh-body);word-break:normal;overflow-wrap:break-word;color:var(--c-text-secondary)}.page-desc,.section-desc{font-size:var(--fs-body)}.card-desc{font-size:var(--fs-body-sm)}.text-muted{font-size:var(--fs-caption);color:var(--c-text-muted)}.badge,.btn,.chip,.el-button,.menu-item,.nav-item,.pill,.tab-item,.tag,a.btn,a.tag,button{white-space:nowrap}.card-title.is-clamp,.list-title.is-clamp{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.text-balanced{text-wrap:balance}.text-start{text-align:start}.text-center{text-align:center}.text-end{text-align:end}.page-shell{min-height:100vh;width:100%;overflow-x:hidden;background:radial-gradient(circle at 10% 0,var(--color-bg-soft),transparent 26rem),var(--color-bg);color:var(--color-text)}.page-container{width:min(100% - 48px,var(--page-max));margin:0 auto}.page-container-wide{width:min(100% - 48px,var(--page-max-wide));margin:0 auto}.page-container-narrow{width:min(100% - 48px,var(--page-max-narrow));margin:0 auto}.page-main{width:100%;min-width:0}.page-section{margin-bottom:var(--section-gap)}.responsive-grid{display:grid;gap:var(--page-gap);grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.responsive-two-col{display:grid;gap:var(--page-gap);grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr)}.responsive-sidebar-layout{display:grid;gap:var(--page-gap);grid-template-columns:minmax(220px,300px) minmax(0,1fr)}.responsive-three-col{display:grid;gap:var(--page-gap);grid-template-columns:repeat(3,minmax(0,1fr))}.card-grid{display:grid;gap:var(--card-gap);grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:var(--toolbar-gap);flex-wrap:wrap}.toolbar-left,.toolbar-right{gap:var(--toolbar-gap-sm)}.toolbar-group,.toolbar-left,.toolbar-right{display:flex;align-items:center;flex-wrap:wrap;min-width:0}.toolbar-group{gap:8px}.action-bar,.filter-bar,.search-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.search-input{flex:1 1 260px;min-width:0}.flex-safe,.grid-safe{min-width:0}.form-grid{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}.form-grid-3{display:grid;gap:16px;grid-template-columns:repeat(3,minmax(0,1fr))}.form-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.responsive-table,.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.responsive-table table,.table-wrap table{min-width:720px}.content-card,.info-card,.section-card{position:relative;min-width:0;overflow:hidden;padding:var(--card-padding);border-radius:var(--card-radius);background:var(--c-surface);border:1px solid var(--c-border);color:var(--color-text);box-shadow:0 16px 42px var(--color-shadow)}.content-card:before,.info-card:before,.section-card:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:var(--color-card-topline);opacity:.75}.content-card>*,.info-card>*,.section-card>*{position:relative}.card-cover{width:100%;aspect-ratio:16/9;-o-object-fit:cover;object-fit:cover}.chart-container,.map-container{width:100%;min-width:0;min-height:420px}.flow>*+*{margin-top:var(--page-gap)}.flow-sm>*+*{margin-top:var(--page-gap-sm)}.btn,button{white-space:nowrap;cursor:pointer;font-family:inherit;letter-spacing:0}.btn,.primary-button,.theme-button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 16px;border:1px solid transparent;border-radius:8px;background:var(--color-button);color:var(--color-button-text);box-shadow:0 12px 28px var(--color-shadow);transition:transform var(--t-fast),background var(--t-fast),border-color var(--t-fast),box-shadow var(--t-fast)}.btn:hover,.primary-button:hover,.theme-button:hover{background:var(--color-button-hover);transform:translateY(-1px)}.btn:active,.primary-button:active,.theme-button:active{transform:translateY(0);box-shadow:0 8px 18px var(--color-shadow)}.btn-secondary,.secondary-button{background:var(--color-bg-soft);color:var(--color-text);border-color:var(--color-border);box-shadow:none}.btn-secondary:hover,.secondary-button:hover{background:var(--color-surface);border-color:var(--color-primary);color:var(--color-primary)}.btn-danger,.danger-button{background:var(--color-danger);color:#fff}.badge,.chip,.el-tag,.pill,.tag{white-space:nowrap;display:inline-flex;align-items:center;border-color:var(--color-border);color:var(--color-primary);background:var(--gradient-soft)}.menu-item,.nav-item,.tab-item{white-space:nowrap}canvas,img,svg,video{max-width:100%}.media-cover{width:100%;aspect-ratio:16/9;-o-object-fit:cover;object-fit:cover}.media-cover--square{aspect-ratio:1/1}.media-cover--wide{aspect-ratio:21/9}.media-contain{width:100%;-o-object-fit:contain;object-fit:contain}.el-button{white-space:nowrap;border-radius:8px}.el-button--primary{border-color:var(--color-button);background:var(--color-button);color:var(--color-button-text)}.el-button--primary:focus,.el-button--primary:hover{border-color:var(--color-button-hover);background:var(--color-button-hover);color:var(--color-button-text)}.el-table{font-size:var(--fs-body-sm);color:var(--color-text);background:var(--color-surface)}.el-table th{white-space:nowrap}.el-card{min-width:0;border-color:var(--color-border);border-radius:var(--card-radius);color:var(--color-text)}.el-card__body{padding:var(--card-padding)}.el-dialog__body{max-height:65vh;overflow-y:auto}.el-pagination{flex-wrap:wrap;justify-content:center}.el-form-item,.el-input,.el-select{min-width:0}.el-input__inner,.el-textarea__inner,input,select,textarea{border-color:var(--color-border);border-radius:8px;color:var(--color-text);background:var(--color-surface);line-height:var(--lh-compact)}.el-input__inner:focus,.el-textarea__inner:focus,input:focus,select:focus,textarea:focus{border-color:var(--color-primary);outline:0;box-shadow:0 0 0 3px var(--color-focus-shadow)}.el-tabs__nav-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}.el-tabs__nav-wrap:after{display:none}.input-full,.select-full{width:100%}.card-title{margin:0}.card-desc{margin-top:8px}.card-meta{margin-top:12px;font-size:var(--fs-caption);color:var(--c-text-muted)}.section-divider{border:0;border-top:1px solid var(--c-border);margin:var(--section-gap) 0}@media (max-width:767px){.section-divider{margin:var(--section-gap-sm) 0}}@media (min-width:1440px){.page-container{width:min(100% - 64px,var(--page-max))}.page-container-wide{width:min(100% - 64px,var(--page-max-wide))}.page-container-narrow{width:min(100% - 64px,var(--page-max-narrow))}}@media (max-width:1199px){.form-grid-3,.responsive-three-col{grid-template-columns:repeat(2,minmax(0,1fr))}.responsive-sidebar-layout{grid-template-columns:minmax(180px,260px) minmax(0,1fr)}}@media (max-width:991px){.page-container,.page-container-narrow,.page-container-wide{width:min(100% - 40px,100%)}.responsive-sidebar-layout,.responsive-two-col{grid-template-columns:1fr}.responsive-three-col{grid-template-columns:repeat(2,minmax(0,1fr))}.toolbar{align-items:flex-start}.tablet-hidden{display:none!important}}@media (max-width:767px){.page-container,.page-container-narrow,.page-container-wide{width:min(100% - 32px,100%)}.page-section{margin-bottom:var(--section-gap-sm)}.card-grid,.form-grid,.form-grid-3,.responsive-grid,.responsive-three-col{grid-template-columns:1fr}.toolbar{flex-direction:column;align-items:stretch}.toolbar-group,.toolbar-left,.toolbar-right{width:100%}.action-bar,.filter-bar,.search-bar{flex-direction:column;align-items:stretch}.search-input{flex-basis:100%;width:100%}.form-actions{flex-direction:column;align-items:stretch}.form-actions .btn,.form-actions button{width:100%}.content-card,.info-card,.section-card{padding:var(--card-padding-sm)}.toolbar .btn,.toolbar button{min-height:40px}.chart-container,.map-container{min-height:320px}.hero-title,.page-title{font-size:clamp(28px,9vw,42px);line-height:1.12}.section-title{font-size:clamp(22px,7vw,32px)}.card-title{font-size:18px}.mobile-hidden{display:none!important}.mobile-only{display:initial!important}.desktop-only{display:none!important}.mobile-compact{display:none}.mobile-compact.is-shown{display:initial}.table-col-extra,.table-col-remark,.table-col-secondary{display:none}.el-dialog{width:calc(100% - 32px)!important;margin:10vh auto 0!important}.el-form-item{display:block}.el-form-item__label{float:none;display:block;width:auto!important;text-align:left}.el-form-item__content{margin-left:0!important}.el-tabs__nav-wrap{overflow-x:auto}.el-tabs__nav-wrap .el-tabs__nav-scroll{overflow:visible}}@media (max-width:575px){.page-container,.page-container-narrow,.page-container-wide{width:min(100% - 24px,100%)}.content-card,.info-card,.section-card{padding:12px}.card-grid{gap:12px}.page-section{margin-bottom:12px}.btn,button{min-height:40px}.btn-sm,.tag-sm{min-height:36px}}.mobile-hidden,.tablet-hidden{display:initial}.mobile-only{display:none}.decorative-info,.desktop-only,.extra-info,.mobile-compact,.secondary-info{display:initial}@media (max-width:991px){.tablet-hidden{display:none!important}}@media (max-width:767px){.mobile-hidden{display:none!important}.mobile-only{display:initial!important}.desktop-only{display:none!important}.mobile-compact{display:none}.decorative-info.mobile-hidden,.extra-info.mobile-hidden,.secondary-info.mobile-hidden{display:none!important}.action-secondary.mobile-hidden,.card-desc.mobile-compact,.card-meta.mobile-compact,.page-desc.mobile-compact{display:none}}@media (max-width:575px){.mobile-compact-sm{display:none}}body,html{height:100%;margin:0}#app{min-height:100vh;width:100%;overflow-x:hidden}.return-button[data-v-165bdf34]{border-radius:5px;padding:2px;top:5px;left:5px;z-index:999;cursor:pointer}.return-button img[data-v-165bdf34]{height:3vh;position:absolute;left:1vh;top:5px;cursor:pointer}.return-button img[data-v-165bdf34]:hover{scale:.9}.tft-detail-page[data-v-d6ec1ebc]{--detail-shell-width:1160px;--detail-roster-width:330px;--detail-title-size:48px;--detail-hex-size:68px;min-height:100vh;color:#f3f6ff;background:linear-gradient(180deg,rgba(9,13,24,.78),rgba(9,13,24,.98)),linear-gradient(115deg,rgba(56,189,248,.2),transparent 34%,rgba(96,165,250,.14) 78%,transparent),url(https://www.yunox.cn/image/s14_bg.png) 50% /cover fixed;text-align:left}.detail-shell[data-v-d6ec1ebc]{width:min(var(--detail-shell-width),calc(100% - 32px));margin:0 auto;padding:64px 0 56px}.detail-hero[data-v-d6ec1ebc]{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:end;min-height:220px;padding:42px 0 24px;position:relative}.detail-hero[data-v-d6ec1ebc]:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,rgba(56,189,248,.82),rgba(96,165,250,.46),transparent)}.eyebrow[data-v-d6ec1ebc]{color:#7fa7ff;font-size:12px;font-weight:900;letter-spacing:0}.detail-hero h1[data-v-d6ec1ebc]{margin:8px 0 10px;color:#fff;max-width:767px;font-size:var(--detail-title-size);line-height:1.15;letter-spacing:0;text-shadow:0 18px 48px rgba(0,0,0,.38)}.detail-hero p[data-v-d6ec1ebc]{margin:0;color:#b9c4d8;font-size:15px}.detail-meta[data-v-d6ec1ebc]{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px;border:1px solid hsla(0,0%,100%,.1);border-radius:8px;background:linear-gradient(180deg,hsla(0,0%,100%,.075),hsla(0,0%,100%,.035)),rgba(13,19,33,.8);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.detail-meta div[data-v-d6ec1ebc]{padding:13px 10px;border-radius:7px;background:hsla(0,0%,100%,.06);text-align:center}.detail-meta strong[data-v-d6ec1ebc]{display:block;color:#fff;font-size:21px}.detail-meta span[data-v-d6ec1ebc]{display:block;margin-top:4px;color:#95a3ba;font-size:12px;font-weight:800}.detail-grid[data-v-d6ec1ebc]{display:grid;grid-template-columns:minmax(0,1fr) var(--detail-roster-width);gap:18px}.panel[data-v-d6ec1ebc]{position:relative;border:1px solid hsla(0,0%,100%,.1);border-radius:8px;background:linear-gradient(180deg,hsla(0,0%,100%,.06),hsla(0,0%,100%,.025)),rgba(14,20,34,.88);box-shadow:0 18px 50px rgba(0,0,0,.28);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);overflow:hidden}.panel[data-v-d6ec1ebc]:before{content:"";position:absolute;inset:0 0 auto;height:3px;background:linear-gradient(90deg,#38bdf8,#60a5fa 56%,transparent);opacity:.78}.panel-head[data-v-d6ec1ebc]{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 20px 0}.panel-head span[data-v-d6ec1ebc]{color:#7fa7ff;font-size:11px;font-weight:900}.panel-head h2[data-v-d6ec1ebc]{margin:4px 0 0;color:#fff;font-size:20px;letter-spacing:0}.board-size[data-v-d6ec1ebc]{padding:7px 10px;border-radius:7px;color:#f8fbff;background:linear-gradient(180deg,rgba(56,189,248,.36),rgba(59,130,246,.22));border:1px solid rgba(56,189,248,.46);font-weight:900;white-space:nowrap}.cost-legend[data-v-d6ec1ebc]{display:flex;flex-wrap:wrap;gap:8px;padding:14px 20px 0}.cost-legend span[data-v-d6ec1ebc]{min-height:26px;padding:0 9px;display:inline-flex;align-items:center;border-left:3px solid #30394a;border-radius:6px;color:#cdd7ec;background:hsla(0,0%,100%,.055);font-size:12px;font-weight:900}.board-stage[data-v-d6ec1ebc]{margin:16px 18px 20px;border:1px solid hsla(0,0%,100%,.08);border-radius:8px;background:linear-gradient(180deg,rgba(127,167,255,.1),hsla(0,0%,100%,.02)),linear-gradient(90deg,hsla(0,0%,100%,.045) 1px,transparent 0),linear-gradient(hsla(0,0%,100%,.035) 1px,transparent 0),rgba(5,9,17,.45);background-size:auto,32px 32px,32px 32px,auto}.chessboard[data-v-d6ec1ebc]{--hex-width:var(--detail-hex-size);--hex-height:calc(var(--hex-width)*1.1);position:relative;display:flex;flex-direction:column;width:-moz-max-content;width:max-content;max-width:100%;margin:0 auto;padding:28px 26px 30px 18px;overflow-x:auto}.row[data-v-d6ec1ebc]{display:flex;min-width:-moz-max-content;min-width:max-content}.row.offset[data-v-d6ec1ebc]{margin-left:calc(var(--hex-width)/2 + 4px)}.hexagon[data-v-d6ec1ebc]{position:relative;width:var(--hex-width);height:var(--hex-height);margin-left:6px;padding:2px;box-sizing:border-box;-webkit-clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);box-shadow:0 10px 26px rgba(0,0,0,.28);transition:transform .18s ease,filter .18s ease}.hexagon.empty[data-v-d6ec1ebc]{background:hsla(0,0%,100%,.065)!important;box-shadow:inset 0 0 0 1px hsla(0,0%,100%,.055)}.hexagon3[data-v-d6ec1ebc]{position:relative;width:var(--hex-width);height:var(--hex-height);margin-left:6px;pointer-events:none}.hexagon[data-v-d6ec1ebc]:hover{cursor:pointer;transform:translateY(-2px);filter:brightness(1.08)}.hexagon img[data-v-d6ec1ebc]{width:100%;height:100%;display:block;-o-object-fit:contain;object-fit:contain;-webkit-clip-path:polygon(50% 4%,96% 27%,96% 73%,50% 96%,4% 73%,4% 27%);clip-path:polygon(50% 4%,96% 27%,96% 73%,50% 96%,4% 73%,4% 27%)}.hexagon3 img[data-v-d6ec1ebc]{width:20px;height:20px;border-radius:4px;background:#0a0f19;border:1px solid hsla(0,0%,100%,.18)}.equipment-layer[data-v-d6ec1ebc]{position:absolute;top:28px;left:18px}.equipment_div[data-v-d6ec1ebc]{gap:2px;display:flex;position:absolute;left:50%;bottom:7px;transform:translateX(-50%);justify-content:center}.characterList[data-v-d6ec1ebc]{padding:0 16px 16px;display:grid;grid-template-columns:repeat(auto-fill,minmax(66px,1fr));gap:10px;justify-content:flex-start}.characterList-info[data-v-d6ec1ebc]{display:flex;flex-direction:column;align-items:center;width:66px;min-height:96px}.portrait[data-v-d6ec1ebc]{width:56px;height:56px;border:2px solid #30394a;border-radius:7px;overflow:hidden;background:#0a0f19;box-shadow:0 10px 22px rgba(0,0,0,.26)}.characterList-image[data-v-d6ec1ebc]{width:100%;height:100%;display:block;-o-object-fit:cover;object-fit:cover}.characterList-equipment[data-v-d6ec1ebc]{margin-top:-6px;min-height:19px;display:flex;justify-content:center;gap:2px}.characterList-equipment img[data-v-d6ec1ebc]{width:18px;height:18px;border-radius:4px;border:1px solid hsla(0,0%,100%,.18);background:#0a0f19}.characterName[data-v-d6ec1ebc]{width:100%;margin-top:4px;color:#dbe5ff;font-size:12px;line-height:1.2;font-weight:800;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.roster-summary[data-v-d6ec1ebc]{display:grid;grid-template-columns:1fr 1.4fr;gap:8px;padding:16px}.roster-summary div[data-v-d6ec1ebc]{min-height:58px;padding:10px;border:1px solid hsla(0,0%,100%,.08);border-radius:8px;background:hsla(0,0%,100%,.045)}.detail-empty span[data-v-d6ec1ebc],.roster-summary span[data-v-d6ec1ebc]{display:block;color:#95a3ba;font-size:12px;font-weight:800}.roster-summary strong[data-v-d6ec1ebc]{display:block;margin-top:7px;color:#fff;font-size:16px;line-height:1.2}.detail-empty[data-v-d6ec1ebc]{display:grid;place-items:center;gap:8px;min-height:220px;margin:16px;border:1px dashed hsla(0,0%,100%,.18);border-radius:8px;color:#dbe5ff;text-align:center}.detail-empty strong[data-v-d6ec1ebc]{color:#fff}@media (min-width:1440px){.tft-detail-page[data-v-d6ec1ebc]{--detail-shell-width:1360px;--detail-roster-width:380px;--detail-title-size:54px;--detail-hex-size:76px;--detail-shell-width:1640px;--detail-roster-width:430px;--detail-title-size:62px;--detail-hex-size:86px;--detail-shell-width:2040px;--detail-roster-width:500px;--detail-title-size:70px;--detail-hex-size:96px}.detail-grid[data-v-d6ec1ebc]{gap:22px}.characterList[data-v-d6ec1ebc]{grid-template-columns:repeat(auto-fill,minmax(78px,1fr))}.portrait[data-v-d6ec1ebc]{width:66px;height:66px}}@media (min-width:3200px){.tft-detail-page[data-v-d6ec1ebc]{--detail-shell-width:2600px;--detail-roster-width:580px;--detail-title-size:78px;--detail-hex-size:108px}}@media (max-width:1199px){.tft-detail-page[data-v-d6ec1ebc]{--detail-shell-width:100%;--detail-title-size:38px;--detail-hex-size:clamp(44px,7vw,64px)}.detail-shell[data-v-d6ec1ebc]{width:min(100% - 24px,1160px);padding-top:50px}.detail-grid[data-v-d6ec1ebc],.detail-hero[data-v-d6ec1ebc]{grid-template-columns:1fr}.detail-grid>[data-v-d6ec1ebc],.detail-hero>[data-v-d6ec1ebc]{min-width:0}.detail-hero[data-v-d6ec1ebc]{min-height:auto;padding-top:30px}.roster-panel[data-v-d6ec1ebc]{order:-1}.characterList[data-v-d6ec1ebc]{grid-template-columns:repeat(auto-fill,minmax(70px,1fr))}}@media (max-width:767px){.tft-detail-page[data-v-d6ec1ebc]{--detail-title-size:30px;--detail-hex-size:clamp(35px,11vw,48px)}.detail-shell[data-v-d6ec1ebc]{width:min(100% - 16px,1160px);padding-top:40px;padding-bottom:32px}.detail-hero[data-v-d6ec1ebc]{gap:14px;padding:20px 0 14px}.detail-grid>[data-v-d6ec1ebc],.detail-hero>[data-v-d6ec1ebc]{min-width:0}.detail-hero p[data-v-d6ec1ebc]{display:none}.detail-meta[data-v-d6ec1ebc]{gap:6px;padding:8px}.detail-meta div[data-v-d6ec1ebc]{padding:9px 6px}.detail-meta strong[data-v-d6ec1ebc]{font-size:17px}.panel-head[data-v-d6ec1ebc]{padding:14px 14px 0}.cost-legend[data-v-d6ec1ebc]{flex-wrap:nowrap;overflow-x:auto;padding:12px 14px 0;scrollbar-width:none}.cost-legend[data-v-d6ec1ebc]::-webkit-scrollbar{display:none}.cost-legend span[data-v-d6ec1ebc]{flex:0 0 auto}.board-stage[data-v-d6ec1ebc]{margin:12px 8px 14px}.chessboard[data-v-d6ec1ebc]{margin-left:0;margin-right:0;padding:18px 16px 20px 10px}.equipment-layer[data-v-d6ec1ebc]{top:18px;left:10px}.hexagon3[data-v-d6ec1ebc],.hexagon[data-v-d6ec1ebc]{margin-left:4px}.row.offset[data-v-d6ec1ebc]{margin-left:calc(var(--hex-width)/2 + 2px)}.hexagon3 img[data-v-d6ec1ebc]{width:15px;height:15px}.roster-summary[data-v-d6ec1ebc]{grid-template-columns:1fr;padding:12px}.characterList[data-v-d6ec1ebc]{grid-template-columns:repeat(auto-fill,minmax(58px,1fr));padding:0 12px 12px}.characterList-info[data-v-d6ec1ebc]{width:auto}.portrait[data-v-d6ec1ebc]{width:50px;height:50px}.characterName[data-v-d6ec1ebc]{font-size:11px}}.create-button[data-v-4d343b04]{background:linear-gradient(180deg,rgba(56,189,248,.96),rgba(37,99,235,.86));color:#f8fbff;border-radius:8px;width:58px;height:58px;padding:0;position:fixed;bottom:24px;right:24px;z-index:999;display:flex;justify-content:center;align-items:center;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:32px;font-weight:800;box-shadow:0 16px 34px rgba(0,0,0,.28),0 0 0 1px hsla(0,0%,100%,.2);transition:transform .18s ease,box-shadow .18s ease,background-color .18s ease}.create-button[data-v-4d343b04]:hover{background:linear-gradient(180deg,rgba(96,210,255,.98),rgba(59,130,246,.9));transform:translateY(-3px);box-shadow:0 20px 44px rgba(0,0,0,.36),0 0 0 1px hsla(0,0%,100%,.24)}.lineup-page[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s17_bg.png);--page-bg:#f1dddf;--panel-bg:#fff9f7;--main:#e72d48;--text:#1a1a1d;--good:#2fa84f;--shell-width:1360px;--card-min:340px;min-height:100vh;padding-bottom:76px;color:var(--text);background:var(--page-bg);position:relative;overflow-x:hidden;text-align:left}.lineup-page[data-v-3b7d2c43]:before{content:"";position:fixed;inset:0;z-index:0;background-image:linear-gradient(180deg,rgba(241,221,223,.72),rgba(241,221,223,.92) 44%,rgba(241,221,223,.98)),var(--season-bg);background-size:cover;background-position:top;background-attachment:fixed}.lineup-page[data-v-3b7d2c43]:after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:radial-gradient(var(--text) 1px,transparent 1px),linear-gradient(90deg,rgba(26,26,29,.08) 3px,transparent 3px);background-size:22px 22px,96px 96px;opacity:.18}.lineup-shell[data-v-3b7d2c43]{width:min(var(--shell-width),calc(100% - 40px));margin:0 auto;padding-top:58px;position:relative;z-index:1}.lineup-hero[data-v-3b7d2c43]{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:stretch;margin-bottom:18px}.control-board[data-v-3b7d2c43],.hero-copy[data-v-3b7d2c43],.lineup[data-v-3b7d2c43],.no-data[data-v-3b7d2c43],.season-card[data-v-3b7d2c43],.summary-card[data-v-3b7d2c43]{background:var(--panel-bg);border:3px solid var(--text);box-shadow:8px 8px 0 var(--main)}.hero-copy[data-v-3b7d2c43]{min-height:260px;padding:34px;position:relative;overflow:hidden}.hero-copy[data-v-3b7d2c43]:before{content:"";position:absolute;right:28px;top:28px;width:118px;height:118px;border:3px solid var(--text);background:linear-gradient(45deg,transparent 0 42%,var(--main) 42% 58%,transparent 58%),var(--panel-bg);box-shadow:6px 6px 0 var(--text);transform:rotate(7deg);opacity:.92}.hero-copy[data-v-3b7d2c43]:after{content:"阵容";position:absolute;right:48px;bottom:28px;color:rgba(231,45,72,.12);font-size:106px;line-height:1;font-weight:900;pointer-events:none}.sticker[data-v-3b7d2c43]{display:inline-flex;align-items:center;min-height:30px;padding:0 12px;margin-bottom:16px;color:var(--panel-bg);background:var(--main);border:3px solid var(--text);box-shadow:4px 4px 0 var(--text);font-size:13px;font-weight:900}.hero-copy h1[data-v-3b7d2c43]{margin:0;max-width:760px;color:var(--text);font-size:clamp(38px,5vw,74px);line-height:.98;letter-spacing:-2px;font-weight:900;position:relative;z-index:1}.hero-copy p[data-v-3b7d2c43]{margin:16px 0 0;max-width:500px;color:var(--text);font-size:18px;line-height:1.75;font-weight:800;position:relative;z-index:1}.hero-actions[data-v-3b7d2c43]{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;position:relative;z-index:1}.primary-action[data-v-3b7d2c43],.secondary-action[data-v-3b7d2c43]{min-height:48px;padding:0 18px;border:3px solid var(--text);color:var(--text);background:var(--panel-bg);box-shadow:5px 5px 0 var(--text);font-size:15px;font-weight:900;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease}.primary-action[data-v-3b7d2c43]{color:var(--panel-bg);background:var(--main)}.lineup[data-v-3b7d2c43]:hover,.primary-action[data-v-3b7d2c43]:hover,.secondary-action[data-v-3b7d2c43]:hover,.version[data-v-3b7d2c43]:hover:not(.disabled){transform:translate(-2px,-2px);box-shadow:8px 8px 0 var(--text)}.season-card[data-v-3b7d2c43]{padding:24px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:8px 8px 0 var(--text);background:var(--main);color:var(--panel-bg)}.season-card-title[data-v-3b7d2c43]{width:-moz-fit-content;width:fit-content;padding:6px 10px;border:3px solid var(--text);color:var(--text);background:var(--panel-bg);font-size:13px;font-weight:900}.season-main strong[data-v-3b7d2c43]{display:block;margin-top:30px;font-size:74px;line-height:.9;color:var(--panel-bg);text-shadow:4px 4px 0 var(--text)}.season-main span[data-v-3b7d2c43]{display:block;margin-top:8px;color:var(--panel-bg);font-size:24px;font-weight:900}.season-stats[data-v-3b7d2c43]{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:24px}.season-stats div[data-v-3b7d2c43]{padding:12px;border:3px solid var(--text);color:var(--text);background:var(--panel-bg);box-shadow:4px 4px 0 var(--text)}.season-stats span[data-v-3b7d2c43],.season-stats strong[data-v-3b7d2c43]{display:block}.season-stats strong[data-v-3b7d2c43]{font-size:28px;line-height:1;font-weight:900}.season-stats span[data-v-3b7d2c43]{margin-top:6px;font-size:12px;font-weight:900}.control-board[data-v-3b7d2c43]{padding:18px;margin-bottom:20px}.control-head[data-v-3b7d2c43]{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:14px}.control-head span[data-v-3b7d2c43],.control-head strong[data-v-3b7d2c43]{display:block}.control-head strong[data-v-3b7d2c43]{font-size:22px;font-weight:900}.control-head span[data-v-3b7d2c43]{margin-top:4px;font-size:13px;font-weight:800}.versionSelector[data-v-3b7d2c43]{display:grid;grid-template-columns:repeat(9,minmax(0,1fr));gap:10px}.version[data-v-3b7d2c43]{min-height:56px;padding:8px 10px;border:3px solid var(--text);color:var(--text);background:var(--panel-bg);box-shadow:4px 4px 0 var(--text);cursor:pointer;font-weight:900;transition:transform .16s ease,box-shadow .16s ease,background .16s ease;-webkit-user-select:none;-moz-user-select:none;user-select:none}.version small[data-v-3b7d2c43],.version span[data-v-3b7d2c43]{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.version small[data-v-3b7d2c43]{margin-top:3px;color:rgba(26,26,29,.72);font-size:11px;font-weight:900}.version.active[data-v-3b7d2c43]{color:var(--panel-bg);background:var(--main)}.version.active small[data-v-3b7d2c43]{color:var(--panel-bg)}.version.disabled[data-v-3b7d2c43]{opacity:.72;cursor:not-allowed}.search-container[data-v-3b7d2c43]{display:flex;align-items:center;min-height:46px;min-width:52px;padding:0 12px;border:3px solid var(--text);background:var(--panel-bg);box-shadow:4px 4px 0 var(--text)}.search-container.active[data-v-3b7d2c43]{min-width:min(320px,100%);background:#fff}.search-input[data-v-3b7d2c43]{width:220px;margin:0 8px;padding:0;border:0;color:var(--text);background:transparent;font-size:15px;font-weight:800}.search-input[data-v-3b7d2c43]::-moz-placeholder{color:rgba(26,26,29,.52)}.search-input[data-v-3b7d2c43]::placeholder{color:rgba(26,26,29,.52)}.search-input[data-v-3b7d2c43]:focus{outline:none}.el-icon-close[data-v-3b7d2c43],.el-icon-search[data-v-3b7d2c43]{color:var(--text);cursor:pointer;font-size:19px;font-weight:900}.content-layout[data-v-3b7d2c43]{display:grid;grid-template-columns:260px minmax(0,1fr);gap:20px;align-items:start}.side-summary[data-v-3b7d2c43]{display:grid;gap:14px;position:sticky;top:18px}.summary-card[data-v-3b7d2c43]{padding:18px;box-shadow:6px 6px 0 var(--text)}.summary-card p[data-v-3b7d2c43],.summary-card span[data-v-3b7d2c43],.summary-card strong[data-v-3b7d2c43]{display:block}.summary-card span[data-v-3b7d2c43]{font-size:12px;font-weight:900}.summary-card strong[data-v-3b7d2c43]{margin-top:6px;font-size:24px;line-height:1.15;font-weight:900}.summary-card p[data-v-3b7d2c43]{margin:10px 0 0;font-size:13px;line-height:1.7;font-weight:800}.strong-card[data-v-3b7d2c43]{color:var(--panel-bg);background:var(--main)}.compact-card[data-v-3b7d2c43]{background:linear-gradient(135deg,rgba(231,45,72,.16) 0 25%,transparent 25% 50%,rgba(231,45,72,.16) 50% 75%,transparent 75%),var(--panel-bg);background-size:28px 28px}.lineupTotal[data-v-3b7d2c43]{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--card-min)),1fr));gap:18px;min-height:200px}.lineup[data-v-3b7d2c43]{position:relative;min-height:360px;padding:18px;transition:transform .16s ease,box-shadow .16s ease;cursor:pointer;overflow:hidden}.lineup.loading[data-v-3b7d2c43]{opacity:.7;pointer-events:none}.card-corner[data-v-3b7d2c43]{position:absolute;top:-3px;right:-3px;min-width:52px;height:38px;display:grid;place-items:center;border:3px solid var(--text);background:var(--main);color:var(--panel-bg);font-weight:900}.lineup-card-head[data-v-3b7d2c43]{display:flex;justify-content:space-between;gap:14px;align-items:flex-start;padding-right:48px}.tier-badge[data-v-3b7d2c43]{display:inline-flex;align-items:center;min-height:26px;padding:0 9px;border:3px solid var(--text);color:var(--panel-bg);background:var(--main);font-size:12px;font-weight:900}.formation-name[data-v-3b7d2c43]{margin:11px 0 0;color:var(--text);font-size:21px;line-height:1.35;font-weight:900;letter-spacing:0}.unit-count[data-v-3b7d2c43]{flex:0 0 auto;min-width:58px;padding:9px 10px;border:3px solid var(--text);color:var(--text);background:var(--panel-bg);box-shadow:4px 4px 0 var(--text);font-weight:900;text-align:center}.unit-count span[data-v-3b7d2c43],.unit-count strong[data-v-3b7d2c43]{display:block}.unit-count strong[data-v-3b7d2c43]{font-size:22px;line-height:1}.unit-count span[data-v-3b7d2c43]{margin-top:4px;font-size:11px}.core-preview[data-v-3b7d2c43]{display:grid;gap:12px;margin:18px 0 14px;padding:14px;border:3px solid var(--text);background:rgba(241,221,223,.58)}.core-label[data-v-3b7d2c43]{color:var(--text);font-size:13px;font-weight:900}.core-grid[data-v-3b7d2c43]{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.core-unit[data-v-3b7d2c43]{display:grid;justify-items:center;min-width:0;gap:3px}.core-portrait[data-v-3b7d2c43]{width:58px;height:58px;border:3px solid var(--text);background:#fff;overflow:hidden;box-shadow:4px 4px 0 var(--text)}.core-portrait img[data-v-3b7d2c43]{width:100%;height:100%;display:block;-o-object-fit:cover;object-fit:cover}.core-equipment[data-v-3b7d2c43]{display:flex;justify-content:center;gap:2px;min-height:20px;margin-top:-8px}.core-equipment img[data-v-3b7d2c43]{width:18px;height:18px;border:2px solid var(--text);background:#fff;box-shadow:2px 2px 0 var(--text)}.core-name[data-v-3b7d2c43],.unit-name[data-v-3b7d2c43]{width:100%;color:var(--text);font-size:11px;line-height:1.2;font-weight:900;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lineup-metrics[data-v-3b7d2c43]{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 14px}.lineup-metrics div[data-v-3b7d2c43]{padding:10px 8px;border:3px solid var(--text);background:var(--panel-bg);text-align:center}.lineup-metrics span[data-v-3b7d2c43],.lineup-metrics strong[data-v-3b7d2c43]{display:block;font-weight:900}.lineup-metrics strong[data-v-3b7d2c43]{font-size:20px}.lineup-metrics span[data-v-3b7d2c43]{margin-top:3px;font-size:11px}.image-container[data-v-3b7d2c43]{display:flex;flex-wrap:wrap;align-items:flex-start;gap:10px}.character-info[data-v-3b7d2c43]{display:flex;flex-direction:column;align-items:center;width:50px;min-height:88px}.avatar-frame[data-v-3b7d2c43]{width:48px;height:48px;border:3px solid var(--text);overflow:hidden;background:#fff;box-shadow:3px 3px 0 var(--text)}.character-image[data-v-3b7d2c43]{width:100%;height:100%;display:block;-o-object-fit:cover;object-fit:cover;transition:transform .18s ease}.avatar-frame:hover .character-image[data-v-3b7d2c43]{transform:scale(1.08)}.equipment[data-v-3b7d2c43]{display:flex;gap:1px;min-height:18px;margin-top:-6px;justify-content:center}.equipment img[data-v-3b7d2c43]{width:16px;height:16px;border:2px solid var(--text);background:#fff;transition:transform .18s ease}.equipment img[data-v-3b7d2c43]:hover{transform:translateY(-2px)}.lineup-card-footer[data-v-3b7d2c43]{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;padding-top:14px;border-top:3px solid var(--text)}.lineup-card-footer span[data-v-3b7d2c43]{color:var(--text);font-size:13px;font-weight:900}.lineup-card-footer strong[data-v-3b7d2c43]{padding:6px 10px;border:3px solid var(--text);color:var(--panel-bg);background:var(--main);box-shadow:3px 3px 0 var(--text);font-size:13px;font-weight:900}.backGround1[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s6_bg.jpg)}.backGround2[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s11_bg.png)}.backGround3[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s12_bg.jpg)}.backGround4[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s13_bg.png)}.backGround5[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s14_bg.png)}.backGround6[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s16_bg.png)}.backGround7[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s4_bg.png)}.backGround8[data-v-3b7d2c43]{--season-bg:url(https://www.yunox.cn/image/s17_bg.png)}.no-data[data-v-3b7d2c43]{display:grid;place-items:center;gap:9px;min-height:280px;padding:24px;text-align:center;color:var(--text)}.no-data span[data-v-3b7d2c43],.no-data strong[data-v-3b7d2c43]{display:block;font-weight:900}.no-data span[data-v-3b7d2c43]{font-size:14px}.loader-dot[data-v-3b7d2c43]{width:16px;height:16px;background:var(--main);animation:pulse-3b7d2c43 1.1s ease-in-out infinite}.end-text[data-v-3b7d2c43],.loader-dot[data-v-3b7d2c43]{border:3px solid var(--text);box-shadow:4px 4px 0 var(--text)}.end-text[data-v-3b7d2c43]{width:-moz-fit-content;width:fit-content;margin:26px auto 0;padding:8px 14px;background:var(--panel-bg);color:var(--text);font-size:13px;font-weight:900}@keyframes pulse-3b7d2c43{0%,to{transform:translate(0)}50%{transform:translate(-2px,-2px);box-shadow:7px 7px 0 var(--text)}}@media (min-width:1920px){.lineup-page[data-v-3b7d2c43]{--shell-width:1440px;--card-min:360px}.hero-copy[data-v-3b7d2c43]{min-height:292px}}@media (max-width:1199px){.lineup-page[data-v-3b7d2c43]{--shell-width:100%;--card-min:310px}.lineup-shell[data-v-3b7d2c43]{width:min(100% - 28px,1120px);padding-top:46px}.lineup-hero[data-v-3b7d2c43]{grid-template-columns:1fr}.season-card[data-v-3b7d2c43]{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:end}.season-main strong[data-v-3b7d2c43]{margin-top:18px;font-size:58px}.season-stats[data-v-3b7d2c43]{width:260px}.versionSelector[data-v-3b7d2c43]{grid-template-columns:repeat(3,minmax(0,1fr))}.content-layout[data-v-3b7d2c43]{grid-template-columns:1fr}.side-summary[data-v-3b7d2c43]{position:static;grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width:768px) and (max-width:1199px){.lineupTotal[data-v-3b7d2c43]{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:767px){.lineup-shell[data-v-3b7d2c43]{width:calc(100% - 32px);padding-top:38px}.control-board[data-v-3b7d2c43],.hero-copy[data-v-3b7d2c43],.lineup[data-v-3b7d2c43],.no-data[data-v-3b7d2c43],.season-card[data-v-3b7d2c43],.summary-card[data-v-3b7d2c43]{box-shadow:6px 6px 0 var(--main)}.hero-copy[data-v-3b7d2c43]{min-height:auto;padding:22px}.hero-copy[data-v-3b7d2c43]:before{width:70px;height:70px;right:16px;top:18px}.hero-copy[data-v-3b7d2c43]:after{display:none}.hero-copy h1[data-v-3b7d2c43]{max-width:250px;font-size:38px;letter-spacing:-1px}.hero-copy p[data-v-3b7d2c43]{font-size:15px}.hero-actions[data-v-3b7d2c43]{display:grid;grid-template-columns:1fr}.primary-action[data-v-3b7d2c43],.secondary-action[data-v-3b7d2c43]{width:100%}.season-card[data-v-3b7d2c43]{display:block;padding:18px}.season-main strong[data-v-3b7d2c43]{font-size:48px}.season-main span[data-v-3b7d2c43]{font-size:20px}.season-stats[data-v-3b7d2c43]{width:auto;margin-top:16px}.control-head[data-v-3b7d2c43]{display:grid;grid-template-columns:1fr}.search-container.active[data-v-3b7d2c43],.search-container[data-v-3b7d2c43]{width:100%;min-width:0;box-sizing:border-box}.search-container.active .search-input[data-v-3b7d2c43]{display:block!important}.search-input[data-v-3b7d2c43]{width:100%}.versionSelector[data-v-3b7d2c43]{display:flex;overflow-x:auto;padding:0 0 6px;scrollbar-width:none}.versionSelector[data-v-3b7d2c43]::-webkit-scrollbar{display:none}.version[data-v-3b7d2c43]{flex:0 0 126px;min-width:126px}.side-summary[data-v-3b7d2c43]{display:none}.lineupTotal[data-v-3b7d2c43]{grid-template-columns:1fr;gap:14px}.lineup[data-v-3b7d2c43]{min-height:auto;padding:14px}.lineup-card-head[data-v-3b7d2c43]{padding-right:40px}.formation-name[data-v-3b7d2c43]{font-size:18px}.unit-count[data-v-3b7d2c43]{min-width:50px;padding:7px 8px}.core-preview[data-v-3b7d2c43]{padding:10px}.core-grid[data-v-3b7d2c43]{gap:7px}.core-portrait[data-v-3b7d2c43]{width:46px;height:46px}.core-equipment img[data-v-3b7d2c43]{width:15px;height:15px}.lineup-metrics[data-v-3b7d2c43]{gap:6px}.lineup-metrics div[data-v-3b7d2c43]{padding:8px 5px}.character-info[data-v-3b7d2c43]{width:43px;min-height:78px}.avatar-frame[data-v-3b7d2c43]{width:41px;height:41px}.equipment img[data-v-3b7d2c43]{width:14px;height:14px}.core-name[data-v-3b7d2c43],.unit-name[data-v-3b7d2c43]{font-size:10px}}.create-lineup-page[data-v-7115698e]{--page-bg:#f1dddf;--panel-bg:#fff9f7;--ink:#1a1a1d;--red:#e72d48;--green:#2fa84f;--season-bg:url(https://www.yunox.cn/image/s14_bg.png);--page-width:1360px;--hex-size:74px;min-height:100vh;padding:0 0 72px;color:var(--ink);background:var(--page-bg);position:relative;overflow-x:hidden;text-align:left}.create-lineup-page[data-v-7115698e]:before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background-image:linear-gradient(90deg,rgba(241,221,223,.97),rgba(241,221,223,.86) 48%,rgba(231,45,72,.25)),linear-gradient(rgba(26,26,29,.06) 2px,transparent 2px),linear-gradient(90deg,rgba(26,26,29,.05) 2px,transparent 2px),var(--season-bg);background-size:cover,34px 34px,34px 34px,cover;background-position:50%;background-attachment:fixed}.create-lineup-page[data-v-7115698e]:after{content:"";position:fixed;right:5vw;top:92px;width:128px;height:128px;z-index:0;pointer-events:none;background:linear-gradient(90deg,var(--ink) 0 12px,transparent 12px 26px) 0 0 /26px 26px,linear-gradient(var(--ink) 0 12px,transparent 12px 26px) 0 0 /26px 26px;opacity:.09}.createBgS4[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s4_bg.png)}.createBgS6[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s6_bg.jpg)}.createBgS11[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s11_bg.png)}.createBgS12[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s12_bg.jpg)}.createBgS13[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s13_bg.png)}.createBgS14[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s14_bg.png)}.createBgS16[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s16_bg.png)}.createBgS17[data-v-7115698e]{--season-bg:url(https://www.yunox.cn/image/s17_bg.png)}.create-container[data-v-7115698e]{width:min(var(--page-width),calc(100% - 40px));margin:0 auto;padding-top:72px;position:relative;z-index:1}.create-hero-panel[data-v-7115698e]{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:28px;align-items:stretch;margin-bottom:22px}.builder-panel[data-v-7115698e],.hero-copy[data-v-7115698e],.hero-side-card[data-v-7115698e],.season-strip-panel[data-v-7115698e]{background:var(--panel-bg);border:3px solid var(--ink);box-shadow:8px 8px 0 var(--red)}.hero-copy[data-v-7115698e]{min-height:210px;padding:30px;position:relative;overflow:hidden}.hero-copy[data-v-7115698e]:after{content:"";position:absolute;right:-28px;bottom:-30px;width:170px;height:170px;background:var(--red);border:3px solid var(--ink);transform:rotate(-8deg);opacity:.16}.sticker[data-v-7115698e]{display:inline-flex;align-items:center;min-height:28px;padding:0 12px;background:var(--red);color:var(--panel-bg);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);font-size:13px;font-weight:900}.hero-copy h1[data-v-7115698e]{margin:20px 0 12px;max-width:720px;color:var(--ink);font-size:clamp(40px,5vw,74px);line-height:.98;letter-spacing:-2px;font-weight:950}.hero-copy p[data-v-7115698e]{margin:0;max-width:680px;color:var(--ink);font-size:17px;line-height:1.8;font-weight:800}.hero-side-card[data-v-7115698e]{display:flex;flex-direction:column;justify-content:space-between;gap:16px;padding:20px}.title-field[data-v-7115698e]{display:grid;gap:10px}.control-row span[data-v-7115698e],.quick-status span[data-v-7115698e],.section-head span[data-v-7115698e],.tip-title[data-v-7115698e],.title-field span[data-v-7115698e]{color:var(--ink);font-size:13px;font-weight:950}.titleInput[data-v-7115698e]{width:100%;height:52px;box-sizing:border-box;padding:0 14px;color:var(--ink);background:var(--panel-bg);border:3px solid var(--ink);border-radius:0;outline:none;font-size:16px;font-weight:900;box-shadow:4px 4px 0 rgba(26,26,29,.18)}.titleInput[data-v-7115698e]:focus{box-shadow:5px 5px 0 var(--red)}.quick-status[data-v-7115698e]{display:grid;grid-template-columns:1fr 1fr;gap:12px}.quick-status div[data-v-7115698e]{min-width:0;padding:14px;background:#f1dddf;border:3px solid var(--ink)}.quick-status strong[data-v-7115698e]{display:block;color:var(--red);font-size:24px;line-height:1.1;font-weight:950;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.quick-status span[data-v-7115698e]{display:block;margin-top:6px}.season-strip-panel[data-v-7115698e]{margin-bottom:24px}.section-head[data-v-7115698e]{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:18px 20px 0}.section-head h2[data-v-7115698e]{margin:5px 0 0;color:var(--ink);font-size:25px;line-height:1.15;font-weight:950}.section-head strong[data-v-7115698e]{flex:0 0 auto;max-width:48%;padding:7px 11px;color:var(--panel-bg);background:var(--red);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);font-size:13px;font-weight:950}.createLineup_versionSelector[data-v-7115698e]{display:flex;flex-wrap:wrap;gap:10px;padding:18px 20px 20px;box-sizing:border-box}.createLineup_version[data-v-7115698e]{flex:1 1 118px;min-width:118px;min-height:52px;padding:8px 12px;color:var(--ink);background:var(--panel-bg);border:3px solid var(--ink);box-shadow:4px 4px 0 rgba(26,26,29,.22);cursor:pointer;font-weight:950;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}.createLineup_version[data-v-7115698e]:hover{transform:translate(-1px,-1px);box-shadow:6px 6px 0 var(--ink)}.createLineup_version.active[data-v-7115698e]{color:var(--panel-bg);background:var(--red);box-shadow:6px 6px 0 var(--ink)}.createLineup_version small[data-v-7115698e],.createLineup_version span[data-v-7115698e]{display:block}.createLineup_version small[data-v-7115698e]{margin-top:2px;color:inherit;font-size:12px;opacity:.72}.workbench-grid[data-v-7115698e]{display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:24px;align-items:start}.board-panel[data-v-7115698e]{min-width:0;overflow:hidden}.right-column[data-v-7115698e]{display:grid;gap:24px}.equipment-panel[data-v-7115698e]{grid-column:1/-1}.board-help[data-v-7115698e]{margin:14px 20px 0;padding:10px 12px;color:var(--ink);background:#f1dddf;border:3px solid var(--ink);font-size:14px;line-height:1.55;font-weight:850}.chessboard_create[data-v-7115698e]{--hex-width:var(--hex-size);--hex-height:calc(var(--hex-width)*1.08);position:relative;display:flex;flex-direction:column;width:-moz-max-content;width:max-content;max-width:100%;margin:12px auto 6px;padding:24px 24px 30px 16px;overflow-x:auto}.character_list[data-v-7115698e]::-webkit-scrollbar,.chessboard_create[data-v-7115698e]::-webkit-scrollbar,.createLineup_versionSelector[data-v-7115698e]::-webkit-scrollbar{height:8px;width:8px}.character_list[data-v-7115698e]::-webkit-scrollbar-thumb,.chessboard_create[data-v-7115698e]::-webkit-scrollbar-thumb,.createLineup_versionSelector[data-v-7115698e]::-webkit-scrollbar-thumb{background:var(--red);border:2px solid var(--ink)}.row_create[data-v-7115698e]{display:flex;min-width:-moz-max-content;min-width:max-content}.row_create.offset[data-v-7115698e]{margin-left:calc(var(--hex-width)/2 + 4px)}.hexagon_create[data-v-7115698e]{position:relative;width:var(--hex-width);height:var(--hex-height);margin-left:7px;padding:3px;box-sizing:border-box;-webkit-clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background-color:#fff9f7;border:0;filter:drop-shadow(4px 5px 0 rgba(26,26,29,.55));transition:transform .16s ease,filter .16s ease}.hexagon_create[data-v-7115698e]:before{content:"";position:absolute;inset:0;background:var(--ink);-webkit-clip-path:inherit;clip-path:inherit;z-index:-1}.hexagon_create.selected[data-v-7115698e]{transform:translate(-2px,-3px);filter:drop-shadow(7px 8px 0 var(--red))}.hexagon_create.occupied[data-v-7115698e]{filter:drop-shadow(5px 6px 0 rgba(26,26,29,.7))}.hexagon_create img[data-v-7115698e]{width:100%;height:100%;display:block;-o-object-fit:contain;object-fit:contain;background:rgba(255,249,247,.68);-webkit-clip-path:polygon(50% 4%,96% 27%,96% 73%,50% 96%,4% 73%,4% 27%);clip-path:polygon(50% 4%,96% 27%,96% 73%,50% 96%,4% 73%,4% 27%)}.hexagon3_create[data-v-7115698e]{position:relative;width:var(--hex-width);height:var(--hex-height);margin-left:7px;cursor:pointer}.equipment-layer-create[data-v-7115698e]{position:absolute;top:24px;left:16px}.equipment_div[data-v-7115698e]{display:flex;justify-content:center;gap:3px;position:absolute;left:50%;bottom:8px;transform:translateX(-50%)}.hexagon3_create img[data-v-7115698e]{width:20px;height:20px;background:var(--panel-bg);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink)}.control-row[data-v-7115698e]{display:flex;align-items:center;gap:12px;padding:14px 18px 16px}.equipment-toolbar[data-v-7115698e]{align-items:flex-start}.create-lineup-page[data-v-7115698e] .el-radio-group{display:flex;flex-wrap:wrap;gap:8px}.create-lineup-page[data-v-7115698e] .el-radio-button__inner{color:var(--ink);background:var(--panel-bg);border:3px solid var(--ink)!important;border-radius:0!important;box-shadow:3px 3px 0 rgba(26,26,29,.24);font-weight:950}.create-lineup-page[data-v-7115698e] .el-radio-button__orig-radio:checked+.el-radio-button__inner{color:var(--panel-bg);background:var(--red);border-color:var(--ink)!important;box-shadow:4px 4px 0 var(--ink)}.create-lineup-page[data-v-7115698e] .el-radio-button:first-child .el-radio-button__inner,.create-lineup-page[data-v-7115698e] .el-radio-button:last-child .el-radio-button__inner{border-radius:0!important}.character_list[data-v-7115698e]{display:grid;grid-template-columns:repeat(auto-fill,minmax(64px,1fr));gap:12px;max-height:440px;overflow-y:auto;padding:0 18px 18px}.equipment-list[data-v-7115698e]{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));max-height:250px}.character_item[data-v-7115698e],.equipment_item[data-v-7115698e]{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;cursor:pointer}.character_image[data-v-7115698e]{width:54px;height:54px;-o-object-fit:cover;object-fit:cover;background:var(--panel-bg);border:3px solid var(--ink);box-shadow:4px 4px 0 rgba(26,26,29,.35);transition:transform .16s ease,box-shadow .16s ease}.character_item:hover .character_image[data-v-7115698e],.equipment_item:hover .character_image[data-v-7115698e]{transform:translate(-1px,-2px);box-shadow:6px 6px 0 var(--red)}.equipment_image[data-v-7115698e]{width:44px;height:44px}.character_name[data-v-7115698e]{width:100%;color:var(--ink);font-size:12px;line-height:1.25;text-align:center;font-weight:900;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.side-tip-panel[data-v-7115698e]{padding:18px;box-shadow:8px 8px 0 var(--ink)}.side-tip-panel p[data-v-7115698e]{margin:10px 0 0;color:var(--ink);font-size:15px;line-height:1.7;font-weight:800}.empty-state[data-v-7115698e]{margin:0 18px 18px;padding:18px;color:var(--ink);background:#f1dddf;border:3px solid var(--ink);font-size:14px;font-weight:900}.save-float-button[data-v-7115698e]{min-height:48px;padding:0 22px;position:fixed;top:16px;right:18px;z-index:999;color:var(--panel-bg);background:var(--red);border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);cursor:pointer;font-size:15px;font-weight:950;transition:transform .16s ease,box-shadow .16s ease}.save-float-button[data-v-7115698e]:hover{transform:translate(-1px,-1px);box-shadow:7px 7px 0 var(--ink)}@media (min-width:1600px { .create-lineup-page { --page-width:1440px; --hex-size:80px; } } @media (min-width:2200px { .create-lineup-page { --page-width:1440px; } } @media (max-width:1199px { .create-lineup-page { --hex-size:clamp(50px,7vw,68px); } .create-container { width:min(100% - 28px,1120px); padding-top:64px; } .create-hero-panel,.workbench-grid { grid-template-columns:1fr; } .right-column { grid-template-columns:minmax(0,1fr) 300px; align-items:start; } .picker-panel,.side-tip-panel,.equipment-panel { min-width:0; } } @media (max-width:767px { .create-lineup-page { --hex-size:clamp(36px,11vw,48px); padding-bottom:104px; } .create-lineup-page::before { background-attachment:scroll; background-image:linear-gradient(180deg,rgba(241,221,223,0.98),rgba(241,221,223,0.9)),linear-gradient(rgba(26,26,29,0.05) 2px,transparent 2px),linear-gradient(90deg,rgba(26,26,29,0.05) 2px,transparent 2px),var(--season-bg ); } .create-container { width:calc(100% - 32px); padding-top:48px; } .create-hero-panel,.right-column,.workbench-grid { grid-template-columns:1fr; gap:16px; } .hero-copy,.hero-side-card,.season-strip-panel,.builder-panel { box-shadow:6px 6px 0 var(--red ); } .hero-copy { min-height:auto; padding:20px; } .hero-copy h1 { margin-top:16px; font-size:38px; letter-spacing:-1px; } .hero-copy p { font-size:15px; line-height:1.65; } .hero-side-card { padding:16px; } .quick-status { grid-template-columns:1fr; } .season-strip-panel { position:relative; margin-bottom:18px; } .section-head { padding:15px 15px 0; } .section-head h2 { font-size:21px; } .section-head strong { max-width:45%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .createLineup_versionSelector { flex-wrap:nowrap; overflow-x:auto; padding:14px 15px 16px; scrollbar-width:none; } .createLineup_versionSelector::-webkit-scrollbar { display:none; } .createLineup_version { flex:0 0 122px; min-width:122px; } .board-help { margin:12px 15px 0; font-size:13px; } .chessboard_create { margin:0; padding:20px 16px 22px 10px; } .equipment-layer-create { top:20px; left:10px; } .hexagon_create,.hexagon3_create { margin-left:4px; } .row_create.offset { margin-left:calc(var(--hex-width ) / 2 + 2px); } .hexagon3_create img { width:15px; height:15px; border-width:1px; box-shadow:1px 1px 0 var(--ink ); } .control-row,.equipment-toolbar { align-items:flex-start; flex-direction:column; padding:13px 15px 14px; } .character_list { grid-template-columns:repeat(auto-fill,minmax(54px,1fr)); gap:10px; max-height:280px; padding:0 15px 16px; } .equipment-list { grid-template-columns:repeat(auto-fill,minmax(44px,1fr)); max-height:210px; } .character_image { width:46px; height:46px; border-width:2px; box-shadow:3px 3px 0 rgba(26,26,29,0.35); } .equipment_image { width:38px; height:38px; } .character_name { font-size:11px; } .side-tip-panel { display:none; } .save-float-button { top:auto; left:16px; right:16px; bottom:16px; width:calc(100% - 32px); min-height:52px; } } .navigationBar[data-v-12819946] { position:fixed; right:clamp(14px,2.6vw,48px); top:clamp(12px,1.8vw,24px); z-index:1000; color:var(--color-text ); } .nav-container[data-v-12819946] { position:relative; display:flex; justify-content:flex-end; } .nav-trigger[data-v-12819946] { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-width:78px; min-height:46px; padding:0 10px 0 16px; border:1px solid var(--color-border ); border-radius:999px; background:var(--color-surface ); box-sizing:border-box; color:inherit; cursor:pointer; box-shadow:0 16px 42px var(--color-shadow ); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); transition:transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease,background 0.2s ease; } .trigger-label[data-v-12819946] { color:var(--color-text ); font-size:13px; font-weight:900; line-height:1; letter-spacing:0; } .trigger-icon[data-v-12819946] { position:relative; display:inline-flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; width:30px; height:30px; border-radius:999px; background:var(--color-button ); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.08); } .trigger-icon span[data-v-12819946] { display:block; width:15px; height:2px; border-radius:999px; background:#ffffff; transform-origin:center; transition:transform 0.22s ease,width 0.22s ease,opacity 0.22s ease,background 0.22s ease; } .nav-trigger[data-v-12819946]:hover { transform:translateY(-2px); border-color:rgba(239,111,97,0.34); background:var(--gradient-soft ); box-shadow:0 22px 54px var(--color-shadow ); } .nav-trigger[data-v-12819946]:active { transform:translateY(0) scale(0.98); } .nav-trigger[data-v-12819946]:focus-visible,.navigation-menu-item[data-v-12819946]:focus-visible { outline:0; box-shadow:0 0 0 4px rgba(42,196,255,0.22),0 16px 42px rgba(15,23,42,0.12); } .navigationBar.is-open .nav-trigger[data-v-12819946] { border-color:rgba(15,159,154,0.34); background:var(--gradient-soft ); } .navigationBar.is-open .trigger-icon[data-v-12819946] { background:var(--color-primary ); } .nav-trigger[aria-expanded="true"] .trigger-icon span[data-v-12819946]:nth-child(1) { transform:translateY(7px) rotate(45deg); } .nav-trigger[aria-expanded="true"] .trigger-icon span[data-v-12819946]:nth-child(2) { opacity:0; transform:scaleX(0.2); } .nav-trigger[aria-expanded="true"] .trigger-icon span[data-v-12819946]:nth-child(3) { transform:translateY(-7px) rotate(-45deg); } .navigation-menu[data-v-12819946] { position:absolute; right:0; top:58px; display:grid; gap:8px; width:min(78vw,292px); padding:10px; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); box-shadow:0 24px 70px var(--color-shadow ); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); transform-origin:92% -8px; } .navigation-menu[data-v-12819946]::before { content:""; position:absolute; right:28px; top:-6px; width:12px; height:12px; border-left:1px solid var(--color-border ); border-top:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.97); transform:rotate(45deg); } .navigation-menu-item[data-v-12819946] { position:relative; display:grid; grid-template-columns:38px minmax(0,1fr); gap:10px; align-items:center; width:100%; min-height:64px; padding:10px; border:1px solid var(--color-border ); border-radius:6px; background:rgba(255,255,255,0.68); color:#334155; cursor:pointer; font-family:inherit; text-align:left; overflow:hidden; transition:transform 0.18s ease,border-color 0.18s ease,box-shadow 0.18s ease,background 0.18s ease; } .navigation-menu-item[data-v-12819946]:hover { transform:translateY(-2px); border-color:rgba(239,111,97,0.2); background:#ffffff; box-shadow:0 16px 34px var(--color-shadow ); } .navigation-menu-item[data-v-12819946]::after { content:""; position:absolute; inset:auto 10px 8px 58px; height:2px; border-radius:999px; background:var(--gradient-primary ); opacity:0; transform:scaleX(0.24); transform-origin:left; transition:opacity 0.18s ease,transform 0.18s ease; } .navigation-menu-item[data-v-12819946]:hover::after,.navigation-menu-item.current[data-v-12819946]::after { opacity:1; transform:scaleX(1); } .item-mark[data-v-12819946] { display:inline-flex; width:38px; height:38px; align-items:center; justify-content:center; border-radius:8px; background:var(--color-bg-soft ); color:var(--color-text ); font-size:15px; font-weight:900; } .item-copy[data-v-12819946] { display:grid; gap:4px; min-width:0; } .item-copy strong[data-v-12819946] { overflow:hidden; color:var(--color-text ); font-size:15px; font-weight:900; line-height:1.1; text-overflow:ellipsis; white-space:nowrap; } .item-copy small[data-v-12819946] { overflow:hidden; color:#64748b; font-size:12px; font-weight:700; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; } .navigation-menu-item.current[data-v-12819946] { border-color:rgba(15,159,154,0.28); background:var(--gradient-soft ); } .navigation-menu-item.current .item-mark[data-v-12819946] { background:var(--color-primary ); color:#ffffff; } .nav-menu-enter-active[data-v-12819946],.nav-menu-leave-active[data-v-12819946] { transition:opacity 0.2s ease,transform 0.24s cubic-bezier(0.2,0.8,0.2,1); } .nav-menu-enter[data-v-12819946],.nav-menu-leave-to[data-v-12819946] { opacity:0; transform:translateY(-8px) scale(0.94); } .nav-menu-enter-active .navigation-menu-item[data-v-12819946] { animation:navItemIn-12819946 0.24s ease both; } .nav-menu-enter-active .navigation-menu-item[data-v-12819946]:nth-child(2) { animation-delay:0.04s; } .nav-menu-enter-active .navigation-menu-item[data-v-12819946]:nth-child(3) { animation-delay:0.08s; } @keyframes navItemIn-12819946 { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:translateY(0); } } @media (max-width:575px) { .navigationBar[data-v-12819946] { right:12px; top:12px; } .nav-trigger[data-v-12819946] { min-width:70px; min-height:42px; padding-left:13px; } .trigger-label[data-v-12819946] { font-size:12px; } .trigger-icon[data-v-12819946] { width:28px; height:28px; } .navigation-menu[data-v-12819946] { top:52px; width:min(86vw,280px); } } .home-page[data-v-456419be],.home-page *[data-v-456419be] { box-sizing:border-box; } .home-page[data-v-456419be] { --page-bg:#F1DDDF; --panel-bg:#FFF9F7; --accent:#E72D48; --ink:#1A1A1D; --positive:#2FA84F; --soft-red:#FFD7DD; --soft-yellow:#FFE8A3; min-height:100vh; color:var(--ink ); background:radial-gradient(circle at 18px 18px,rgba(26,26,29,0.13) 2px,transparent 2.4px),linear-gradient(135deg,rgba(255,249,247,0.68),rgba(255,249,247,0) 34%),var(--page-bg ); background-size:28px 28px,auto,auto; overflow-x:hidden; } .home-wrap[data-v-456419be] { width:min(calc(100% - 48px),1400px); margin:0 auto; } .home-topbar[data-v-456419be] { position:relative; z-index:10; display:flex; align-items:center; width:min(calc(100% - 48px),1400px); min-height:88px; margin:0 auto; } .logo-button[data-v-456419be] { display:inline-flex; align-items:center; justify-content:center; width:clamp(150px,12vw,196px); min-height:48px; padding:0; border:0; background:transparent; cursor:pointer; transition:transform 0.18s ease; } .logo-button[data-v-456419be]:hover { transform:translate(-2px,-2px); } .logo-button img[data-v-456419be] { display:block; width:100%; height:auto; max-height:51px; -o-object-fit:contain; object-fit:contain; } .brutal-panel[data-v-456419be] { background:var(--panel-bg ); border:3px solid var(--ink ); box-shadow:8px 8px 0 var(--accent ); } .accent-panel[data-v-456419be] { color:var(--panel-bg ); background:var(--accent ); box-shadow:8px 8px 0 var(--ink ); } .hero-board[data-v-456419be] { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:24px; align-items:stretch; padding:10px 0 28px; } .hero-main[data-v-456419be] { position:relative; min-height:330px; padding:clamp(28px,4vw,54px); overflow:hidden; } .hero-main[data-v-456419be]::after { content:""; position:absolute; right:clamp(18px,4vw,58px); bottom:clamp(16px,3vw,34px); width:clamp(88px,12vw,150px); height:clamp(88px,12vw,150px); border:3px solid var(--ink ); background:linear-gradient(90deg,rgba(26,26,29,0.16) 3px,transparent 3px),linear-gradient(0deg,rgba(26,26,29,0.16) 3px,transparent 3px),var(--soft-yellow ); background-size:18px 18px; transform:rotate(8deg); pointer-events:none; } .sticker[data-v-456419be] { display:inline-flex; align-items:center; min-height:34px; padding:0 14px; color:var(--ink ); background:var(--soft-yellow ); border:3px solid var(--ink ); box-shadow:4px 4px 0 var(--ink ); font-size:14px; font-weight:900; } .hero-main h1[data-v-456419be] { position:relative; z-index:1; max-width:9em; margin:26px 0 0; font-size:clamp(48px,7vw,104px); line-height:0.94; font-weight:900; letter-spacing:-0.05em; } .hero-main p[data-v-456419be] { position:relative; z-index:1; max-width:680px; margin:24px 0 0; color:var(--panel-bg ); font-size:clamp(16px,1.3vw,21px); line-height:1.75; font-weight:800; } .hero-actions[data-v-456419be] { position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; } .primary-action[data-v-456419be],.secondary-action[data-v-456419be],.section-head button[data-v-456419be] { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:0 20px; color:var(--panel-bg ); background:var(--accent ); border:3px solid var(--ink ); box-shadow:5px 5px 0 var(--ink ); font-size:15px; font-weight:900; text-decoration:none; cursor:pointer; transition:transform 0.16s ease,box-shadow 0.16s ease; } .accent-panel .primary-action[data-v-456419be] { color:var(--accent ); background:var(--panel-bg ); } .secondary-action[data-v-456419be] { color:var(--ink ); background:var(--soft-yellow ); } .primary-action[data-v-456419be]:hover,.secondary-action[data-v-456419be]:hover,.section-head button[data-v-456419be]:hover { transform:translate(2px,2px); box-shadow:3px 3px 0 var(--ink ); } .hero-side[data-v-456419be] { display:flex; flex-direction:column; justify-content:space-between; padding:24px; } .hero-image-panel[data-v-456419be] { position:relative; min-height:330px; padding:0; overflow:hidden; background:var(--panel-bg ); } .hero-panel-image[data-v-456419be] { display:block; width:100%; height:100%; min-height:330px; -o-object-fit:cover; object-fit:cover; } .hero-panel-caption[data-v-456419be] { position:absolute; left:18px; right:18px; bottom:18px; color:var(--ink ); background:var(--panel-bg ); opacity:0.6; border:3px solid var(--ink ); box-shadow:5px 5px 0 var(--accent ); } .hero-panel-caption span[data-v-456419be] { display:block; margin-bottom:5px; color:var(--accent ); font-size:13px; font-weight:900; } .hero-panel-caption strong[data-v-456419be] { display:block; font-size:24px; line-height:1.08; font-weight:900; } .side-title span[data-v-456419be],.section-head span[data-v-456419be] { display:block; margin-bottom:8px; color:var(--accent ); font-size:14px; font-weight:900; } .side-title strong[data-v-456419be] { display:block; font-size:30px; line-height:1.08; font-weight:900; } .metric-grid[data-v-456419be] { display:grid; gap:12px; margin-top:28px; } .metric-card[data-v-456419be] { display:flex; align-items:center; justify-content:space-between; min-height:78px; padding:14px 16px; border:3px solid var(--ink ); background:var(--soft-red ); } .metric-card strong[data-v-456419be] { color:var(--accent ); font-size:42px; line-height:1; font-weight:900; } .metric-card span[data-v-456419be] { max-width:5em; text-align:right; font-size:15px; line-height:1.25; font-weight:900; } .metric-card.positive strong[data-v-456419be] { color:var(--positive ); } .quick-games[data-v-456419be] { margin-top:8px; padding:0 0 26px; } .section-head[data-v-456419be] { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:16px; } .section-head h2[data-v-456419be] { margin:0; font-size:clamp(28px,3.2vw,46px); line-height:1.05; font-weight:900; letter-spacing:-0.04em; } .game-strip[data-v-456419be] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; } .game-card[data-v-456419be] { position:relative; min-height:255px; padding:18px; display:flex; flex-direction:column; justify-content:flex-end; color:var(--panel-bg ); background-position:center; background-size:cover; border:3px solid var(--ink ); box-shadow:8px 8px 0 var(--ink ); overflow:hidden; isolation:isolate; cursor:pointer; transition:transform 0.18s ease,box-shadow 0.18s ease; } .game-card[data-v-456419be]::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(26,26,29,0.08) 0%,rgba(26,26,29,0.76) 76%); } .game-card[data-v-456419be]:hover { transform:translate(-3px,-3px); box-shadow:11px 11px 0 var(--accent ); } .game-card span[data-v-456419be],.card-category[data-v-456419be],.category-pill[data-v-456419be] { display:inline-flex; align-items:center; width:-moz-fit-content; width:fit-content; min-height:28px; padding:0 10px; color:var(--ink ); background:var(--soft-yellow ); border:2px solid var(--ink ); font-size:13px; font-weight:900; } .game-card strong[data-v-456419be] { margin-top:12px; font-size:clamp(24px,2.4vw,36px); line-height:1.06; font-weight:900; } .game-card p[data-v-456419be] { max-width:32em; margin:8px 0 0; font-size:14px; line-height:1.55; font-weight:800; } .content-layout[data-v-456419be] { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:24px; align-items:start; padding:4px 0 72px; } .app-board[data-v-456419be] { padding:clamp(18px,2.5vw,30px); } .compact-head[data-v-456419be] { align-items:flex-start; margin-bottom:18px; } .compact-head p[data-v-456419be] { max-width:310px; margin:6px 0 0; font-size:15px; line-height:1.55; font-weight:800; } .category-row[data-v-456419be] { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:20px; } .category-pill[data-v-456419be] { background:var(--panel-bg ); box-shadow:3px 3px 0 var(--accent ); } .app-grid[data-v-456419be] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; } .app-card[data-v-456419be] { min-width:0; color:var(--ink ); background:var(--panel-bg ); border:3px solid var(--ink ); box-shadow:6px 6px 0 var(--accent ); cursor:pointer; overflow:hidden; transition:transform 0.16s ease,box-shadow 0.16s ease; } .app-card[data-v-456419be]:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 var(--ink ); } .card-media[data-v-456419be] { min-height:138px; background-position:center; background-size:cover; border-bottom:3px solid var(--ink ); } .card-content[data-v-456419be] { display:flex; min-height:186px; padding:14px; flex-direction:column; align-items:flex-start; } .card-category[data-v-456419be] { background:var(--soft-red ); } .card-content h3[data-v-456419be] { width:100%; margin:12px 0 8px; font-size:22px; line-height:1.18; font-weight:900; overflow-wrap:break-word; } .card-content p[data-v-456419be] { width:100%; margin:0; color:var(--ink ); font-size:14px; line-height:1.55; font-weight:700; overflow-wrap:break-word; } .card-content strong[data-v-456419be] { margin-top:auto; padding-top:16px; color:var(--accent ); font-size:14px; font-weight:900; } .side-stack[data-v-456419be] { display:grid; gap:18px; position:sticky; top:16px; } .mini-panel[data-v-456419be] { padding:18px; box-shadow:6px 6px 0 var(--accent ); } .mini-title[data-v-456419be] { margin-bottom:14px; font-size:24px; line-height:1.1; font-weight:900; } .category-list[data-v-456419be] { display:grid; gap:10px; padding:0; margin:0; list-style:none; } .category-list li[data-v-456419be] { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:42px; padding:0 10px; border:3px solid var(--ink ); background:var(--soft-red ); font-weight:900; } .category-list strong[data-v-456419be] { color:var(--accent ); font-size:22px; } .hint-panel[data-v-456419be] { background:var(--soft-yellow ); } .hint-panel p[data-v-456419be] { margin:0; font-size:15px; line-height:1.7; font-weight:800; } .empty-state[data-v-456419be] { grid-column:1/-1; display:flex; min-height:180px; align-items:center; justify-content:center; flex-direction:column; gap:8px; border:3px dashed var(--ink ); background:var(--soft-yellow ); text-align:center; } .empty-state strong[data-v-456419be] { font-size:24px; font-weight:900; } .empty-state span[data-v-456419be] { font-size:15px; font-weight:800; } @media (min-width:1680px) { .home-wrap[data-v-456419be],.home-topbar[data-v-456419be] { width:min(calc(100% - 64px),1440px); } .card-media[data-v-456419be] { min-height:150px; } } @media (max-width:1199px) { .hero-board[data-v-456419be],.content-layout[data-v-456419be] { grid-template-columns:1fr; } .hero-image-panel[data-v-456419be] { min-height:300px; } .hero-panel-image[data-v-456419be] { min-height:300px; } .side-stack[data-v-456419be] { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:991px) { .game-strip[data-v-456419be],.app-grid[data-v-456419be] { grid-template-columns:repeat(2,minmax(0,1fr)); } .hero-main h1[data-v-456419be] { max-width:8em; } } @media (max-width:767px) { .home-page[data-v-456419be] { background:radial-gradient(circle at 16px 16px,rgba(26,26,29,0.12) 1.8px,transparent 2.2px),var(--page-bg ); background-size:24px 24px,auto; } .home-wrap[data-v-456419be],.home-topbar[data-v-456419be] { width:calc(100% - 32px); } .home-topbar[data-v-456419be] { min-height:74px; } .logo-button[data-v-456419be] { width:142px; } .hero-board[data-v-456419be] { gap:16px; padding-top:4px; } .hero-main[data-v-456419be] { min-height:0; padding:22px; } .hero-main[data-v-456419be]::after { width:72px; height:72px; right:18px; bottom:18px; opacity:0.38; } .hero-main h1[data-v-456419be] { max-width:100%; margin-top:22px; font-size:clamp(42px,13vw,68px); line-height:0.98; } .hero-main p[data-v-456419be] { margin-top:18px; font-size:15px; line-height:1.65; } .hero-actions[data-v-456419be] { display:grid; grid-template-columns:1fr; margin-top:22px; } .primary-action[data-v-456419be],.secondary-action[data-v-456419be],.section-head button[data-v-456419be] { width:100%; min-height:50px; } .hero-image-panel[data-v-456419be] { min-height:240px; } .hero-panel-image[data-v-456419be] { min-height:240px; } .hero-panel-caption[data-v-456419be] { left:14px; right:14px; bottom:14px; } .hero-panel-caption strong[data-v-456419be] { font-size:20px; } .section-head[data-v-456419be],.compact-head[data-v-456419be] { display:grid; align-items:stretch; } .section-head h2[data-v-456419be] { font-size:30px; } .compact-head p[data-v-456419be] { max-width:none; } .game-strip[data-v-456419be],.app-grid[data-v-456419be],.side-stack[data-v-456419be] { grid-template-columns:1fr; } .game-card[data-v-456419be] { min-height:220px; } .app-board[data-v-456419be] { padding:16px; } .app-card[data-v-456419be] { display:grid; grid-template-columns:104px minmax(0,1fr); min-height:150px; } .card-media[data-v-456419be] { min-height:100%; border-right:3px solid var(--ink ); border-bottom:0; } .card-content[data-v-456419be] { min-height:150px; padding:12px; } .card-content h3[data-v-456419be] { margin:10px 0 6px; font-size:19px; } .card-content p[data-v-456419be] { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; font-size:13px; } .card-content strong[data-v-456419be] { padding-top:10px; } } @media (max-width:420px) { .home-wrap[data-v-456419be],.home-topbar[data-v-456419be] { width:calc(100% - 24px); } .app-card[data-v-456419be] { grid-template-columns:88px minmax(0,1fr); } .card-content h3[data-v-456419be] { font-size:18px; } .category-row[data-v-456419be] { gap:8px; } .category-pill[data-v-456419be] { font-size:12px; } } .home-page-pro[data-v-0fb58a2e] { --ink:var(--color-text ); --muted:var(--color-text-soft ); --line:var(--color-border ); --paper:rgba(255,255,255,0.88); --blue:var(--color-primary ); --pink:var(--color-card-topline ); --yellow:var(--color-secondary ); --green:var(--color-success ); --violet:var(--color-primary ); min-height:100vh; color:var(--ink ); background:linear-gradient(120deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); overflow-x:hidden; } .home-page-pro[data-v-0fb58a2e]::before { content:""; position:fixed; inset:0; z-index:0; pointer-events:none; background-image:linear-gradient(var(--color-focus-shadow ) 1px,transparent 1px),linear-gradient(90deg,var(--color-focus-shadow ) 1px,transparent 1px); background-size:56px 56px; -webkit-mask-image:linear-gradient(to bottom,rgba(0,0,0,0.82),transparent 86%); mask-image:linear-gradient(to bottom,rgba(0,0,0,0.82),transparent 86%); } button[data-v-0fb58a2e],input[data-v-0fb58a2e] { font-family:inherit; } .home-shell[data-v-0fb58a2e] { position:relative; z-index:1; width:min(1800px,calc(100% - 48px)); margin:0 auto; padding:20px 0 72px; } .browser-topbar[data-v-0fb58a2e] { display:grid; grid-template-columns:minmax(180px,248px) minmax(0,1fr) auto; gap:12px; align-items:center; margin-bottom:14px; } .brand[data-v-0fb58a2e],.topnav[data-v-0fb58a2e],.top-actions[data-v-0fb58a2e],.browser-frame[data-v-0fb58a2e],.quick-launch[data-v-0fb58a2e],.side-panel[data-v-0fb58a2e],.main-board[data-v-0fb58a2e] { border:1px solid var(--line ); border-radius:8px; background:var(--paper ); box-shadow:0 18px 46px var(--color-shadow ); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); } .brand[data-v-0fb58a2e] { display:flex; height:62px; align-items:center; justify-content:space-between; gap:14px; border-color:transparent; cursor:pointer; padding:0 16px; } .brand img[data-v-0fb58a2e] { width:min(150px,70%); max-height:32px; -o-object-fit:contain; object-fit:contain; } .brand span[data-v-0fb58a2e],.top-actions button[data-v-0fb58a2e],.browser-tab[data-v-0fb58a2e],.module-head button[data-v-0fb58a2e],.app-controls button[data-v-0fb58a2e] { color:var(--color-text ); font-size:13px; font-weight:900; } .topnav[data-v-0fb58a2e] { display:flex; min-width:0; height:62px; align-items:center; gap:8px; overflow-x:auto; padding:8px; } .topnav button[data-v-0fb58a2e] { display:inline-flex; flex:1 0 auto; min-width:88px; height:44px; align-items:center; justify-content:center; gap:8px; border:0; border-radius:999px; background:transparent; color:#526077; cursor:pointer; font-weight:900; transition:background 0.18s ease,color 0.18s ease,transform 0.18s ease; } .topnav i[data-v-0fb58a2e],.category-item i[data-v-0fb58a2e] { width:10px; height:10px; flex:0 0 auto; border-radius:999px; } .topnav button[data-v-0fb58a2e]:hover,.topnav button.active[data-v-0fb58a2e] { background:var(--color-button ); color:#ffffff; transform:translateY(-1px); } .top-actions[data-v-0fb58a2e] { display:flex; height:62px; align-items:center; gap:8px; padding:8px; } .top-actions button[data-v-0fb58a2e],.module-head button[data-v-0fb58a2e],.app-controls button[data-v-0fb58a2e] { min-height:42px; border:0; border-radius:999px; background:rgba(15,23,42,0.07); cursor:pointer; padding:0 14px; transition:transform 0.18s ease,background 0.18s ease,color 0.18s ease; } .top-actions button[data-v-0fb58a2e]:hover,.module-head button[data-v-0fb58a2e]:hover,.app-controls button[data-v-0fb58a2e]:hover,.app-controls button.active[data-v-0fb58a2e] { transform:translateY(-2px); background:var(--color-button ); color:#ffffff; } .top-actions .admin-button[data-v-0fb58a2e] { background:linear-gradient(135deg,var(--yellow ),var(--pink )); } .browser-frame[data-v-0fb58a2e] { overflow:visible; background:linear-gradient(180deg,rgba(255,255,255,0.92),rgba(248,250,252,0.86)),var(--gradient-soft ); } .browser-tabs[data-v-0fb58a2e] { display:flex; align-items:center; gap:8px; border-bottom:1px solid rgba(15,23,42,0.08); padding:10px; } .window-controls[data-v-0fb58a2e] { display:flex; gap:7px; padding:0 8px; } .window-controls span[data-v-0fb58a2e] { width:11px; height:11px; border-radius:999px; } .window-controls span[data-v-0fb58a2e]:nth-child(1) { background:var(--color-card-topline ); } .window-controls span[data-v-0fb58a2e]:nth-child(2) { background:var(--color-secondary ); } .window-controls span[data-v-0fb58a2e]:nth-child(3) { background:var(--color-success ); } .browser-tab[data-v-0fb58a2e] { display:inline-flex; min-height:36px; align-items:center; gap:8px; border:1px solid rgba(15,23,42,0.08); border-radius:8px; background:rgba(255,255,255,0.68); cursor:pointer; padding:0 12px; } .browser-tab.active[data-v-0fb58a2e] { background:#ffffff; box-shadow:0 10px 24px rgba(15,23,42,0.08); } .browser-tab strong[data-v-0fb58a2e] { border-radius:999px; background:var(--color-button ); color:#ffffff; font-size:11px; padding:3px 7px; } .search-module[data-v-0fb58a2e] { position:relative; z-index:10; display:grid; grid-template-columns:minmax(112px,auto) minmax(0,1fr) auto auto; gap:8px; margin:clamp(16px,2vw,26px); border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:#ffffff; box-shadow:0 20px 52px rgba(42,93,152,0.14); padding:9px; } .engine-button[data-v-0fb58a2e],.search-button[data-v-0fb58a2e],.clear-button[data-v-0fb58a2e] { display:inline-flex; min-height:54px; align-items:center; justify-content:center; border:0; border-radius:8px; cursor:pointer; font-weight:900; } .engine-button[data-v-0fb58a2e] { gap:8px; background:#f4f8ff; color:#172033; padding:0 14px; } .engine-button img[data-v-0fb58a2e],.search-engine-option img[data-v-0fb58a2e] { width:22px; height:22px; -o-object-fit:contain; object-fit:contain; } .search-input[data-v-0fb58a2e] { min-width:0; min-height:54px; border:0; outline:0; background:#ffffff; color:var(--color-text ); font-size:clamp(16px,1.2vw,20px); font-weight:850; padding:0 10px; } .search-input[data-v-0fb58a2e]::-moz-placeholder { color:#8a96aa; } .search-input[data-v-0fb58a2e]::placeholder { color:#8a96aa; } .clear-button[data-v-0fb58a2e] { width:54px; background:rgba(15,23,42,0.06); color:#526077; font-size:24px; } .search-button[data-v-0fb58a2e] { min-width:112px; background:var(--gradient-primary ); color:#ffffff; padding:0 20px; } .search-engine-panel[data-v-0fb58a2e],.suggestion-panel[data-v-0fb58a2e] { position:absolute; top:calc(100% + 10px); z-index:30; border:1px solid var(--line ); border-radius:8px; background:rgba(255,255,255,0.98); box-shadow:0 24px 58px rgba(48,72,114,0.18); padding:8px; } .search-engine-panel[data-v-0fb58a2e] { left:9px; width:min(280px,calc(100vw - 52px)); } .suggestion-panel[data-v-0fb58a2e] { left:min(148px,20vw); width:min(640px,calc(100vw - 70px)); } .suggestion-group[data-v-0fb58a2e] { display:grid; gap:6px; } .suggestion-group + .suggestion-group[data-v-0fb58a2e] { margin-top:8px; border-top:1px solid rgba(15,23,42,0.08); padding-top:8px; } .suggestion-group > span[data-v-0fb58a2e] { color:#0f9f9a; font-size:12px; font-weight:900; padding:2px 6px; } .search-engine-option[data-v-0fb58a2e],.suggestion-item[data-v-0fb58a2e] { display:flex; width:100%; align-items:center; gap:10px; border:0; border-radius:8px; background:transparent; color:#29354e; cursor:pointer; font-weight:850; padding:11px; text-align:left; } .suggestion-item.local[data-v-0fb58a2e] { display:grid; gap:4px; } .suggestion-item strong[data-v-0fb58a2e] { color:var(--color-text ); font-size:14px; font-weight:950; } .suggestion-item small[data-v-0fb58a2e] { overflow:hidden; color:#64748b; text-overflow:ellipsis; white-space:nowrap; } .search-engine-option[data-v-0fb58a2e]:hover,.suggestion-item[data-v-0fb58a2e]:hover { background:var(--gradient-soft ); } .hero-dashboard[data-v-0fb58a2e] { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,420px); gap:16px; padding:0 clamp(16px,2vw,26px) clamp(18px,2vw,28px); } .hero-copy[data-v-0fb58a2e] { align-self:flex-end; min-width:0; padding:clamp(16px,2.6vw,30px) 0 4px; } .eyebrow[data-v-0fb58a2e],.section-title span[data-v-0fb58a2e],.module-head span[data-v-0fb58a2e],.panel-head span[data-v-0fb58a2e],.spotlight-copy span[data-v-0fb58a2e] { display:inline-flex; color:#0f9f9a; font-size:12px; font-weight:950; letter-spacing:0; text-transform:uppercase; } .hero-copy h1[data-v-0fb58a2e] { max-width:820px; margin:12px 0 0; color:var(--color-text ); font-size:clamp(42px,5.4vw,96px); font-weight:950; letter-spacing:0; line-height:0.98; } .hero-copy p[data-v-0fb58a2e] { max-width:820px; margin:18px 0 0; color:#526077; font-size:clamp(15px,1.2vw,19px); font-weight:700; line-height:1.78; } .hero-stats[data-v-0fb58a2e] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; max-width:780px; margin-top:24px; } .hero-stats article[data-v-0fb58a2e] { display:grid; gap:6px; border:1px solid rgba(15,23,42,0.08); border-radius:8px; background:rgba(255,255,255,0.72); padding:14px; } .hero-stats strong[data-v-0fb58a2e] { overflow:hidden; font-size:clamp(22px,2.4vw,36px); font-weight:950; line-height:1; text-overflow:ellipsis; white-space:nowrap; } .hero-stats span[data-v-0fb58a2e] { color:#64748b; font-size:13px; font-weight:850; } .spotlight-panel[data-v-0fb58a2e] { display:grid; min-height:360px; grid-template-rows:minmax(0,1fr) auto; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:#ffffff; cursor:pointer; overflow:hidden; transition:transform 0.2s ease,box-shadow 0.2s ease; } .spotlight-panel[data-v-0fb58a2e]:hover { transform:translateY(-4px); box-shadow:0 24px 54px rgba(53,75,114,0.16); } .spotlight-media[data-v-0fb58a2e] { min-height:210px; background-position:center; background-size:cover; } .spotlight-copy[data-v-0fb58a2e] { padding:18px; } .spotlight-copy strong[data-v-0fb58a2e] { display:block; margin-top:8px; color:var(--color-text ); font-size:28px; font-weight:950; } .spotlight-copy p[data-v-0fb58a2e] { display:-webkit-box; margin:8px 0 0; overflow:hidden; color:#64748b; line-height:1.62; -webkit-box-orient:vertical; -webkit-line-clamp:2; } .quick-launch[data-v-0fb58a2e] { display:grid; grid-template-columns:minmax(150px,220px) minmax(0,1fr); gap:14px; align-items:center; margin:16px 0; padding:14px; } .section-title h2[data-v-0fb58a2e],.module-head h2[data-v-0fb58a2e] { margin:5px 0 0; color:var(--color-text ); font-size:clamp(24px,2.6vw,38px); font-weight:950; letter-spacing:0; } .quick-grid[data-v-0fb58a2e] { display:grid; grid-template-columns:repeat(auto-fill,minmax(142px,1fr)); gap:10px; } .quick-item[data-v-0fb58a2e] { display:grid; min-width:0; grid-template-columns:34px minmax(0,1fr); gap:4px 10px; align-items:center; border:1px solid rgba(15,23,42,0.08); border-radius:8px; background:#ffffff; cursor:pointer; padding:10px; text-align:left; transition:transform 0.18s ease,box-shadow 0.18s ease; } .quick-item[data-v-0fb58a2e]:hover { transform:translateY(-3px); box-shadow:0 16px 30px rgba(53,75,114,0.12); } .quick-item span[data-v-0fb58a2e] { display:inline-flex; width:34px; height:34px; grid-row:span 2; align-items:center; justify-content:center; border-radius:8px; color:#ffffff; font-size:15px; font-weight:950; } .quick-item strong[data-v-0fb58a2e],.recent-item strong[data-v-0fb58a2e] { overflow:hidden; color:var(--color-text ); font-size:14px; font-weight:950; text-overflow:ellipsis; white-space:nowrap; } .quick-item small[data-v-0fb58a2e],.recent-item small[data-v-0fb58a2e] { overflow:hidden; color:#64748b; font-size:12px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; } .workspace-layout[data-v-0fb58a2e] { display:grid; grid-template-columns:minmax(260px,330px) minmax(0,1fr); gap:16px; align-items:start; } .side-panel[data-v-0fb58a2e] { position:sticky; top:16px; display:grid; gap:14px; padding:14px; } .clock-card[data-v-0fb58a2e] { display:grid; min-height:168px; align-content:space-between; border:0; border-radius:8px; background:linear-gradient(135deg,var(--color-surface-strong ),var(--color-text ) 58%,var(--color-primary )); color:#ffffff; cursor:pointer; padding:22px; text-align:left; } .clock-card span[data-v-0fb58a2e] { color:rgba(255,255,255,0.72); font-size:13px; font-weight:850; } .clock-card strong[data-v-0fb58a2e] { font-size:clamp(42px,4vw,60px); font-weight:950; line-height:1.05; } .category-panel[data-v-0fb58a2e],.recent-panel[data-v-0fb58a2e] { display:grid; gap:8px; } .panel-head[data-v-0fb58a2e] { border-radius:8px; background:rgba(15,23,42,0.06); padding:14px; } .panel-head strong[data-v-0fb58a2e] { display:block; margin-top:5px; font-size:18px; font-weight:950; } .category-item[data-v-0fb58a2e] { display:grid; grid-template-columns:12px minmax(0,1fr) auto; gap:10px; align-items:center; border:1px solid transparent; border-radius:8px; background:rgba(255,255,255,0.62); color:#172033; cursor:pointer; padding:12px; text-align:left; transition:transform 0.18s ease,border-color 0.18s ease,background 0.18s ease; } .category-item[data-v-0fb58a2e]:hover,.category-item.active[data-v-0fb58a2e] { border-color:var(--color-primary ); background:#ffffff; transform:translateX(3px); } .category-item strong[data-v-0fb58a2e] { display:block; color:#172033; font-size:14px; font-weight:950; } .category-item small[data-v-0fb58a2e] { display:block; margin-top:3px; color:#6d7a91; font-size:12px; font-weight:800; } .category-item em[data-v-0fb58a2e] { color:var(--color-text ); font-style:normal; font-weight:950; } .recent-item[data-v-0fb58a2e] { display:grid; gap:5px; border:1px solid rgba(15,23,42,0.08); border-radius:8px; background:#ffffff; cursor:pointer; padding:11px; text-align:left; } .panel-empty[data-v-0fb58a2e] { border:1px dashed rgba(15,23,42,0.14); border-radius:8px; color:#64748b; font-size:13px; font-weight:800; line-height:1.6; padding:14px; } .main-board[data-v-0fb58a2e] { display:grid; gap:16px; padding:14px; } .game-module[data-v-0fb58a2e],.app-section[data-v-0fb58a2e] { display:grid; gap:14px; } .module-head[data-v-0fb58a2e] { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; } .app-controls[data-v-0fb58a2e] { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; } .game-grid[data-v-0fb58a2e] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } .game-card[data-v-0fb58a2e] { position:relative; display:grid; min-height:220px; align-content:flex-end; border-radius:8px; background-position:center; background-size:cover; color:#ffffff; cursor:pointer; overflow:hidden; padding:18px; isolation:isolate; transition:transform 0.2s ease,box-shadow 0.2s ease; } .game-card[data-v-0fb58a2e]::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(15,23,42,0.08),rgba(15,23,42,0.78)); } .game-card[data-v-0fb58a2e]:hover { transform:translateY(-4px); box-shadow:0 22px 46px rgba(53,75,114,0.18); } .game-card span[data-v-0fb58a2e] { width:-moz-fit-content; width:fit-content; border-radius:999px; background:rgba(255,255,255,0.18); font-size:12px; font-weight:900; padding:6px 9px; } .game-card strong[data-v-0fb58a2e] { margin-top:10px; font-size:26px; font-weight:950; } .game-card p[data-v-0fb58a2e] { max-width:320px; margin:8px 0 0; color:rgba(255,255,255,0.82); line-height:1.55; } .app-grid[data-v-0fb58a2e] { display:grid; grid-template-columns:repeat(auto-fill,minmax(232px,1fr)); gap:12px; } .app-grid.mode-list[data-v-0fb58a2e] { grid-template-columns:1fr; } .app-card[data-v-0fb58a2e] { display:grid; min-height:316px; grid-template-rows:142px minmax(0,1fr) auto; border:1px solid var(--color-border ); border-radius:8px; background:#ffffff; cursor:pointer; overflow:hidden; text-align:left; transition:transform 0.2s ease,box-shadow 0.2s ease,border-color 0.2s ease; } .app-card[data-v-0fb58a2e]:hover { border-color:var(--color-primary ); box-shadow:0 24px 52px rgba(45,74,122,0.16); transform:translateY(-5px); } .mode-list .app-card[data-v-0fb58a2e] { min-height:132px; grid-template-columns:168px minmax(0,1fr) 150px; grid-template-rows:1fr; } .card-media[data-v-0fb58a2e] { position:relative; background-position:center; background-size:cover; } .card-media[data-v-0fb58a2e]::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 26%,rgba(17,24,39,0.32)); } .card-media span[data-v-0fb58a2e] { position:absolute; left:12px; bottom:12px; z-index:1; border-radius:999px; background:rgba(255,255,255,0.88); color:var(--color-text ); font-size:12px; font-weight:950; padding:7px 10px; } .card-body[data-v-0fb58a2e] { min-width:0; padding:15px 15px 8px; } .card-body h3[data-v-0fb58a2e] { margin:0 0 8px; color:var(--color-text ); font-size:21px; font-weight:950; line-height:1.16; } .card-body p[data-v-0fb58a2e] { display:-webkit-box; margin:0; overflow:hidden; color:#65738b; font-size:14px; font-weight:750; line-height:1.62; -webkit-box-orient:vertical; -webkit-line-clamp:2; } .card-footer[data-v-0fb58a2e] { display:flex; min-width:0; align-items:center; justify-content:space-between; gap:10px; border-top:1px solid var(--color-border ); padding:12px 15px; } .mode-list .card-footer[data-v-0fb58a2e] { align-self:stretch; flex-direction:column; align-items:flex-end; justify-content:center; border-top:0; border-left:1px solid var(--color-border ); } .card-footer small[data-v-0fb58a2e] { overflow:hidden; color:#7a869a; font-size:12px; font-weight:850; text-overflow:ellipsis; white-space:nowrap; } .card-footer strong[data-v-0fb58a2e] { border-radius:999px; background:var(--color-button ); color:#ffffff; font-size:12px; font-weight:950; padding:7px 10px; } .tone-1 .card-footer strong[data-v-0fb58a2e] { background:#0284c7; } .tone-2 .card-footer strong[data-v-0fb58a2e] { background:#ca8a04; } .tone-3 .card-footer strong[data-v-0fb58a2e] { background:#db2777; } .tone-4 .card-footer strong[data-v-0fb58a2e] { background:#059669; } .tone-5 .card-footer strong[data-v-0fb58a2e] { background:#6d28d9; } .tone-6 .card-footer strong[data-v-0fb58a2e] { background:#ea580c; } .empty-state[data-v-0fb58a2e] { display:grid; min-height:260px; place-items:center; align-content:center; gap:8px; border:1px dashed var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.7); color:#66748c; } .empty-state strong[data-v-0fb58a2e] { color:var(--color-text ); font-size:22px; font-weight:950; } .panel-pop-enter-active[data-v-0fb58a2e],.panel-pop-leave-active[data-v-0fb58a2e],.app-card-enter-active[data-v-0fb58a2e],.app-card-leave-active[data-v-0fb58a2e] { transition:opacity 0.18s ease,transform 0.18s ease; } .panel-pop-enter[data-v-0fb58a2e],.panel-pop-leave-to[data-v-0fb58a2e],.app-card-enter[data-v-0fb58a2e],.app-card-leave-to[data-v-0fb58a2e] { opacity:0; transform:translateY(-8px); } @media (min-width:1440px) { .home-shell[data-v-0fb58a2e] { width:min(1900px,calc(100% - 96px)); } .app-grid[data-v-0fb58a2e] { grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); } } @media (max-width:1199px) { .browser-topbar[data-v-0fb58a2e],.hero-dashboard[data-v-0fb58a2e],.workspace-layout[data-v-0fb58a2e] { grid-template-columns:1fr; } .side-panel[data-v-0fb58a2e] { position:static; grid-template-columns:repeat(2,minmax(0,1fr)); } .clock-card[data-v-0fb58a2e] { grid-row:span 2; } } @media (max-width:991px) { .home-shell[data-v-0fb58a2e] { width:min(100% - 28px,820px); padding-top:14px; } .top-actions[data-v-0fb58a2e] { justify-content:stretch; } .top-actions button[data-v-0fb58a2e] { flex:1; } .search-module[data-v-0fb58a2e] { grid-template-columns:1fr; } .engine-button[data-v-0fb58a2e],.search-button[data-v-0fb58a2e],.clear-button[data-v-0fb58a2e],.search-input[data-v-0fb58a2e] { min-height:50px; } .clear-button[data-v-0fb58a2e] { width:100%; } .suggestion-panel[data-v-0fb58a2e],.search-engine-panel[data-v-0fb58a2e] { left:9px; right:9px; width:auto; } .hero-stats[data-v-0fb58a2e],.quick-launch[data-v-0fb58a2e],.game-grid[data-v-0fb58a2e],.side-panel[data-v-0fb58a2e] { grid-template-columns:1fr; } .quick-launch[data-v-0fb58a2e] { align-items:stretch; } .mode-list .app-card[data-v-0fb58a2e] { min-height:158px; grid-template-columns:132px minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; } .mode-list .card-footer[data-v-0fb58a2e] { grid-column:1/-1; flex-direction:row; align-items:center; border-left:0; border-top:1px solid var(--color-border ); } } @media (max-width:575px) { .home-shell[data-v-0fb58a2e] { width:min(100% - 18px,480px); padding-bottom:42px; } .brand[data-v-0fb58a2e] { justify-content:center; } .brand span[data-v-0fb58a2e],.top-actions button[data-v-0fb58a2e]:first-child,.browser-tab[data-v-0fb58a2e]:nth-child(n + 4) { display:none; } .topnav[data-v-0fb58a2e] { min-height:58px; height:auto; } .browser-tabs[data-v-0fb58a2e] { overflow-x:auto; } .hero-copy h1[data-v-0fb58a2e] { font-size:clamp(36px,12vw,58px); } .spotlight-panel[data-v-0fb58a2e] { min-height:280px; } .quick-grid[data-v-0fb58a2e],.app-grid[data-v-0fb58a2e],.app-grid.mode-list[data-v-0fb58a2e] { grid-template-columns:1fr; } .mode-list .app-card[data-v-0fb58a2e] { grid-template-columns:1fr; grid-template-rows:140px minmax(0,1fr) auto; } .module-head[data-v-0fb58a2e] { align-items:flex-start; flex-direction:column; } .app-controls[data-v-0fb58a2e] { width:100%; justify-content:stretch; } .app-controls button[data-v-0fb58a2e] { flex:1 1 42%; } } .answer-oracle-page[data-v-e3d26e0a]{--page-bg:#F1DDDF;--panel:#FFF9F7;--ink:#1A1A1D;--red:#E72D48;--green:#2FA84F;min-height:100vh;background:var(--page-bg );color:var(--ink );padding:28px 18px 60px;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;overflow-x:hidden}.oracle-shell[data-v-e3d26e0a]{width:min(1180px,100%);margin:0 auto;min-height:calc(100vh - 90px);display:grid;place-items:center}.panel-card[data-v-e3d26e0a]{background:var(--panel );border:3px solid var(--ink );box-shadow:8px 8px 0 var(--red );box-sizing:border-box}.cover-stage[data-v-e3d26e0a],.single-page-stage[data-v-e3d26e0a]{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:34px;align-items:center;padding:42px;position:relative;overflow:hidden}.cover-stage[data-v-e3d26e0a]::after,.single-page-stage[data-v-e3d26e0a]::after{content:"";position:absolute;right:26px;top:24px;width:130px;height:130px;background-image:radial-gradient(var(--red ) 3px,transparent 3px);background-size:16px 16px;opacity:.12}.sticker[data-v-e3d26e0a]{display:inline-flex;padding:8px 14px;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:4px 4px 0 var(--ink );font-weight:1000;transform:rotate(-2deg)}h1[data-v-e3d26e0a],h2[data-v-e3d26e0a],p[data-v-e3d26e0a]{margin:0}.ritual-copy h1[data-v-e3d26e0a]{margin-top:20px;font-size:clamp(42px,7vw,86px);line-height:.98;letter-spacing:-4px;font-weight:1000}.ritual-copy p[data-v-e3d26e0a]{margin-top:20px;max-width:580px;font-size:18px;line-height:1.8;font-weight:800}.sealed-book[data-v-e3d26e0a]{position:relative;z-index:1;border:0;background:transparent;padding:0;cursor:pointer;min-height:460px}.book-shadow[data-v-e3d26e0a]{position:absolute;left:34px;right:18px;bottom:20px;height:42px;background:var(--ink );opacity:.18;transform:skewX(-18deg)}.paper-edge[data-v-e3d26e0a]{position:absolute;left:22px;right:0;top:24px;bottom:10px;background:#fff;border:3px solid var(--ink );box-shadow:6px 6px 0 var(--ink );transform:rotate(2deg)}.cover-board[data-v-e3d26e0a]{position:absolute;inset:0;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:10px 10px 0 var(--ink );display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transform:rotate(-2deg);transition:.2s}.sealed-book:hover .cover-board[data-v-e3d26e0a]{transform:rotate(0deg) translateY(-6px)}.cover-sigil svg[data-v-e3d26e0a]{width:132px;height:132px;fill:none;stroke:currentColor;stroke-width:5}.cover-board strong[data-v-e3d26e0a]{font-size:44px;font-weight:1000}.cover-board small[data-v-e3d26e0a]{font-size:16px;font-weight:1000}.single-page-stage[data-v-e3d26e0a]{grid-template-columns:1fr;justify-items:center}.oracle-page[data-v-e3d26e0a]{width:min(760px,100%);position:relative}.page-face[data-v-e3d26e0a]{min-height:430px;background:#fff;border:3px solid var(--ink );box-shadow:8px 8px 0 var(--ink );display:grid;place-items:center;padding:36px;box-sizing:border-box;position:relative;overflow:hidden}.page-face[data-v-e3d26e0a]::before{content:"";position:absolute;inset:20px;border:3px dashed rgba(26,26,29,.2)}.answer-content[data-v-e3d26e0a]{position:relative;z-index:1;text-align:center;opacity:.3;transform:translateY(10px);transition:.35s}.answer-content.show[data-v-e3d26e0a],.revealed .answer-content[data-v-e3d26e0a]{opacity:1;transform:translateY(0)}.page-label[data-v-e3d26e0a]{display:inline-flex;margin-bottom:18px;background:var(--red );color:var(--panel );border:3px solid var(--ink );padding:7px 12px;box-shadow:4px 4px 0 var(--ink );font-weight:1000}.answer-content h2[data-v-e3d26e0a]{font-size:clamp(34px,6vw,72px);line-height:1.1;font-weight:1000;letter-spacing:-2px}.answer-content p[data-v-e3d26e0a]{margin-top:18px;font-size:18px;line-height:1.6;font-weight:900}.turning-text[data-v-e3d26e0a]{font-size:20px;font-weight:1000;color:var(--red )}.reading-actions[data-v-e3d26e0a]{display:flex;gap:14px;flex-wrap:wrap;justify-content:center}button[data-v-e3d26e0a]{border:3px solid var(--ink );background:var(--red );color:var(--panel );box-shadow:5px 5px 0 var(--ink );min-height:54px;padding:0 22px;font-weight:1000;font-size:15px;cursor:pointer}.quiet-button[data-v-e3d26e0a]{background:var(--panel );color:var(--ink )}button[data-v-e3d26e0a]:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink )}.page-turn-loader[data-v-e3d26e0a]{position:relative;width:260px;height:230px}.flip-sheet[data-v-e3d26e0a]{position:absolute;left:30px;top:20px;width:190px;height:150px;background:var(--panel );border:3px solid var(--ink );box-shadow:5px 5px 0 var(--red );transform-origin:left center;animation:flip-e3d26e0a 1s ease-in-out infinite}.sheet-2[data-v-e3d26e0a]{animation-delay:.18s}.sheet-3[data-v-e3d26e0a]{animation-delay:.36s}@keyframes flip-e3d26e0a{0%{transform:rotateY(0) rotate(-2deg)}50%{transform:rotateY(-70deg) rotate(2deg)}100%{transform:rotateY(0) rotate(-2deg)}}.stage-fade-enter-active[data-v-e3d26e0a],.stage-fade-leave-active[data-v-e3d26e0a]{transition:.25s}.stage-fade-enter[data-v-e3d26e0a],.stage-fade-leave-to[data-v-e3d26e0a]{opacity:0;transform:translateY(10px)}@media(max-width:860px){.cover-stage[data-v-e3d26e0a]{grid-template-columns:1fr}.sealed-book[data-v-e3d26e0a]{min-height:360px;max-width:360px;width:100%;justify-self:center}.cover-board strong[data-v-e3d26e0a]{font-size:34px}.single-page-stage[data-v-e3d26e0a]{padding:24px}}@media(max-width:560px){.answer-oracle-page[data-v-e3d26e0a]{padding:16px 16px 70px}.cover-stage[data-v-e3d26e0a],.single-page-stage[data-v-e3d26e0a]{padding:20px}.ritual-copy h1[data-v-e3d26e0a]{letter-spacing:-2px}.page-face[data-v-e3d26e0a]{min-height:360px;padding:22px}.reading-actions[data-v-e3d26e0a]{display:grid;width:100%}.reading-actions button[data-v-e3d26e0a]{width:100%}} .many-why-container[data-v-6c573864] { min-height:100vh; width:100%; padding:28px 20px 56px; box-sizing:border-box; background:#F1DDDF; color:#1A1A1D; overflow-x:hidden; background-image:radial-gradient(#1A1A1D 1.2px,transparent 1.2px),linear-gradient(90deg,rgba(231,45,72,.08) 50%,transparent 50%); background-size:24px 24px,44px 44px; } .why-hero[data-v-6c573864],.why-strip[data-v-6c573864],.content-container[data-v-6c573864],.why-footer[data-v-6c573864] { width:min(1120px,100%); margin-left:auto; margin-right:auto; } .why-hero[data-v-6c573864] { display:grid; grid-template-columns:minmax(0,1fr) 240px; gap:22px; align-items:stretch; margin-bottom:22px; } .hero-copy[data-v-6c573864],.why-poster[data-v-6c573864],.why-strip[data-v-6c573864],.why-item[data-v-6c573864],.why-footer[data-v-6c573864] { background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; } .hero-copy[data-v-6c573864] { padding:28px; } .eyebrow[data-v-6c573864] { display:inline-flex; padding:6px 10px; margin-bottom:12px; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:4px 4px 0 #1A1A1D; font-size:12px; font-weight:1000; letter-spacing:.08em; text-transform:uppercase; } .hero-copy h1[data-v-6c573864] { margin:0 0 10px; font-size:clamp(38px,6vw,78px); line-height:.95; font-weight:1000; letter-spacing:-2px; } .hero-copy p[data-v-6c573864] { margin:0; color:rgba(26,26,29,.75); font-size:16px; line-height:1.75; font-weight:700; } .why-poster[data-v-6c573864] { display:flex; align-items:center; justify-content:center; min-height:180px; padding:18px; font-size:68px; font-weight:1000; color:#E72D48; } .why-stats[data-v-6c573864],.why-strip[data-v-6c573864] { display:flex; gap:12px; flex-wrap:wrap; align-items:center; justify-content:space-between; } .why-strip[data-v-6c573864] { padding:14px 16px; margin-bottom:18px; } .why-stats > *[data-v-6c573864],.why-strip > *[data-v-6c573864] { background:#F1DDDF; color:#1A1A1D; border:3px solid #1A1A1D; padding:8px 12px; font-weight:900; } .content-container[data-v-6c573864] { display:flex; flex-direction:column; gap:12px; } .why-item[data-v-6c573864] { padding:16px 18px; color:#1A1A1D; font-size:17px; line-height:1.7; font-weight:800; transition:transform .16s ease,box-shadow .16s ease; } .why-item[data-v-6c573864]:hover { transform:translate(-3px,-3px); box-shadow:10px 10px 0 #1A1A1D; } .why-item[data-v-6c573864]::first-letter { color:#E72D48; font-size:1.25em; font-weight:1000; } .why-footer[data-v-6c573864] { margin-top:18px; padding:16px; display:flex; gap:12px; align-items:center; justify-content:center; flex-wrap:wrap; } .why-footer button[data-v-6c573864],.why-strip button[data-v-6c573864] { background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; padding:10px 16px; font-weight:1000; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease; } .why-footer button[data-v-6c573864]:hover,.why-strip button[data-v-6c573864]:hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } .why-footer button[data-v-6c573864]:active,.why-strip button[data-v-6c573864]:active { transform:translate(3px,3px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { .many-why-container[data-v-6c573864] { padding:16px 16px 40px; } .why-hero[data-v-6c573864] { grid-template-columns:1fr; } .why-poster[data-v-6c573864] { min-height:110px; font-size:48px; } .hero-copy[data-v-6c573864] { padding:22px; } .why-strip[data-v-6c573864] { align-items:stretch; } .why-strip > *[data-v-6c573864] { width:100%; box-sizing:border-box; } } *[data-v-6c573864],*[data-v-6c573864]::before,*[data-v-6c573864]::after { box-sizing:border-box; } button[data-v-6c573864],input[data-v-6c573864],textarea[data-v-6c573864],select[data-v-6c573864] { max-width:100%; font:inherit; } button[data-v-6c573864] { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; } img[data-v-6c573864],svg[data-v-6c573864],canvas[data-v-6c573864] { max-width:100%; height:auto; } @media (hover:hover) and (pointer:fine) { button[data-v-6c573864]:not(:disabled):hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } } button[data-v-6c573864]:not(:disabled):active { transform:translate(2px,2px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { h1[data-v-6c573864],h2[data-v-6c573864],h3[data-v-6c573864],p[data-v-6c573864],strong[data-v-6c573864],span[data-v-6c573864],small[data-v-6c573864],label[data-v-6c573864],button[data-v-6c573864],input[data-v-6c573864],textarea[data-v-6c573864] { overflow-wrap:break-word; } button[data-v-6c573864],input[data-v-6c573864],textarea[data-v-6c573864],select[data-v-6c573864] { min-height:44px; } } .many-why-container[data-v-6c573864],.content-container[data-v-6c573864],.why-hero[data-v-6c573864],.why-strip[data-v-6c573864],.why-item[data-v-6c573864] { min-width:0; max-width:100%; } @media (max-width:860px) { .why-hero[data-v-6c573864] { grid-template-columns:minmax(0,1fr) !important; } } @media (max-width:760px) { .many-why-container[data-v-6c573864] { padding:16px 16px 40px !important; } .hero-copy[data-v-6c573864],.why-poster[data-v-6c573864],.why-strip[data-v-6c573864],.why-item[data-v-6c573864],.why-footer[data-v-6c573864] { padding:16px !important; box-shadow:5px 5px 0 #E72D48 !important; } .hero-copy h1[data-v-6c573864] { font-size:clamp(32px,12vw,50px) !important; } .why-stats[data-v-6c573864] { grid-template-columns:1fr 1fr !important; } } .constellation-container[data-v-b1b44cf2] { max-width:1200px; margin:30px auto; padding:2rem; min-height:100vh; color:#263238; } .constellation_month[data-v-b1b44cf2] { display:flex; justify-content:flex-end; align-items:center; margin-bottom:2rem; } .date-info[data-v-b1b44cf2] { display:flex; flex-direction:column; align-items:flex-end; margin-right:1rem; } .zodiac-icon[data-v-b1b44cf2] { width:60px; height:60px; border-radius:50%; -o-object-fit:cover; object-fit:cover; } .constellation-selection[data-v-b1b44cf2] { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:1.5rem; margin-bottom:3rem; } .constellation-item[data-v-b1b44cf2] { background:#ffffff; border-radius:20px; box-shadow:0 4px 20px rgba(0,0,0,0.1); transition: 0.3s ease; cursor:pointer; overflow:hidden; } .item-content[data-v-b1b44cf2] { padding:1.5rem; display:flex; align-items:center; gap:1rem; } .constellation-item img[data-v-b1b44cf2] { width:70px; height:70px; border-radius:50%; -o-object-fit:cover; object-fit:cover; transition:transform 0.3s ease; } .item-text[data-v-b1b44cf2] { flex:1; } .zodiac-name[data-v-b1b44cf2] { font-size:1.4rem; font-weight:700; color:#00796b; margin:0; } .zodiac-range[data-v-b1b44cf2] { font-size:1rem; color:#004d40; margin:0.5rem 0 0; } .constellation-item[data-v-b1b44cf2]:hover { transform:translateY(-5px); box-shadow:0 8px 30px rgba(0,0,0,0.15); } .constellation-item.active[data-v-b1b44cf2] { background:linear-gradient(135deg,#00796b,#004d40); } .constellation-item.active .zodiac-name[data-v-b1b44cf2],.constellation-item.active .zodiac-range[data-v-b1b44cf2] { color:white; } .constellation-compact[data-v-b1b44cf2] { display:flex; flex-wrap:wrap; gap:1rem; justify-content:center; margin-bottom:2rem; } .compact-item[data-v-b1b44cf2] { width:60px; height:60px; border-radius:50%; overflow:hidden; box-shadow:0 2px 10px rgba(0,0,0,0.1); transition: 0.3s ease; cursor:pointer; } .compact-item img[data-v-b1b44cf2] { width:100%; height:100%; -o-object-fit:cover; object-fit:cover; } .compact-item[data-v-b1b44cf2]:hover { transform:scale(1.1); } .compact-item.active[data-v-b1b44cf2] { box-shadow:0 0 0 3px #00796b; } .fortune-display[data-v-b1b44cf2] { border-radius:20px; box-shadow:0 4px 30px rgba(0,0,0,0.1); overflow:hidden; } .fortune-header[data-v-b1b44cf2] { padding:2rem; color:white; } .header-content[data-v-b1b44cf2] { display:flex; align-items:center; gap:1.5rem; } .header-content img[data-v-b1b44cf2] { width:80px; height:80px; border-radius:50%; border:4px solid rgba(255,255,255,0.2); } .header-content h2[data-v-b1b44cf2] { font-size:2rem; margin:0; font-weight:600; } .fortune-details[data-v-b1b44cf2] { padding:2rem; } .section-title[data-v-b1b44cf2] { font-size:1.5rem; margin:2rem 0 1rem; font-weight:600; } .basic-features[data-v-b1b44cf2] { color:#455a64; line-height:1.6; margin-bottom:2rem; } .detail-grid[data-v-b1b44cf2] { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.5rem; margin-bottom:2rem; } .detail-item[data-v-b1b44cf2] { background:#e0f7fa; padding:1rem; border-radius:12px; } .value[data-v-b1b44cf2] { color:#00796b; font-weight:500; } .value1[data-v-b1b44cf2] { color:#004d40; font-weight:600; } .fortune-predictions[data-v-b1b44cf2] { padding:2rem; } .daily-predictions[data-v-b1b44cf2] { display:grid; grid-template-columns:repeat(2,1fr); gap:2rem; margin-bottom:2rem; } .prediction-card[data-v-b1b44cf2] { border-radius:16px; padding:1.5rem; margin-bottom:2rem; } .prediction-card h3[data-v-b1b44cf2] { font-size:1.2rem; margin:0 0 1.5rem; display:flex; justify-content:space-between; align-items:center; } .date[data-v-b1b44cf2] { font-size:0.9rem; font-weight:normal; } .fortune-indicators[data-v-b1b44cf2] { display:grid; gap:1rem; margin-bottom:1.5rem; } .fortune-indicators.single-column[data-v-b1b44cf2] { grid-template-columns:1fr; } .indicator[data-v-b1b44cf2] { padding:1rem; border-radius:12px; text-align:left; } .indicator-label[data-v-b1b44cf2] { display:block; font-size:0.9rem; margin-bottom:0.5rem; } .indicator-value[data-v-b1b44cf2] { font-weight:600; font-size:1.2rem; } .prediction-summary[data-v-b1b44cf2] { color:#455a64; line-height:1.6; margin:1rem 0 0; } .long-term-predictions[data-v-b1b44cf2] { display:grid; grid-template-columns:repeat(2,1fr); gap:2rem; } @media (max-width:768px) { .constellation-container[data-v-b1b44cf2] { padding:1rem; } .constellation-selection[data-v-b1b44cf2] { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); } .daily-predictions[data-v-b1b44cf2],.long-term-predictions[data-v-b1b44cf2] { grid-template-columns:1fr; } } .page-shell[data-v-106c28cc],.eat-page[data-v-106c28cc] { min-height:100vh; width:100%; box-sizing:border-box; background:#F1DDDF; color:#1A1A1D; padding:28px 20px 56px; overflow-x:hidden; background-image:radial-gradient(#1A1A1D 1.1px,transparent 1.1px); background-size:24px 24px; } .page-container-wide[data-v-106c28cc],.eat-shell[data-v-106c28cc] { width:min(1380px,100%); margin:0 auto; } .eat-hero[data-v-106c28cc] { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr); gap:22px; align-items:stretch; margin-bottom:22px; } .hero-copy[data-v-106c28cc],.panel[data-v-106c28cc],.hero-result[data-v-106c28cc],.control-strip[data-v-106c28cc],.decision-panel[data-v-106c28cc],.library-panel[data-v-106c28cc],.side-panel[data-v-106c28cc],.quick-add[data-v-106c28cc],.collection-block[data-v-106c28cc],.search-block[data-v-106c28cc],.food-card[data-v-106c28cc],.alternative-card[data-v-106c28cc],.history-item[data-v-106c28cc],.memory-item[data-v-106c28cc],.empty-state[data-v-106c28cc] { background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; } .hero-copy[data-v-106c28cc],.hero-result[data-v-106c28cc],.control-strip[data-v-106c28cc],.decision-panel[data-v-106c28cc],.library-panel[data-v-106c28cc],.side-panel[data-v-106c28cc] { padding:22px; } .eyebrow[data-v-106c28cc] { display:inline-flex; padding:6px 10px; margin-bottom:12px; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:4px 4px 0 #1A1A1D; font-size:12px; font-weight:1000; letter-spacing:.08em; text-transform:uppercase; } .hero-copy h1[data-v-106c28cc] { margin:0 0 10px; font-size:clamp(42px,6vw,82px); line-height:.95; font-weight:1000; letter-spacing:-2px; } .hero-copy p[data-v-106c28cc],.hero-result p[data-v-106c28cc] { margin:0; color:rgba(26,26,29,.75); font-size:16px; line-height:1.75; font-weight:700; } .hero-actions[data-v-106c28cc],.decision-actions[data-v-106c28cc],.toolbar-actions[data-v-106c28cc],.composer-actions[data-v-106c28cc] { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; } button[data-v-106c28cc],.primary-action[data-v-106c28cc],.accent-action[data-v-106c28cc],.preset-chip[data-v-106c28cc],.chip[data-v-106c28cc],.quick-chip-row button[data-v-106c28cc],.hero-actions button[data-v-106c28cc],.decision-actions button[data-v-106c28cc],.toolbar-actions button[data-v-106c28cc] { background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #E72D48; padding:10px 14px; font-weight:1000; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease; } .primary-action[data-v-106c28cc],.accent-action[data-v-106c28cc],.chip.active[data-v-106c28cc],.preset-chip.active[data-v-106c28cc],button.active[data-v-106c28cc] { background:#E72D48; color:#FFF9F7; box-shadow:5px 5px 0 #1A1A1D; } button[data-v-106c28cc]:hover:not(:disabled),.chip[data-v-106c28cc]:hover,.preset-chip[data-v-106c28cc]:hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } button[data-v-106c28cc]:active:not(:disabled) { transform:translate(3px,3px); box-shadow:2px 2px 0 #1A1A1D; } button[data-v-106c28cc]:disabled { opacity:.55; cursor:not-allowed; } .hero-stats[data-v-106c28cc] { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:18px; } .hero-stats article[data-v-106c28cc] { background:#F1DDDF; border:3px solid #1A1A1D; padding:12px; } .hero-stats strong[data-v-106c28cc] { display:block; color:#E72D48; font-size:28px; font-weight:1000; line-height:1; } .hero-stats span[data-v-106c28cc] { display:block; margin-top:6px; font-weight:900; color:#1A1A1D; } .hero-result[data-v-106c28cc] { background:#E72D48; color:#FFF9F7; box-shadow:8px 8px 0 #1A1A1D; display:flex; flex-direction:column; justify-content:space-between; } .hero-result h2[data-v-106c28cc] { margin:8px 0 10px; font-size:clamp(32px,4.2vw,58px); line-height:1; font-weight:1000; color:#FFF9F7; } .hero-result p[data-v-106c28cc],.hero-result-footer[data-v-106c28cc] { color:#FFF9F7; } .hero-result-label[data-v-106c28cc],.plate-kicker[data-v-106c28cc],.side-label[data-v-106c28cc],.panel-head span[data-v-106c28cc],.collection-head span[data-v-106c28cc] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:5px 9px; background:#FFF9F7; color:#E72D48; border:3px solid #1A1A1D; box-shadow:3px 3px 0 #1A1A1D; font-weight:1000; } .hero-tags[data-v-106c28cc],.food-tags[data-v-106c28cc],.alt-tags[data-v-106c28cc],.preset-row[data-v-106c28cc],.chip-row[data-v-106c28cc],.quick-chip-row[data-v-106c28cc] { display:flex; flex-wrap:wrap; gap:8px; } .hero-tags span[data-v-106c28cc],.food-tags span[data-v-106c28cc],.alt-tags span[data-v-106c28cc],.mini-chip[data-v-106c28cc] { background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; padding:5px 9px; font-weight:900; } .hero-result-footer[data-v-106c28cc] { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-top:18px; padding-top:14px; border-top:3px solid #1A1A1D; font-weight:1000; } .control-strip[data-v-106c28cc] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; margin-bottom:22px; } .control-group[data-v-106c28cc] { min-width:0; } .control-head[data-v-106c28cc],.panel-head[data-v-106c28cc],.collection-head[data-v-106c28cc] { display:flex; justify-content:space-between; align-items:flex-end; gap:10px; margin-bottom:12px; } .control-head span[data-v-106c28cc],.panel-head h2[data-v-106c28cc],.collection-head h3[data-v-106c28cc] { font-weight:1000; color:#1A1A1D; } .control-head small[data-v-106c28cc],.panel-head small[data-v-106c28cc],.collection-head small[data-v-106c28cc] { color:rgba(26,26,29,.65); font-weight:800; } .eat-workspace[data-v-106c28cc] { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:22px; align-items:start; } .decision-panel[data-v-106c28cc] { margin-bottom:22px; } .plate-stage[data-v-106c28cc] { display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:16px; align-items:center; } .plate-card[data-v-106c28cc] { background:#F1DDDF; border:3px solid #1A1A1D; padding:18px; box-shadow:5px 5px 0 #1A1A1D; } .plate-card h2[data-v-106c28cc],.food-name[data-v-106c28cc] { margin:8px 0; color:#1A1A1D; font-weight:1000; line-height:1.1; } .plate-meta[data-v-106c28cc] { display:flex; gap:10px; flex-wrap:wrap; color:rgba(26,26,29,.7); font-weight:900; } .alternative-grid[data-v-106c28cc],.food-grid[data-v-106c28cc] { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; } .alternative-card[data-v-106c28cc],.food-card[data-v-106c28cc] { padding:14px; box-shadow:5px 5px 0 #E72D48; transition:transform .16s ease,box-shadow .16s ease; } .alternative-card[data-v-106c28cc]:hover,.food-card[data-v-106c28cc]:hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } .alt-index[data-v-106c28cc] { display:inline-flex; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; padding:2px 7px; font-weight:1000; } .food-source[data-v-106c28cc] { color:rgba(26,26,29,.65); font-weight:800; } .quick-add[data-v-106c28cc],.collection-block[data-v-106c28cc],.search-block[data-v-106c28cc] { padding:16px; margin-bottom:18px; } .add-box input[data-v-106c28cc],.search-block input[data-v-106c28cc] { width:100%; min-height:46px; background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; outline:none; padding:0 12px; box-sizing:border-box; font-weight:800; } .add-box input[data-v-106c28cc]:focus,.search-block input[data-v-106c28cc]:focus { box-shadow:4px 4px 0 #E72D48; } .add-box[data-v-106c28cc] { display:flex; gap:10px; } .history-list[data-v-106c28cc],.memory-list[data-v-106c28cc] { display:flex; flex-direction:column; gap:10px; } .history-item[data-v-106c28cc],.memory-item[data-v-106c28cc] { padding:12px; box-shadow:4px 4px 0 #E72D48; } .fold-toggle[data-v-106c28cc] { width:100%; margin-top:14px; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; font-weight:1000; } .fold-toggle.compact[data-v-106c28cc] { margin-top:10px; padding:9px 12px; } .toast-line[data-v-106c28cc] { position:fixed; left:50%; bottom:26px; transform:translateX(-50%); z-index:50; background:#2FA84F; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:6px 6px 0 #1A1A1D; padding:10px 16px; font-weight:1000; } .empty-state[data-v-106c28cc] { padding:24px; text-align:center; font-weight:900; } @media (max-width:1120px) { .eat-hero[data-v-106c28cc],.eat-workspace[data-v-106c28cc] { grid-template-columns:1fr; } .control-strip[data-v-106c28cc] { grid-template-columns:1fr 1fr; } } @media (max-width:720px) { .page-shell[data-v-106c28cc],.eat-page[data-v-106c28cc] { padding:16px 16px 44px; } .hero-copy[data-v-106c28cc],.hero-result[data-v-106c28cc],.control-strip[data-v-106c28cc],.decision-panel[data-v-106c28cc],.library-panel[data-v-106c28cc],.side-panel[data-v-106c28cc] { padding:16px; } .control-strip[data-v-106c28cc],.plate-stage[data-v-106c28cc] { grid-template-columns:1fr; } .hero-stats[data-v-106c28cc] { grid-template-columns:1fr 1fr; } .add-box[data-v-106c28cc] { flex-direction:column; } .alternative-grid[data-v-106c28cc],.food-grid[data-v-106c28cc] { grid-template-columns:1fr; } .hero-result-footer[data-v-106c28cc] { flex-direction:column; align-items:flex-start; } } *[data-v-106c28cc],*[data-v-106c28cc]::before,*[data-v-106c28cc]::after { box-sizing:border-box; } button[data-v-106c28cc],input[data-v-106c28cc],textarea[data-v-106c28cc],select[data-v-106c28cc] { max-width:100%; font:inherit; } button[data-v-106c28cc] { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; } img[data-v-106c28cc],svg[data-v-106c28cc],canvas[data-v-106c28cc] { max-width:100%; height:auto; } @media (hover:hover) and (pointer:fine) { button[data-v-106c28cc]:not(:disabled):hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } } button[data-v-106c28cc]:not(:disabled):active { transform:translate(2px,2px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { h1[data-v-106c28cc],h2[data-v-106c28cc],h3[data-v-106c28cc],p[data-v-106c28cc],strong[data-v-106c28cc],span[data-v-106c28cc],small[data-v-106c28cc],label[data-v-106c28cc],button[data-v-106c28cc],input[data-v-106c28cc],textarea[data-v-106c28cc] { overflow-wrap:break-word; } button[data-v-106c28cc],input[data-v-106c28cc],textarea[data-v-106c28cc],select[data-v-106c28cc] { min-height:44px; } } .eat-shell[data-v-106c28cc],.page-container-wide[data-v-106c28cc] { max-width:1380px; width:min(1380px,100%); min-width:0; } .eat-hero[data-v-106c28cc],.eat-workspace[data-v-106c28cc],.control-strip[data-v-106c28cc],.plate-stage[data-v-106c28cc],.alternative-grid[data-v-106c28cc],.food-grid[data-v-106c28cc],.hero-stats[data-v-106c28cc] { min-width:0; } .hero-copy[data-v-106c28cc],.hero-result[data-v-106c28cc],.control-strip[data-v-106c28cc],.decision-panel[data-v-106c28cc],.library-panel[data-v-106c28cc],.side-panel[data-v-106c28cc],.plate-card[data-v-106c28cc],.food-card[data-v-106c28cc],.alternative-card[data-v-106c28cc],.search-block[data-v-106c28cc],.preset-chip[data-v-106c28cc],.add-box[data-v-106c28cc],.quick-add[data-v-106c28cc],.collection-block[data-v-106c28cc] { min-width:0; max-width:100%; } .food-card[data-v-106c28cc],.alternative-card[data-v-106c28cc],.history-item[data-v-106c28cc],.memory-item[data-v-106c28cc],.preset-chip[data-v-106c28cc],.mini-chip[data-v-106c28cc],.chip[data-v-106c28cc] { white-space:normal; } .search-block input[data-v-106c28cc],.add-box input[data-v-106c28cc] { width:100%; min-width:0; } @media (max-width:1180px) { .eat-hero[data-v-106c28cc],.eat-workspace[data-v-106c28cc] { grid-template-columns:1fr !important; } .side-panel[data-v-106c28cc] { width:100%; } } @media (max-width:820px) { .page-shell[data-v-106c28cc],.eat-page[data-v-106c28cc] { padding:16px 16px 40px !important; background-size:20px 20px; } .eat-shell[data-v-106c28cc],.page-container-wide[data-v-106c28cc] { width:100% !important; max-width:100% !important; } .eat-hero[data-v-106c28cc],.eat-workspace[data-v-106c28cc],.control-strip[data-v-106c28cc],.plate-stage[data-v-106c28cc],.alternative-grid[data-v-106c28cc],.food-grid[data-v-106c28cc],.hero-stats[data-v-106c28cc] { display:grid; grid-template-columns:minmax(0,1fr) !important; gap:14px !important; } .hero-copy[data-v-106c28cc],.hero-result[data-v-106c28cc],.control-strip[data-v-106c28cc],.decision-panel[data-v-106c28cc],.library-panel[data-v-106c28cc],.side-panel[data-v-106c28cc] { padding:16px !important; box-shadow:5px 5px 0 #E72D48 !important; } .hero-copy h1[data-v-106c28cc] { font-size:clamp(34px,12vw,52px) !important; line-height:.98; letter-spacing:-1px; } .hero-actions[data-v-106c28cc],.decision-actions[data-v-106c28cc],.toolbar-actions[data-v-106c28cc],.composer-actions[data-v-106c28cc],.hero-result-footer[data-v-106c28cc],.add-box[data-v-106c28cc],.collection-head[data-v-106c28cc],.panel-head[data-v-106c28cc],.control-head[data-v-106c28cc] { flex-direction:column !important; align-items:stretch !important; } .hero-actions button[data-v-106c28cc],.decision-actions button[data-v-106c28cc],.toolbar-actions button[data-v-106c28cc],.composer-actions button[data-v-106c28cc],.add-box button[data-v-106c28cc],.collection-head button[data-v-106c28cc] { width:100%; } .preset-row[data-v-106c28cc],.chip-row[data-v-106c28cc],.quick-chip-row[data-v-106c28cc],.hero-tags[data-v-106c28cc],.food-tags[data-v-106c28cc],.alt-tags[data-v-106c28cc] { display:flex; flex-wrap:wrap; gap:8px; min-width:0; } .preset-chip[data-v-106c28cc] { flex:1 1 100%; width:100%; text-align:left; } .chip[data-v-106c28cc],.mini-chip[data-v-106c28cc] { flex:1 1 auto; min-width:0; } .plate-card[data-v-106c28cc],.alternative-card[data-v-106c28cc],.food-card[data-v-106c28cc],.history-item[data-v-106c28cc],.memory-item[data-v-106c28cc],.quick-add[data-v-106c28cc],.collection-block[data-v-106c28cc],.empty-state[data-v-106c28cc] { box-shadow:4px 4px 0 #E72D48 !important; } .plate-meta[data-v-106c28cc] { display:grid; grid-template-columns:1fr; } .toast-line[data-v-106c28cc] { left:16px !important; right:16px !important; bottom:16px !important; width:auto !important; max-width:calc(100vw - 32px) !important; transform:none !important; text-align:center; } } @media (max-width:420px) { .page-shell[data-v-106c28cc],.eat-page[data-v-106c28cc] { padding-left:12px !important; padding-right:12px !important; } .hero-copy[data-v-106c28cc],.hero-result[data-v-106c28cc],.control-strip[data-v-106c28cc],.decision-panel[data-v-106c28cc],.library-panel[data-v-106c28cc],.side-panel[data-v-106c28cc] { padding:14px !important; border-width:2px !important; box-shadow:4px 4px 0 #E72D48 !important; } .eyebrow[data-v-106c28cc],.hero-result-label[data-v-106c28cc],.side-label[data-v-106c28cc],.plate-kicker[data-v-106c28cc],.alt-index[data-v-106c28cc] { max-width:100%; white-space:normal; } } .wechatWallet_container[data-v-151cf14a] { padding:1px 0 0 0; display:flex; flex-direction:column; align-items:center; } .title[data-v-151cf14a] { display:flex; justify-content:space-between; width:100%; box-sizing:border-box; } .arrow img[data-v-151cf14a] { width:27px; height:27px; } .title-text[data-v-151cf14a] { padding-top:0.5px; padding-right:10px; text-align:right; font-size:17px; font-weight:lighter; } .info[data-v-151cf14a] { margin-top:6.5vh; display:flex; flex-direction:column; align-items:center; } .text-style[data-v-151cf14a] { margin-left:0.5vh; margin-top:0.8vh; color:black; font-size:clamp(32px,10vw,48px); font-weight:500; text-shadow:-0.5px -0.5px 0.5px rgba(0,0,0),-0.5px -0.5px 0.5px rgba(0,0,0),-0.5px -0.5px 1px rgba(0,0,0),-0.5px -0.5px 0.5px rgba(0,0,0); } .info img[data-v-151cf14a] { width:53px; } .rmb[data-v-151cf14a] { margin-top:2.5vh; } .rmb img[data-v-151cf14a] { height:26px; width:25px; } .charge[data-v-151cf14a] { margin-top:68%; flex-direction:column; align-items:center; justify-content:center; } .btn[data-v-151cf14a] { width:180px; padding:10px; text-align:center; margin-bottom:5px; box-sizing:border-box; transition:background-color 0.3s; } .btn--green[data-v-151cf14a] { font-weight:500; border-radius:8px; background-color:#34C759; color:white; } .btn--white[data-v-151cf14a] { font-weight:500; border-radius:8px; background-color:rgba(192,191,191,0.25); color:black; } .faq[data-v-151cf14a],.service-provider[data-v-151cf14a] { font-family:"Microsoft YaHei",sans-serif; text-align:center; color:#002188; font-size:14px; margin-bottom:10px; } .service-provider[data-v-151cf14a] { font-size:12px; color:#b2b2b2; } .law-world[data-v-443deba5] { min-height:100vh; width:100%; box-sizing:border-box; padding:24px 20px 110px; background:#F1DDDF; color:#1A1A1D; overflow-x:hidden; position:relative; background-image:radial-gradient(#1A1A1D 1.2px,transparent 1.2px); background-size:24px 24px; } .bg-glow[data-v-443deba5] { position:fixed; inset:auto -80px -120px auto; width:260px; height:260px; background:#E72D48; border:3px solid #1A1A1D; box-shadow:10px 10px 0 #1A1A1D; opacity:.18; transform:rotate(12deg); pointer-events:none; } .top-nav[data-v-443deba5],.content-wrapper[data-v-443deba5] { width:min(1320px,100%); margin:0 auto; position:relative; z-index:1; } .action-panel[data-v-443deba5] { margin-bottom:20px; } .glass-header[data-v-443deba5],.law-container[data-v-443deba5],.floating-footer[data-v-443deba5] { background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; } .glass-header[data-v-443deba5] { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px; } .type-pill[data-v-443deba5] { position:relative; display:grid; grid-template-columns:1fr 1fr; min-width:220px; background:#F1DDDF; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; cursor:pointer; overflow:hidden; } .type-pill span[data-v-443deba5] { position:relative; z-index:1; padding:12px 16px; text-align:center; color:#1A1A1D; font-weight:1000; } .type-pill span.active[data-v-443deba5] { color:#FFF9F7; } .pill-active[data-v-443deba5] { position:absolute; inset:0 auto 0 0; width:50%; background:#E72D48; border-right:3px solid #1A1A1D; transition:transform .18s ease; } .pill-active.is-right[data-v-443deba5] { transform:translateX(100%); border-right:0; border-left:3px solid #1A1A1D; } .search-box[data-v-443deba5] { flex:1; display:flex; align-items:center; background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; min-width:260px; } .search-box input[data-v-443deba5] { flex:1; min-width:0; height:48px; border:0; outline:none; background:transparent; color:#1A1A1D; padding:0 14px; font-size:16px; font-weight:800; } .search-box input[data-v-443deba5]::-moz-placeholder { color:rgba(26,26,29,.5); } .search-box input[data-v-443deba5]::placeholder { color:rgba(26,26,29,.5); } .search-icon[data-v-443deba5] { width:52px; height:48px; border-left:3px solid #1A1A1D; background:#E72D48; display:flex; align-items:center; justify-content:center; cursor:pointer; } .search-icon img[data-v-443deba5] { width:22px; height:22px; filter:brightness(0) invert(1); } .law-main[data-v-443deba5] { width:100%; } .law-container[data-v-443deba5] { padding:22px; } .law-intro[data-v-443deba5],.search-meta[data-v-443deba5] { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:18px; border-bottom:3px solid #1A1A1D; padding-bottom:14px; } .law-intro h1[data-v-443deba5],.search-meta h2[data-v-443deba5] { margin:0; font-size:clamp(32px,5vw,68px); line-height:1; font-weight:1000; letter-spacing:-2px; color:#1A1A1D; } .law-intro p[data-v-443deba5],.search-meta span[data-v-443deba5] { margin:0; color:#E72D48; font-weight:1000; } .close-btn[data-v-443deba5] { background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; padding:10px 14px; font-weight:1000; cursor:pointer; } .law-grid[data-v-443deba5] { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:16px; } .glass-card[data-v-443deba5] { position:relative; min-height:140px; padding:16px; background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:6px 6px 0 #E72D48; overflow:hidden; animation:lawCard-443deba5 .24s ease both; animation-delay:var(--delay ); transition:transform .16s ease,box-shadow .16s ease; } .glass-card[data-v-443deba5]:hover { transform:translate(-3px,-3px); box-shadow:9px 9px 0 #1A1A1D; } .card-id[data-v-443deba5] { display:inline-flex; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; padding:4px 8px; font-weight:1000; box-shadow:3px 3px 0 #1A1A1D; } .card-text[data-v-443deba5] { margin:12px 0 0; color:#1A1A1D; font-size:16px; line-height:1.8; font-weight:800; } .card-glow[data-v-443deba5] { position:absolute; right:-20px; bottom:-20px; width:70px; height:70px; background:#F1DDDF; border:3px solid #1A1A1D; transform:rotate(12deg); } .floating-footer[data-v-443deba5] { position:fixed; left:50%; bottom:24px; transform:translateX(-50%); padding:12px; z-index:10; } .orbit-button[data-v-443deba5] { position:relative; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; padding:12px 24px; font-weight:1000; cursor:pointer; overflow:hidden; } .orbit-button[data-v-443deba5]:active { transform:translate(3px,3px); box-shadow:2px 2px 0 #1A1A1D; } .orbit[data-v-443deba5] { display:none; } .law-fade-enter-active[data-v-443deba5],.law-fade-leave-active[data-v-443deba5] { transition:opacity .16s ease,transform .16s ease; } .law-fade-enter[data-v-443deba5],.law-fade-leave-to[data-v-443deba5] { opacity:0; transform:translateY(8px); } @keyframes lawCard-443deba5 { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:translateY(0); } } @media (max-width:760px) { .law-world[data-v-443deba5] { padding:16px 16px 100px; } .glass-header[data-v-443deba5] { flex-direction:column; align-items:stretch; } .type-pill[data-v-443deba5],.search-box[data-v-443deba5] { min-width:0; width:100%; } .law-container[data-v-443deba5] { padding:16px; } .law-intro[data-v-443deba5],.search-meta[data-v-443deba5] { align-items:flex-start; flex-direction:column; } .law-grid[data-v-443deba5] { grid-template-columns:1fr; } .floating-footer[data-v-443deba5] { width:calc(100% - 32px); box-sizing:border-box; } .orbit-button[data-v-443deba5] { width:100%; } } *[data-v-443deba5],*[data-v-443deba5]::before,*[data-v-443deba5]::after { box-sizing:border-box; } button[data-v-443deba5],input[data-v-443deba5],textarea[data-v-443deba5],select[data-v-443deba5] { max-width:100%; font:inherit; } button[data-v-443deba5] { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; } img[data-v-443deba5],svg[data-v-443deba5],canvas[data-v-443deba5] { max-width:100%; height:auto; } @media (hover:hover) and (pointer:fine) { button[data-v-443deba5]:not(:disabled):hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } } button[data-v-443deba5]:not(:disabled):active { transform:translate(2px,2px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { h1[data-v-443deba5],h2[data-v-443deba5],h3[data-v-443deba5],p[data-v-443deba5],strong[data-v-443deba5],span[data-v-443deba5],small[data-v-443deba5],label[data-v-443deba5],button[data-v-443deba5],input[data-v-443deba5],textarea[data-v-443deba5] { overflow-wrap:break-word; } button[data-v-443deba5],input[data-v-443deba5],textarea[data-v-443deba5],select[data-v-443deba5] { min-height:44px; } } .law-container[data-v-443deba5],.content-wrapper[data-v-443deba5],.law-main[data-v-443deba5],.action-panel[data-v-443deba5],.law-grid[data-v-443deba5],.glass-card[data-v-443deba5] { min-width:0; max-width:100%; } .search-box input[data-v-443deba5] { width:100%; min-width:0; } @media (max-width:860px) { .law-main[data-v-443deba5],.action-panel[data-v-443deba5],.law-grid[data-v-443deba5] { grid-template-columns:minmax(0,1fr) !important; } } @media (max-width:760px) { .law-container[data-v-443deba5] { padding:16px 16px 40px !important; } .glass-header[data-v-443deba5],.glass-card[data-v-443deba5],.law-intro[data-v-443deba5],.top-nav[data-v-443deba5],.floating-footer[data-v-443deba5] { padding:16px !important; box-shadow:5px 5px 0 #E72D48 !important; } .action-panel[data-v-443deba5] { flex-direction:column; align-items:stretch; } .type-pill[data-v-443deba5],.search-box[data-v-443deba5],.orbit-button[data-v-443deba5] { width:100% !important; min-width:0 !important; } .orbit[data-v-443deba5] { display:grid; grid-template-columns:1fr 1fr; gap:10px; } } @media (max-width:420px) { .orbit[data-v-443deba5] { grid-template-columns:1fr; } } .gossip-page[data-v-7d24fcb4] { min-height:100vh; overflow-x:hidden; color:#152033; background:radial-gradient(circle at 12% 8%,rgba(255,207,69,0.34),transparent 28rem),radial-gradient(circle at 88% 12%,rgba(42,196,255,0.28),transparent 26rem),radial-gradient(circle at 50% 100%,rgba(25,201,154,0.16),transparent 32rem),linear-gradient(135deg,#fff8ea 0%,#effbff 48%,#fff3f8 100%); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; } .gossip-page[data-v-7d24fcb4]::before { content:""; position:fixed; inset:0; pointer-events:none; background-image:linear-gradient(rgba(15,76,117,0.055) 1px,transparent 1px),linear-gradient(90deg,rgba(15,76,117,0.045) 1px,transparent 1px); background-size:30px 30px; } .gossip-shell[data-v-7d24fcb4] { position:relative; z-index:1; width:min(1440px,calc(100% - 40px)); margin:0 auto; padding:54px 0 72px; } .gossip-hero[data-v-7d24fcb4] { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,380px); gap:18px; align-items:stretch; } .hero-copy[data-v-7d24fcb4],.hero-panel[data-v-7d24fcb4],.wheel-panel[data-v-7d24fcb4],.result-panel[data-v-7d24fcb4] { border:1px solid rgba(35,63,108,0.1); border-radius:8px; box-shadow:0 20px 48px rgba(72,91,129,0.12); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); } .hero-copy[data-v-7d24fcb4] { padding:clamp(28px,5vw,56px); background:linear-gradient(135deg,rgba(255,255,255,0.9),rgba(255,255,255,0.68)),repeating-linear-gradient(-45deg,rgba(42,196,255,0.1) 0 10px,rgba(255,111,159,0.08) 10px 20px,transparent 20px 30px); } .eyebrow[data-v-7d24fcb4],.hero-panel span[data-v-7d24fcb4],.panel-head span[data-v-7d24fcb4] { font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .eyebrow[data-v-7d24fcb4] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:8px 12px; border-radius:999px; background:#111827; color:#ffffff; } .hero-copy h1[data-v-7d24fcb4] { margin:18px 0 12px; color:#111827; font-size:clamp(40px,6vw,76px); line-height:1; letter-spacing:0; } .hero-copy p[data-v-7d24fcb4] { max-width:660px; margin:0; color:#536079; font-size:clamp(16px,2vw,20px); line-height:1.75; } .hero-panel[data-v-7d24fcb4] { display:flex; min-height:220px; flex-direction:column; justify-content:flex-end; gap:12px; padding:28px; color:#ffffff; background:var(--fortune-bg ); box-shadow:0 22px 52px var(--fortune-shadow ); transition:background 0.35s ease,box-shadow 0.35s ease; } .hero-panel span[data-v-7d24fcb4] { color:rgba(255,255,255,0.76); } .hero-panel strong[data-v-7d24fcb4] { color:#ffffff; max-width:100%; overflow:hidden; font-size:clamp(46px,6.2vw,86px); line-height:1.05; letter-spacing:0; text-overflow:ellipsis; white-space:nowrap; text-shadow:0 18px 38px rgba(0,0,0,0.2); } .hero-panel.idle strong[data-v-7d24fcb4] { font-size:clamp(34px,4vw,52px); } .hero-panel p[data-v-7d24fcb4] { margin:0; color:rgba(255,255,255,0.74); line-height:1.7; } .fortune-idle[data-v-7d24fcb4] { --fortune-bg:radial-gradient(circle at 86% 12%,rgba(255,255,255,0.14),transparent 9rem),linear-gradient(145deg,#111827,#164e63); --fortune-shadow:rgba(17,24,39,0.18); } .fortune-great[data-v-7d24fcb4] { --fortune-bg:radial-gradient(circle at 88% 14%,rgba(255,255,255,0.22),transparent 9rem),linear-gradient(145deg,#047857,#19c99a); --fortune-shadow:rgba(4,120,87,0.22); } .fortune-good[data-v-7d24fcb4] { --fortune-bg:radial-gradient(circle at 88% 14%,rgba(255,255,255,0.2),transparent 9rem),linear-gradient(145deg,#0369a1,#2ac4ff); --fortune-shadow:rgba(3,105,161,0.22); } .fortune-balance[data-v-7d24fcb4] { --fortune-bg:radial-gradient(circle at 88% 14%,rgba(255,255,255,0.24),transparent 9rem),linear-gradient(145deg,#b7791f,#ffcf45); --fortune-shadow:rgba(183,121,31,0.22); } .fortune-low[data-v-7d24fcb4] { --fortune-bg:radial-gradient(circle at 88% 14%,rgba(255,255,255,0.2),transparent 9rem),linear-gradient(145deg,#be185d,#ff6f9f); --fortune-shadow:rgba(190,24,93,0.22); } .fortune-alert[data-v-7d24fcb4] { --fortune-bg:radial-gradient(circle at 88% 14%,rgba(255,255,255,0.18),transparent 9rem),linear-gradient(145deg,#991b1b,#ef4444); --fortune-shadow:rgba(153,27,27,0.22); } .oracle-layout[data-v-7d24fcb4] { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:18px; margin-top:18px; align-items:start; } .wheel-panel[data-v-7d24fcb4],.result-panel[data-v-7d24fcb4] { min-width:0; background:rgba(255,255,255,0.78); } .wheel-panel[data-v-7d24fcb4] { display:grid; justify-items:center; gap:18px; padding:clamp(18px,3vw,32px); } .wheel-stage[data-v-7d24fcb4] { position:relative; width:min(100%,580px); aspect-ratio:1; display:grid; place-items:center; } .pointer[data-v-7d24fcb4] { position:absolute; top:0; left:50%; z-index:6; width:18px; height:72px; transform:translateX(-50%); pointer-events:none; } .pointer[data-v-7d24fcb4]::before { content:""; position:absolute; top:2px; left:50%; width:18px; height:18px; border-radius:999px; background:#111827; box-shadow:0 8px 18px rgba(17,24,39,0.22); transform:translateX(-50%); } .pointer span[data-v-7d24fcb4] { position:absolute; top:18px; left:50%; width:4px; height:52px; border-radius:999px; background:linear-gradient(180deg,#111827,#ef4444); transform:translateX(-50%); } .wheel[data-v-7d24fcb4] { --wheel-size:min(100%,540px); position:relative; width:var(--wheel-size ); aspect-ratio:1; border:0; border-radius:50%; background:radial-gradient(circle at center,#ffffff 0 19%,transparent 19.5%),repeating-conic-gradient(from -2.8125deg,rgba(17,24,39,0.12) 0 1deg,transparent 1deg 5.625deg),conic-gradient(from -2.8125deg,rgba(42,196,255,0.12),rgba(255,207,69,0.14),rgba(25,201,154,0.12),rgba(255,111,159,0.12),rgba(42,196,255,0.12)); box-shadow:inset 0 0 0 1px rgba(17,24,39,0.12),inset 0 0 0 18px rgba(255,255,255,0.72),inset 0 0 0 78px rgba(255,255,255,0.34),0 28px 62px rgba(72,91,129,0.18); cursor:pointer; transform:rotate(var(--rotation )); transition:transform 2.4s cubic-bezier(0.12,0.72,0.08,1); } .wheel.spinning[data-v-7d24fcb4] { pointer-events:none; } .outer-ring[data-v-7d24fcb4],.inner-ring[data-v-7d24fcb4] { position:absolute; inset:10px; border:1px solid rgba(17,24,39,0.12); border-radius:50%; pointer-events:none; } .inner-ring[data-v-7d24fcb4] { inset:24%; border-style:dashed; border-color:rgba(17,24,39,0.16); } .hexagram-label[data-v-7d24fcb4] { position:absolute; top:50%; left:50%; z-index:2; width:46px; color:#164e63; font-size:clamp(9px,1.2vw,12px); font-weight:900; line-height:1.05; text-align:center; transform:translate(-50%,-50%) rotate(var(--angle )) translateY(calc(var(--wheel-size ) * -0.415)) rotate(calc(var(--angle ) * -1)); transition:color 0.2s ease,transform 0.2s ease,background 0.2s ease; pointer-events:none; } .hexagram-label.active[data-v-7d24fcb4] { padding:5px 6px; border-radius:999px; background:#111827; color:#ffffff; box-shadow:0 10px 20px rgba(17,24,39,0.18); } .trigram[data-v-7d24fcb4] { position:absolute; top:50%; left:50%; z-index:3; display:grid; gap:4px; justify-items:center; color:#111827; transform:translate(-50%,-50%) rotate(var(--angle )) translateY(calc(var(--wheel-size ) * -0.285)) rotate(calc(var(--angle ) * -1)); pointer-events:none; } .trigram strong[data-v-7d24fcb4] { font-size:13px; } .yao-stack[data-v-7d24fcb4] { display:grid; gap:3px; } .yao[data-v-7d24fcb4] { display:flex; justify-content:center; gap:4px; width:32px; } .yao i[data-v-7d24fcb4] { display:block; width:32px; height:4px; border-radius:999px; background:currentColor; } .yao.broken i[data-v-7d24fcb4] { width:13px; } .taiji[data-v-7d24fcb4] { position:absolute; top:50%; left:50%; z-index:4; width:25%; transform:translate(-50%,-50%); filter:drop-shadow(0 14px 24px rgba(17,24,39,0.16)); pointer-events:none; } .taiji-paper[data-v-7d24fcb4] { fill:#ffffff; stroke:rgba(17,24,39,0.26); stroke-width:1.2; } .taiji-ink[data-v-7d24fcb4] { fill:#111827; } .spin-button[data-v-7d24fcb4] { min-height:44px; padding:0 18px; border:0; border-radius:999px; background:#111827; color:#ffffff; cursor:pointer; font-weight:900; box-shadow:0 16px 34px rgba(17,24,39,0.2); transition:transform 0.18s ease,box-shadow 0.18s ease; } .spin-button[data-v-7d24fcb4]:hover:not(:disabled) { transform:translateY(-2px); box-shadow:0 20px 42px rgba(17,24,39,0.24); } .spin-button[data-v-7d24fcb4]:disabled { cursor:not-allowed; opacity:0.5; } .result-panel[data-v-7d24fcb4] { padding:clamp(18px,3vw,28px); } .panel-head[data-v-7d24fcb4] { margin-bottom:16px; } .panel-head span[data-v-7d24fcb4] { color:#f97316; } .panel-head h2[data-v-7d24fcb4] { margin:5px 0 0; color:#111827; font-size:clamp(28px,4vw,46px); line-height:1.08; } .result-content[data-v-7d24fcb4] { display:grid; gap:14px; } .result-summary[data-v-7d24fcb4] { width:-moz-fit-content; width:fit-content; padding:9px 12px; border-radius:999px; background:#111827; color:#ffffff; font-size:14px; font-weight:900; } .result-content p[data-v-7d24fcb4] { margin:0; color:#334155; font-size:16px; font-weight:800; line-height:1.8; } .result-content pre[data-v-7d24fcb4] { max-height:min(52vh,560px); overflow:auto; margin:0; padding:16px; border:1px solid rgba(35,63,108,0.1); border-radius:8px; background:rgba(255,255,255,0.72); color:#475569; font-family:inherit; font-size:14px; font-weight:700; line-height:1.8; white-space:pre-wrap; } .empty-result[data-v-7d24fcb4] { min-height:360px; display:grid; place-items:center; align-content:center; gap:12px; border:1px dashed rgba(35,63,108,0.16); border-radius:8px; background:rgba(255,255,255,0.52); text-align:center; } .empty-result span[data-v-7d24fcb4] { color:#111827; font-size:clamp(40px,6vw,72px); font-weight:900; line-height:1; } .empty-result p[data-v-7d24fcb4] { max-width:260px; margin:0; color:#64748b; font-weight:800; line-height:1.7; } @media (max-width:1080px) { .gossip-shell[data-v-7d24fcb4] { width:min(100% - 28px,860px); } .gossip-hero[data-v-7d24fcb4] { grid-template-columns:1fr; } .wheel-stage[data-v-7d24fcb4] { width:min(100%,620px); } } @media (max-width:991px) { .oracle-layout[data-v-7d24fcb4] { grid-template-columns:1fr; } } @media (max-width:620px) { .gossip-shell[data-v-7d24fcb4] { width:min(100% - 20px,480px); padding-top:34px; padding-bottom:44px; } .hero-copy[data-v-7d24fcb4],.hero-panel[data-v-7d24fcb4],.result-panel[data-v-7d24fcb4] { padding:20px; } .wheel-panel[data-v-7d24fcb4] { padding:14px; } .hexagram-label[data-v-7d24fcb4] { width:34px; font-size:8px; } .trigram[data-v-7d24fcb4] { transform:translate(-50%,-50%) rotate(var(--angle )) translateY(calc(var(--wheel-size ) * -0.27)) rotate(calc(var(--angle ) * -1)); } .trigram strong[data-v-7d24fcb4] { display:none; } .yao[data-v-7d24fcb4] { width:24px; } .yao i[data-v-7d24fcb4] { width:24px; height:3px; } .yao.broken i[data-v-7d24fcb4] { width:10px; } } .characters-page[data-v-76fcde62] { min-height:100vh; width:100%; background:#F1DDDF; color:#1A1A1D; padding:28px 20px 56px; box-sizing:border-box; background-image:radial-gradient(#1A1A1D 1.2px,transparent 1.2px),linear-gradient(135deg,rgba(231,45,72,.08) 25%,transparent 25%); background-size:22px 22px,42px 42px; overflow-x:hidden; } .characters-shell[data-v-76fcde62] { width:min(1380px,100%); margin:0 auto; } .characters-hero[data-v-76fcde62] { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:24px; align-items:stretch; margin-bottom:22px; } .hero-copy[data-v-76fcde62],.hero-poster[data-v-76fcde62],.archive-status[data-v-76fcde62],.character-card[data-v-76fcde62],.character-detail[data-v-76fcde62] { background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; } .hero-copy[data-v-76fcde62] { padding:28px; position:relative; } .hero-copy[data-v-76fcde62]::after { content:""; position:absolute; right:22px; top:22px; width:42px; height:42px; background:#E72D48; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; transform:rotate(8deg); } .eyebrow[data-v-76fcde62] { display:inline-flex; align-items:center; padding:6px 10px; margin-bottom:12px; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:4px 4px 0 #1A1A1D; font-size:12px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .hero-copy h1[data-v-76fcde62] { margin:0 0 10px; font-size:clamp(36px,5vw,72px); line-height:.95; font-weight:1000; letter-spacing:-2px; } .hero-copy p[data-v-76fcde62] { margin:0; max-width:680px; color:rgba(26,26,29,.78); font-size:16px; line-height:1.75; font-weight:700; } .hero-poster[data-v-76fcde62] { padding:12px; cursor:pointer; display:flex; flex-direction:column; gap:10px; transition:transform .16s ease,box-shadow .16s ease; } .hero-poster[data-v-76fcde62]:hover { transform:translate(-3px,-3px); box-shadow:11px 11px 0 #1A1A1D; } .hero-poster[data-v-76fcde62]:active { transform:translate(4px,4px); box-shadow:4px 4px 0 #1A1A1D; } .hero-poster img[data-v-76fcde62] { width:100%; height:170px; -o-object-fit:cover; object-fit:cover; border:3px solid #1A1A1D; background:#F1DDDF; } .hero-poster span[data-v-76fcde62] { color:#1A1A1D; font-weight:900; text-align:center; } .archive-status[data-v-76fcde62] { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; padding:16px; margin-bottom:22px; } .archive-status div[data-v-76fcde62] { padding:14px 16px; background:#F1DDDF; border:3px solid #1A1A1D; } .archive-status strong[data-v-76fcde62] { display:block; color:#E72D48; font-size:28px; line-height:1; font-weight:1000; } .archive-status span[data-v-76fcde62] { display:block; margin-top:6px; color:#1A1A1D; font-weight:900; } .character-grid[data-v-76fcde62] { display:grid; grid-template-columns:repeat(auto-fill,minmax(160px,1fr)); gap:18px; } .character-card[data-v-76fcde62] { overflow:hidden; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,background .16s ease; } .character-card[data-v-76fcde62]:hover { transform:translate(-4px,-4px); box-shadow:10px 10px 0 #1A1A1D; } .character-card[data-v-76fcde62]:active { transform:translate(3px,3px); box-shadow:4px 4px 0 #1A1A1D; } .character-card--transparent[data-v-76fcde62] { opacity:.86; } .character-card__image[data-v-76fcde62] { aspect-ratio:1/1; background:#F1DDDF; border-bottom:3px solid #1A1A1D; overflow:hidden; } .character-card__image img[data-v-76fcde62] { width:100%; height:100%; -o-object-fit:cover; object-fit:cover; display:block; transition:transform .22s ease; } .character-card:hover .character-card__image img[data-v-76fcde62] { transform:scale(1.05) rotate(-1deg); } .character-card__body[data-v-76fcde62] { padding:12px; } .character-card__name[data-v-76fcde62] { font-size:17px; line-height:1.25; font-weight:1000; color:#1A1A1D; } .character-card__meta[data-v-76fcde62] { margin-top:6px; color:rgba(26,26,29,.65); font-size:13px; font-weight:800; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .loading-row[data-v-76fcde62] { width:-moz-fit-content; width:fit-content; margin:26px auto 0; padding:10px 16px; background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #E72D48; font-weight:900; display:flex; align-items:center; gap:8px; } .loading-row span[data-v-76fcde62] { width:10px; height:10px; background:#2FA84F; border:2px solid #1A1A1D; animation:blink-76fcde62 .8s infinite alternate; } .detail-backdrop[data-v-76fcde62] { position:fixed; inset:0; z-index:30; background:rgba(26,26,29,.45); padding:24px; overflow:auto; display:flex; align-items:center; justify-content:center; } .character-detail[data-v-76fcde62] { width:min(920px,100%); max-height:min(860px,calc(100vh - 48px)); overflow:auto; padding:22px; position:relative; } .detail-close[data-v-76fcde62] { position:sticky; top:0; float:right; z-index:2; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:4px 4px 0 #1A1A1D; padding:8px 14px; font-weight:900; cursor:pointer; } .detail-close[data-v-76fcde62]:active { transform:translate(3px,3px); box-shadow:1px 1px 0 #1A1A1D; } .character-detail__header[data-v-76fcde62] { display:flex; gap:18px; align-items:center; margin-bottom:18px; } .character-detail__avatar[data-v-76fcde62] { width:120px; height:120px; flex:0 0 auto; border:3px solid #1A1A1D; background:#F1DDDF; box-shadow:6px 6px 0 #E72D48; overflow:hidden; } .character-detail__avatar img[data-v-76fcde62],.character-detail__content img[data-v-76fcde62] { width:100%; height:100%; -o-object-fit:cover; object-fit:cover; display:block; } .character-detail__name[data-v-76fcde62] { margin:0; color:#1A1A1D; font-size:clamp(28px,4vw,52px); font-weight:1000; line-height:1; } .character-detail__tags[data-v-76fcde62] { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; } .tag[data-v-76fcde62] { padding:6px 10px; background:#F1DDDF; border:3px solid #1A1A1D; font-weight:900; } .character-detail__content[data-v-76fcde62] { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr); gap:18px; align-items:start; } .character-detail__content > img[data-v-76fcde62] { height:auto; max-height:520px; border:3px solid #1A1A1D; background:#F1DDDF; -o-object-fit:contain; object-fit:contain; } .character-detail__description[data-v-76fcde62] { margin:0; padding:18px; background:#F1DDDF; border:3px solid #1A1A1D; color:#1A1A1D; font-size:16px; line-height:1.8; font-weight:700; } .detail-fade-enter-active[data-v-76fcde62],.detail-fade-leave-active[data-v-76fcde62] { transition:opacity .18s ease; } .detail-fade-enter[data-v-76fcde62],.detail-fade-leave-to[data-v-76fcde62] { opacity:0; } @keyframes blink-76fcde62 { from { transform:scale(.75); opacity:.55; } to { transform:scale(1); opacity:1; } } @media (max-width:860px) { .characters-page[data-v-76fcde62] { padding:18px 16px 40px; } .characters-hero[data-v-76fcde62] { grid-template-columns:1fr; } .hero-copy[data-v-76fcde62] { padding:22px; } .hero-copy[data-v-76fcde62]::after { display:none; } .archive-status[data-v-76fcde62] { grid-template-columns:1fr; } .character-grid[data-v-76fcde62] { grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:14px; } .character-detail__header[data-v-76fcde62],.character-detail__content[data-v-76fcde62] { grid-template-columns:1fr; display:block; } .character-detail__avatar[data-v-76fcde62] { margin-bottom:14px; } .character-detail__content > img[data-v-76fcde62] { margin-bottom:14px; } } @media (max-width:480px) { .hero-copy h1[data-v-76fcde62] { font-size:42px; } .character-grid[data-v-76fcde62] { grid-template-columns:repeat(2,minmax(0,1fr)); } .detail-backdrop[data-v-76fcde62] { padding:14px; align-items:flex-start; } .character-detail[data-v-76fcde62] { padding:16px; } } *[data-v-76fcde62],*[data-v-76fcde62]::before,*[data-v-76fcde62]::after { box-sizing:border-box; } button[data-v-76fcde62],input[data-v-76fcde62],textarea[data-v-76fcde62],select[data-v-76fcde62] { max-width:100%; font:inherit; } button[data-v-76fcde62] { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; } img[data-v-76fcde62],svg[data-v-76fcde62],canvas[data-v-76fcde62] { max-width:100%; height:auto; } @media (hover:hover) and (pointer:fine) { button[data-v-76fcde62]:not(:disabled):hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } } button[data-v-76fcde62]:not(:disabled):active { transform:translate(2px,2px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { h1[data-v-76fcde62],h2[data-v-76fcde62],h3[data-v-76fcde62],p[data-v-76fcde62],strong[data-v-76fcde62],span[data-v-76fcde62],small[data-v-76fcde62],label[data-v-76fcde62],button[data-v-76fcde62],input[data-v-76fcde62],textarea[data-v-76fcde62] { overflow-wrap:break-word; } button[data-v-76fcde62],input[data-v-76fcde62],textarea[data-v-76fcde62],select[data-v-76fcde62] { min-height:44px; } } .characters-shell[data-v-76fcde62] { width:min(1320px,100%); min-width:0; } .characters-hero[data-v-76fcde62],.archive-status[data-v-76fcde62],.character-grid[data-v-76fcde62],.character-detail__content[data-v-76fcde62] { min-width:0; } .character-card[data-v-76fcde62],.character-detail[data-v-76fcde62],.hero-copy[data-v-76fcde62],.hero-poster[data-v-76fcde62] { min-width:0; max-width:100%; } @media (max-width:920px) { .characters-hero[data-v-76fcde62],.archive-status[data-v-76fcde62],.character-detail__content[data-v-76fcde62] { grid-template-columns:minmax(0,1fr) !important; } } @media (max-width:760px) { .characters-page[data-v-76fcde62] { padding:16px 16px 40px !important; } .characters-shell[data-v-76fcde62] { width:100% !important; } .hero-copy[data-v-76fcde62],.hero-poster[data-v-76fcde62],.character-detail[data-v-76fcde62] { padding:16px !important; box-shadow:5px 5px 0 #E72D48 !important; } .hero-copy h1[data-v-76fcde62] { font-size:clamp(32px,11vw,48px) !important; } .character-grid[data-v-76fcde62] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:12px !important; } .character-card__image[data-v-76fcde62] { height:auto; aspect-ratio:1/1; } .detail-backdrop[data-v-76fcde62] { padding:14px !important; } .character-detail__header[data-v-76fcde62] { flex-direction:column; align-items:flex-start; } } @media (max-width:420px) { .character-grid[data-v-76fcde62] { grid-template-columns:minmax(0,1fr) !important; } } .note-page[data-v-47494ad8]{--page-bg:#F1DDDF;--panel:#FFF9F7;--ink:#1A1A1D;--red:#E72D48;--green:#2FA84F;min-height:100vh;background:var(--page-bg );color:var(--ink );padding:28px 18px 70px;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;overflow-x:hidden}.note-shell[data-v-47494ad8]{width:min(1360px,100%);margin:0 auto}.note-hero[data-v-47494ad8],.note-toolbar[data-v-47494ad8],.editor-panel[data-v-47494ad8],.preview-panel[data-v-47494ad8]{background:var(--panel );border:3px solid var(--ink );box-shadow:8px 8px 0 var(--red );box-sizing:border-box}.note-hero[data-v-47494ad8]{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:24px;align-items:stretch;padding:34px;position:relative;overflow:hidden}.note-hero[data-v-47494ad8]::after{content:"";position:absolute;right:26px;bottom:22px;width:126px;height:126px;background-image:radial-gradient(var(--red ) 3px,transparent 3px);background-size:16px 16px;opacity:.12}.eyebrow[data-v-47494ad8]{display:inline-flex;padding:8px 14px;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:4px 4px 0 var(--ink );font-weight:1000;transform:rotate(-2deg)}h1[data-v-47494ad8],h2[data-v-47494ad8],p[data-v-47494ad8]{margin:0}.hero-copy h1[data-v-47494ad8]{margin-top:18px;font-size:clamp(42px,6vw,80px);line-height:1;font-weight:1000;letter-spacing:-3px}.hero-copy p[data-v-47494ad8]{margin-top:18px;max-width:720px;font-size:18px;line-height:1.8;font-weight:800}.hero-panel[data-v-47494ad8]{position:relative;z-index:1;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:6px 6px 0 var(--ink );padding:22px;display:flex;flex-direction:column;justify-content:center}.hero-panel span[data-v-47494ad8],.hero-panel p[data-v-47494ad8]{font-weight:900}.hero-panel strong[data-v-47494ad8]{font-size:36px;margin:12px 0}.note-toolbar[data-v-47494ad8]{margin-top:28px;padding:18px;display:flex;justify-content:space-between;align-items:center;gap:18px}.mode-tabs[data-v-47494ad8]{display:flex;gap:12px;flex-wrap:wrap}.mode-tabs button[data-v-47494ad8],.ghost-button[data-v-47494ad8],.primary-button[data-v-47494ad8],.inline-field button[data-v-47494ad8],.share-actions button[data-v-47494ad8]{border:3px solid var(--ink );box-shadow:5px 5px 0 var(--ink );min-height:48px;padding:0 16px;font-size:15px;font-weight:1000;cursor:pointer;background:var(--panel );color:var(--ink )}.mode-tabs button.active[data-v-47494ad8],.primary-button[data-v-47494ad8],.inline-field button[data-v-47494ad8]{background:var(--red );color:var(--panel )}button[data-v-47494ad8]:disabled{opacity:.55;cursor:not-allowed}.toolbar-status[data-v-47494ad8]{display:flex;gap:10px;flex-wrap:wrap}.toolbar-status span[data-v-47494ad8]{border:3px solid var(--ink );background:#fff;padding:8px 10px;font-weight:1000}.note-layout[data-v-47494ad8]{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:24px;margin-top:28px;align-items:start}.editor-panel[data-v-47494ad8],.preview-panel[data-v-47494ad8]{padding:28px}.panel-head[data-v-47494ad8]{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}.panel-head span[data-v-47494ad8]{display:block;color:var(--red );font-size:13px;font-weight:1000;letter-spacing:.08em}.panel-head h2[data-v-47494ad8]{margin-top:6px;font-size:clamp(28px,3vw,42px);font-weight:1000;line-height:1.05}.note-textarea[data-v-47494ad8]{width:100%;min-height:330px;resize:vertical;border:3px solid var(--ink );background:#fff;color:var(--ink );padding:18px;box-sizing:border-box;font-size:16px;line-height:1.8;font-weight:800;outline:none}.note-textarea[data-v-47494ad8]:focus,input[data-v-47494ad8]:focus{box-shadow:4px 4px 0 var(--red )}.code-grid[data-v-47494ad8]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}.code-grid label[data-v-47494ad8]{display:grid;gap:8px;font-weight:1000}.inline-field[data-v-47494ad8]{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}.inline-field input[data-v-47494ad8]{width:100%;min-height:50px;border:3px solid var(--ink );background:var(--panel );color:var(--ink );padding:0 14px;font-weight:800;box-sizing:border-box;outline:none}.private-switch[data-v-47494ad8]{border:3px solid var(--ink );background:#fff;padding:14px;display:flex!important;grid-template-columns:auto 1fr!important;align-items:center;gap:12px}.private-switch input[data-v-47494ad8]{width:20px;height:20px;accent-color:var(--red )}.private-switch small[data-v-47494ad8]{display:block;margin-top:5px;font-weight:800}.primary-button[data-v-47494ad8]{width:100%;margin-top:18px}.paper-preview[data-v-47494ad8]{min-height:330px;border:3px solid var(--ink );background:#fff;box-shadow:5px 5px 0 rgba(26,26,29,.18);padding:20px;box-sizing:border-box;white-space:pre-wrap;word-break:break-word;font-size:16px;line-height:1.85;font-weight:800}.paper-preview.empty[data-v-47494ad8]{display:grid;place-items:center;text-align:center;color:rgba(26,26,29,.55)}.share-card[data-v-47494ad8]{margin-top:18px;border:3px solid var(--ink );background:var(--red );color:var(--panel );box-shadow:5px 5px 0 var(--ink );padding:16px}.share-card span[data-v-47494ad8]{font-weight:1000}.share-card strong[data-v-47494ad8]{display:block;margin:8px 0 14px;word-break:break-all}.share-actions[data-v-47494ad8]{display:flex;gap:10px;flex-wrap:wrap}.share-actions button[data-v-47494ad8]{background:var(--panel );color:var(--ink )}.reader-state[data-v-47494ad8]{margin-top:18px;border:3px solid var(--ink );background:#fff;padding:16px;font-weight:1000}.note-toast[data-v-47494ad8]{position:fixed;right:24px;bottom:24px;z-index:30;border:3px solid var(--ink );background:var(--green );color:#fff;box-shadow:6px 6px 0 var(--ink );padding:14px 18px;font-weight:1000}.note-toast.error[data-v-47494ad8]{background:var(--red )}.fade-enter-active[data-v-47494ad8],.fade-leave-active[data-v-47494ad8],.toast-pop-enter-active[data-v-47494ad8],.toast-pop-leave-active[data-v-47494ad8]{transition:.2s}.fade-enter[data-v-47494ad8],.fade-leave-to[data-v-47494ad8],.toast-pop-enter[data-v-47494ad8],.toast-pop-leave-to[data-v-47494ad8]{opacity:0;transform:translateY(8px)}button[data-v-47494ad8]:active:not(:disabled){transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink )}@media(max-width:980px){.note-hero[data-v-47494ad8],.note-layout[data-v-47494ad8]{grid-template-columns:1fr}.preview-panel[data-v-47494ad8]{order:2}.note-toolbar[data-v-47494ad8]{display:grid}.toolbar-status[data-v-47494ad8]{justify-content:flex-start}}@media(max-width:640px){.note-page[data-v-47494ad8]{padding:16px 16px 86px}.note-hero[data-v-47494ad8],.note-toolbar[data-v-47494ad8],.editor-panel[data-v-47494ad8],.preview-panel[data-v-47494ad8]{padding:20px}.hero-copy h1[data-v-47494ad8]{letter-spacing:-2px}.code-grid[data-v-47494ad8],.inline-field[data-v-47494ad8]{grid-template-columns:1fr}.panel-head[data-v-47494ad8]{display:block}.panel-head .ghost-button[data-v-47494ad8]{width:100%;margin-top:14px}.mode-tabs[data-v-47494ad8]{display:grid;grid-template-columns:1fr 1fr}.mobile-hidden[data-v-47494ad8]{display:none!important}.mobile-compact[data-v-47494ad8]{display:block}.note-toast[data-v-47494ad8]{left:16px;right:16px;bottom:16px}} .postal-page[data-v-634a3516]{--page-bg:#F1DDDF;--panel:#FFF9F7;--ink:#1A1A1D;--red:#E72D48;--green:#2FA84F;min-height:100vh;background:var(--page-bg );color:var(--ink );padding:28px 18px 70px;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;overflow-x:hidden}.postal-shell[data-v-634a3516]{width:min(1360px,100%);margin:0 auto}.postal-hero[data-v-634a3516],.postal-panel[data-v-634a3516]{background:var(--panel );border:3px solid var(--ink );box-shadow:8px 8px 0 var(--red );box-sizing:border-box}.postal-hero[data-v-634a3516]{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:stretch;padding:34px;position:relative;overflow:hidden}.postal-hero[data-v-634a3516]::after{content:"";position:absolute;right:26px;bottom:22px;width:126px;height:126px;background-image:radial-gradient(var(--red ) 3px,transparent 3px);background-size:16px 16px;opacity:.12}.eyebrow[data-v-634a3516]{display:inline-flex;padding:8px 14px;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:4px 4px 0 var(--ink );font-weight:1000;transform:rotate(-2deg)}h1[data-v-634a3516],h2[data-v-634a3516],p[data-v-634a3516]{margin:0}.hero-copy h1[data-v-634a3516]{margin-top:18px;font-size:clamp(42px,6vw,80px);line-height:1;font-weight:1000;letter-spacing:-3px}.hero-copy p[data-v-634a3516]{margin-top:18px;max-width:680px;font-size:18px;line-height:1.8;font-weight:800}.hero-card[data-v-634a3516]{position:relative;z-index:1;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:6px 6px 0 var(--ink );padding:22px;display:flex;flex-direction:column;justify-content:center}.hero-card span[data-v-634a3516],.hero-card p[data-v-634a3516]{font-weight:900}.hero-card strong[data-v-634a3516]{display:block;font-size:34px;margin:14px 0;word-break:break-word}.hero-card p[data-v-634a3516]{line-height:1.6}.postal-workbench[data-v-634a3516]{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:28px}.postal-panel[data-v-634a3516]{padding:28px}.panel-head[data-v-634a3516]{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:22px}.panel-head span[data-v-634a3516]{display:block;color:var(--red );font-size:13px;font-weight:1000;letter-spacing:.08em}.panel-head h2[data-v-634a3516]{margin-top:6px;font-size:clamp(28px,3vw,42px);font-weight:1000;line-height:1.05}.ghost-button[data-v-634a3516],.mini-button[data-v-634a3516],.download-action[data-v-634a3516],.result-strip button[data-v-634a3516]{border:3px solid var(--ink );box-shadow:5px 5px 0 var(--ink );background:var(--panel );color:var(--ink );font-weight:1000;cursor:pointer}.ghost-button[data-v-634a3516],.mini-button[data-v-634a3516],.result-strip button[data-v-634a3516]{min-height:46px;padding:0 14px}.field-label[data-v-634a3516]{display:block;font-size:14px;font-weight:1000;margin-bottom:10px}.inline-field[data-v-634a3516]{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px}.smart-input[data-v-634a3516]{width:100%;min-height:54px;border:3px solid var(--ink );background:var(--panel );color:var(--ink );padding:0 16px;box-sizing:border-box;font-size:16px;font-weight:900;outline:none}.smart-input[data-v-634a3516]:focus{box-shadow:4px 4px 0 var(--red )}.field-tip[data-v-634a3516]{margin:12px 0 18px;font-size:14px;line-height:1.6;font-weight:800}.action-area[data-v-634a3516]{margin-top:18px}.custom-upload[data-v-634a3516] .el-upload{width:100%}.custom-upload[data-v-634a3516] .el-upload-dragger{width:100%;height:auto;min-height:220px;border:3px dashed var(--ink );border-radius:0;background:#fff;display:grid;place-items:center;box-sizing:border-box}.drop-inner[data-v-634a3516],.download-action[data-v-634a3516]{display:grid;place-items:center;text-align:center;gap:10px}.icon-badge[data-v-634a3516]{width:58px;height:58px;border:3px solid var(--ink );background:var(--red );color:var(--panel );box-shadow:5px 5px 0 var(--ink );display:grid;place-items:center}.icon-badge svg[data-v-634a3516]{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:2.5}.download-action[data-v-634a3516]{width:100%;min-height:220px;background:#fff;margin-top:18px}.download-action strong[data-v-634a3516],.drop-inner strong[data-v-634a3516]{font-size:22px;font-weight:1000;color:var(--ink )}.download-action small[data-v-634a3516],.drop-inner small[data-v-634a3516]{font-weight:800;color:var(--ink )}.download-action[data-v-634a3516]:disabled,.ghost-button[data-v-634a3516]:disabled,.mini-button[data-v-634a3516]:disabled{opacity:.55;cursor:not-allowed}.result-strip[data-v-634a3516]{margin-top:18px;border:3px solid var(--ink );background:#fff;padding:14px;display:flex;justify-content:space-between;align-items:center;gap:12px;box-shadow:5px 5px 0 rgba(26,26,29,.18)}.result-strip span[data-v-634a3516]{display:block;color:var(--red );font-size:12px;font-weight:1000}.result-strip strong[data-v-634a3516]{display:block;margin-top:4px;font-size:16px;font-weight:1000;word-break:break-word}.result-strip small[data-v-634a3516]{font-weight:800}.postal-toast[data-v-634a3516]{position:fixed;right:24px;bottom:24px;z-index:20;border:3px solid var(--ink );background:var(--green );color:#fff;box-shadow:6px 6px 0 var(--ink );padding:14px 18px;font-weight:1000}.postal-toast.error[data-v-634a3516]{background:var(--red )}.spinner[data-v-634a3516]{animation:spin-634a3516 .8s linear infinite}.spinner circle[data-v-634a3516]{fill:none;stroke:currentColor;stroke-width:5;stroke-dasharray:90;stroke-dashoffset:60}@keyframes spin-634a3516{to{transform:rotate(360deg)}}.toast-pop-enter-active[data-v-634a3516],.toast-pop-leave-active[data-v-634a3516]{transition:.2s}.toast-pop-enter[data-v-634a3516],.toast-pop-leave-to[data-v-634a3516]{opacity:0;transform:translateY(8px)}button[data-v-634a3516]:active:not(:disabled){transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink )}@media(max-width:980px){.postal-hero[data-v-634a3516],.postal-workbench[data-v-634a3516]{grid-template-columns:1fr}}@media(max-width:640px){.postal-page[data-v-634a3516]{padding:16px 16px 86px}.postal-hero[data-v-634a3516],.postal-panel[data-v-634a3516]{padding:20px}.hero-copy h1[data-v-634a3516]{letter-spacing:-2px}.panel-head[data-v-634a3516]{display:block}.panel-head .ghost-button[data-v-634a3516]{width:100%;margin-top:14px}.inline-field[data-v-634a3516]{grid-template-columns:1fr}.ghost-button[data-v-634a3516],.mini-button[data-v-634a3516],.result-strip button[data-v-634a3516]{width:100%}.result-strip[data-v-634a3516]{display:grid}.postal-toast[data-v-634a3516]{left:16px;right:16px;bottom:16px}} .admin-container[data-v-5f3ddd40] { min-height:100vh; background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); color:var(--color-text ); overflow-x:hidden; } .admin-shell[data-v-5f3ddd40] { width:min(1440px,calc(100% - 40px)); margin:0 auto; padding:46px 0 76px; } .page-container[data-v-5f3ddd40] { min-width:0; } .table-wrap[data-v-5f3ddd40] { overflow-x:auto; -webkit-overflow-scrolling:touch; } .admin-header[data-v-5f3ddd40],.admin-content[data-v-5f3ddd40],.module-content[data-v-5f3ddd40] { border:1px solid var(--color-border ); border-radius:8px; box-shadow:0 20px 52px var(--color-shadow ); } .admin-header[data-v-5f3ddd40] { display:grid; grid-template-columns:minmax(180px,240px) minmax(0,1fr) minmax(240px,340px); gap:18px; align-items:stretch; margin-bottom:18px; padding:14px; background:rgba(255,255,255,0.86); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .brand-panel[data-v-5f3ddd40] { display:flex; min-width:0; flex-direction:column; justify-content:space-between; gap:24px; border:0; border-radius:8px; background:var(--gradient-soft ),var(--color-surface ); cursor:pointer; padding:22px; text-align:left; } .brand-panel img[data-v-5f3ddd40] { max-width:min(180px,100%); -o-object-fit:contain; object-fit:contain; transition:transform 0.24s ease; } .brand-panel:hover img[data-v-5f3ddd40] { transform:translateY(-4px); } .brand-panel span[data-v-5f3ddd40] { color:var(--color-text ); font-size:14px; font-weight:900; text-transform:uppercase; } .header-copy[data-v-5f3ddd40] { padding:clamp(28px,4vw,48px); border-radius:8px; background:var(--gradient-soft ); } .eyebrow[data-v-5f3ddd40] { display:inline-flex; padding:8px 12px; border-radius:999px; background:var(--color-button ); color:#ffffff; font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .header-copy h1[data-v-5f3ddd40] { margin:18px 0 12px; font-size:clamp(38px,5vw,72px); line-height:0.98; letter-spacing:0; } .header-copy p[data-v-5f3ddd40] { max-width:620px; margin:0; color:var(--color-text-soft ); font-size:clamp(15px,1.7vw,19px); line-height:1.7; } .header-stats[data-v-5f3ddd40] { display:grid; gap:12px; } .header-stats div[data-v-5f3ddd40] { display:flex; min-width:0; flex-direction:column; justify-content:center; gap:8px; border-radius:8px; background:linear-gradient(135deg,rgba(255,230,82,0.48),rgba(74,217,255,0.3)); padding:20px; } .header-stats strong[data-v-5f3ddd40] { overflow:hidden; color:var(--color-text ); font-size:clamp(22px,3vw,34px); font-weight:900; text-overflow:ellipsis; white-space:nowrap; } .header-stats span[data-v-5f3ddd40] { color:var(--color-text-soft ); font-size:13px; font-weight:800; } .admin-content[data-v-5f3ddd40] { background:rgba(255,255,255,0.86); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); padding:14px; } .menu-grid[data-v-5f3ddd40] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; } .menu-item[data-v-5f3ddd40] { display:flex; min-height:260px; flex-direction:column; justify-content:flex-end; gap:12px; border-radius:8px; cursor:pointer; overflow:hidden; padding:clamp(24px,4vw,44px); position:relative; transition:transform 0.22s ease,box-shadow 0.22s ease; } .menu-item[data-v-5f3ddd40]::after { content:""; position:absolute; right:-40px; top:-54px; width:190px; aspect-ratio:1; border-radius:50%; background:rgba(255,255,255,0.28); } .menu-item[data-v-5f3ddd40]:hover { transform:translateY(-6px); box-shadow:0 26px 60px rgba(53,93,151,0.18); } .menu-item i[data-v-5f3ddd40] { display:grid; width:58px; height:58px; place-items:center; border-radius:8px; background:rgba(255,255,255,0.55); color:var(--color-text ); font-style:normal; } .menu-item.file-item i[data-v-5f3ddd40]::before { content:"F"; font-size:26px; font-weight:900; } .menu-item.database-item i[data-v-5f3ddd40]::before { content:"D"; font-size:26px; font-weight:900; } .menu-item span[data-v-5f3ddd40] { position:relative; z-index:1; color:var(--color-text ); font-size:clamp(28px,4vw,46px); font-weight:900; letter-spacing:0; } .menu-item small[data-v-5f3ddd40] { position:relative; z-index:1; color:rgba(16,24,40,0.68); font-size:15px; font-weight:800; } .menu-item.file-item[data-v-5f3ddd40] { background:var(--gradient-soft ); } .menu-item.database-item[data-v-5f3ddd40] { background:var(--gradient-primary ); } .module-content[data-v-5f3ddd40] { background:var(--color-surface ); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); overflow:hidden; } .file-manager[data-v-5f3ddd40],.database-manager[data-v-5f3ddd40] { display:flex; min-height:540px; } .sidebar[data-v-5f3ddd40] { width:min(360px,34vw); flex:0 0 auto; border-right:1px solid var(--color-border ); background:var(--color-surface ); padding:18px; } .sidebar-header[data-v-5f3ddd40] { margin-bottom:14px; border-radius:8px; background:var(--color-button ); color:#ffffff; cursor:pointer; font-size:20px; font-weight:900; padding:18px; } .sidebar-nav[data-v-5f3ddd40] { display:grid; gap:10px; } .nav-item[data-v-5f3ddd40] { display:flex; align-items:center; gap:10px; border-radius:8px; background:var(--color-surface ); color:#23304a; cursor:pointer; font-weight:850; padding:14px 16px; transition:background 0.2s ease,transform 0.2s ease,color 0.2s ease; } .nav-item[data-v-5f3ddd40]:hover { background:linear-gradient(135deg,rgba(255,221,79,0.55),rgba(47,204,255,0.28)); color:var(--color-text ); transform:translateX(4px); } .nav-item i[data-v-5f3ddd40] { color:var(--color-primary ); font-style:normal; } .nav-submenu[data-v-5f3ddd40] { display:grid; gap:8px; padding:8px 0 0 18px; } .file-content[data-v-5f3ddd40],.db-content[data-v-5f3ddd40] { flex:1 1 auto; min-width:0; padding:18px; } .content-header[data-v-5f3ddd40] { display:flex; justify-content:flex-start; margin-bottom:14px; } .back-btn[data-v-5f3ddd40] { border:0; border-radius:999px; background:var(--color-button ); color:#ffffff; cursor:pointer; font-weight:900; padding:11px 16px; } .file-list[data-v-5f3ddd40],.db-list[data-v-5f3ddd40] { display:grid; gap:12px; } .file-list > .file-item[data-v-5f3ddd40],.db-item[data-v-5f3ddd40] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:center; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); box-shadow:0 14px 28px rgba(59,81,128,0.08); padding:14px; } .file-info[data-v-5f3ddd40] { display:grid; grid-template-columns:56px minmax(0,1fr) auto; gap:12px; align-items:center; min-width:0; } .file-icon[data-v-5f3ddd40] { width:56px; height:56px; border-radius:8px; -o-object-fit:cover; object-fit:cover; background:var(--gradient-soft ); cursor:pointer; } .file-name[data-v-5f3ddd40] { overflow:hidden; color:var(--color-text ); font-size:16px; font-weight:900; text-overflow:ellipsis; white-space:nowrap; } .file-size[data-v-5f3ddd40] { color:var(--color-text-soft ); font-size:13px; font-weight:800; } .file-actions[data-v-5f3ddd40] { display:flex; gap:8px; } .action-btn[data-v-5f3ddd40],.delete-btn[data-v-5f3ddd40] { display:inline-grid; width:38px; height:38px; place-items:center; border:0; border-radius:8px; cursor:pointer; font-weight:900; } .download[data-v-5f3ddd40] { background:var(--color-success ); color:#ffffff; } .delete[data-v-5f3ddd40],.delete-btn[data-v-5f3ddd40] { background:var(--color-danger ); color:#ffffff; } .content-text[data-v-5f3ddd40] { color:#25314a; font-size:15px; font-weight:800; line-height:1.6; } .code-block[data-v-5f3ddd40] { display:flex; align-items:center; gap:10px; justify-content:flex-end; } .code-tag[data-v-5f3ddd40] { border-radius:999px; background:var(--gradient-soft ); color:#008ec5; font-size:12px; font-weight:900; padding:7px 10px; } .code-block code[data-v-5f3ddd40] { max-width:220px; overflow:hidden; color:var(--color-text ); font-weight:900; text-overflow:ellipsis; white-space:nowrap; } .slide-fade-enter-active[data-v-5f3ddd40],.slide-fade-leave-active[data-v-5f3ddd40] { transition:opacity 0.24s ease,transform 0.24s ease; } .slide-fade-enter[data-v-5f3ddd40],.slide-fade-leave-to[data-v-5f3ddd40] { opacity:0; transform:translateY(10px); } @media (min-width:1440px) { .admin-shell[data-v-5f3ddd40] { width:min(1720px,calc(100% - 96px)); } .menu-grid[data-v-5f3ddd40] { grid-template-columns:repeat(2,minmax(420px,1fr)); } } @media (max-width:991px) { .admin-header[data-v-5f3ddd40] { grid-template-columns:1fr; } .header-stats[data-v-5f3ddd40] { grid-template-columns:repeat(2,minmax(0,1fr)); } .sidebar[data-v-5f3ddd40] { width:300px; } } @media (max-width:767px) { .admin-shell[data-v-5f3ddd40] { width:min(100% - 24px,680px); padding-top:28px; } .menu-grid[data-v-5f3ddd40],.header-stats[data-v-5f3ddd40] { grid-template-columns:1fr; } .file-manager[data-v-5f3ddd40],.database-manager[data-v-5f3ddd40] { flex-direction:column; } .sidebar[data-v-5f3ddd40] { width:auto; border-right:0; border-bottom:1px solid var(--color-border ); } .file-list > .file-item[data-v-5f3ddd40],.db-item[data-v-5f3ddd40],.file-info[data-v-5f3ddd40] { grid-template-columns:1fr; } .file-actions[data-v-5f3ddd40],.code-block[data-v-5f3ddd40] { justify-content:flex-start; } .mobile-compact[data-v-5f3ddd40] { font-size:14px; line-height:1.45; -webkit-line-clamp:2; display:-webkit-box; -webkit-box-orient:vertical; overflow:hidden; } } @media (max-width:575px) { .admin-shell[data-v-5f3ddd40] { width:min(100% - 18px,460px); } .admin-header[data-v-5f3ddd40],.admin-content[data-v-5f3ddd40] { padding:10px; } .brand-panel[data-v-5f3ddd40],.header-copy[data-v-5f3ddd40],.menu-item[data-v-5f3ddd40] { padding:20px; } } @media (prefers-reduced-motion:reduce) { *[data-v-5f3ddd40] { animation:none !important; transition:none !important; } } .backoffice-page[data-v-085ec60a] { --ink:var(--color-text ); --muted:var(--color-text-soft ); --line:var(--color-border ); --accent:var(--color-primary ); --accent-2:var(--color-card-topline ); min-height:100vh; color:var(--ink ); background:linear-gradient(135deg,rgba(255,255,255,0.38),transparent 34%),var(--color-bg ); overflow-x:hidden; } .office-topbar[data-v-085ec60a] { position:relative; z-index:20; display:flex; align-items:center; gap:1rem; width:min(100% - 48px,1760px); min-height:clamp(4.4rem,6vw,5.8rem); margin:0 auto; } .back-button[data-v-085ec60a] { display:inline-flex; align-items:center; justify-content:center; width:clamp(2.45rem,3.2vw,3rem); height:clamp(2.45rem,3.2vw,3rem); border:1px solid var(--color-border ); border-radius:999px; background:var(--color-surface ); cursor:pointer; box-shadow:0 16px 46px var(--color-shadow ); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); transition:transform 0.22s ease,background 0.22s ease,box-shadow 0.22s ease; } .back-button span[data-v-085ec60a] { width:0.72rem; height:0.72rem; border-left:2px solid var(--color-text ); border-bottom:2px solid var(--color-text ); transform:rotate(45deg); margin-left:0.25rem; } .back-button[data-v-085ec60a]:hover { transform:translateY(-2px); background:var(--color-surface ); box-shadow:0 22px 58px var(--color-shadow ); } .logo-mark[data-v-085ec60a] { display:block; width:clamp(10rem,12vw,13rem); height:auto; aspect-ratio:304/51; -o-object-fit:contain; object-fit:contain; } .office-hero[data-v-085ec60a] { display:grid; grid-template-columns:minmax(0,1fr) minmax(21rem,0.56fr); gap:clamp(1rem,3vw,3rem); width:min(100% - 48px,1760px); min-height:clamp(340px,45vh,560px); margin:0 auto; padding:clamp(1rem,3.5vw,3.4rem) 0 clamp(1.8rem,4vw,3rem); align-items:end; } .hero-copy[data-v-085ec60a] { min-width:0; text-align:left; padding-bottom:clamp(1rem,2.4vw,2.4rem); } .eyebrow[data-v-085ec60a],.panel-kicker[data-v-085ec60a] { margin:0; color:var(--accent-2 ); font-size:clamp(0.78rem,0.8vw,0.95rem); font-weight:800; text-transform:uppercase; } .hero-copy .eyebrow[data-v-085ec60a] { margin-bottom:1rem; } .hero-copy h1[data-v-085ec60a] { max-width:24ch; margin:0; color:var(--color-text ); font-size:clamp(2.8rem,7vw,7.2rem); line-height:0.98; font-weight:900; letter-spacing:0; overflow-wrap:break-word; } .hero-copy h1 span[data-v-085ec60a] { display:block; } .hero-text[data-v-085ec60a] { max-width:48rem; margin:clamp(1.2rem,3vw,2rem) 0 0; color:#475569; font-size:clamp(1rem,1.35vw,1.3rem); line-height:1.8; overflow-wrap:break-word; } .gold-spotlight[data-v-085ec60a] { min-height:clamp(280px,34vw,460px); border:1px solid var(--color-border ); border-radius:8px; padding:clamp(1.2rem,2vw,2rem); display:flex; flex-direction:column; justify-content:space-between; text-align:left; background:linear-gradient(140deg,rgba(17,24,39,0.96),rgba(36,52,71,0.94)),var(--gradient-soft ); color:#fff; box-shadow:0 28px 80px var(--color-shadow ); } .spotlight-top[data-v-085ec60a],.panel-header[data-v-085ec60a] { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; } .spotlight-top span[data-v-085ec60a] { color:rgba(255,255,255,0.72); font-size:0.9rem; font-weight:800; } .spotlight-top button[data-v-085ec60a],.panel-action[data-v-085ec60a] { min-height:2.4rem; padding:0 0.9rem; border:1px solid rgba(255,255,255,0.16); border-radius:999px; background:rgba(255,255,255,0.12); color:#fff; font-weight:800; cursor:pointer; } .gold-spotlight strong[data-v-085ec60a] { display:block; margin:1.6rem 0 0; font-size:clamp(3.2rem,7vw,7rem); line-height:1.08; letter-spacing:0; } .gold-spotlight p[data-v-085ec60a] { max-width:26rem; margin:1rem 0 0; color:rgba(255,255,255,0.72); line-height:1.7; } .office-shell[data-v-085ec60a] { width:min(100% - 48px,1760px); margin:0 auto; padding:0 0 clamp(3rem,5vw,5.6rem); } .summary-grid[data-v-085ec60a] { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(20rem,0.88fr); gap:clamp(1rem,1.6vw,1.35rem); align-items:stretch; } .panel[data-v-085ec60a],.manage-card[data-v-085ec60a] { border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.74); box-shadow:0 14px 40px var(--color-shadow ); } .panel[data-v-085ec60a] { min-height:26rem; padding:clamp(1rem,1.6vw,1.4rem); overflow:hidden; text-align:left; } .panel-header[data-v-085ec60a] { margin-bottom:1rem; } .panel-header h2[data-v-085ec60a],.section-heading h2[data-v-085ec60a] { margin:0.35rem 0 0; color:var(--ink ); font-size:clamp(1.45rem,1.8vw,2.3rem); line-height:1.16; letter-spacing:0; } .panel-action[data-v-085ec60a] { border-color:var(--color-border ); background:var(--color-button ); color:#fff; } .gold-now[data-v-085ec60a] { margin-top:clamp(2.5rem,6vw,5rem); color:var(--color-primary ); font-size:clamp(4rem,10vw,9rem); font-weight:900; font-style:italic; line-height:1.08; } .gold-today[data-v-085ec60a] { display:grid; grid-template-columns:repeat(auto-fit,minmax(7.2rem,1fr)); gap:0.75rem; } .gold-chip[data-v-085ec60a] { min-height:4.6rem; padding:0.75rem; border:1px solid var(--color-border ); border-radius:8px; background:var(--gradient-soft ); } .gold-chip span[data-v-085ec60a] { display:block; color:var(--color-text-soft ); font-size:0.82rem; font-weight:800; } .gold-chip strong[data-v-085ec60a] { display:block; margin-top:0.4rem; color:var(--color-text ); font-size:1.3rem; } .gold-calendar[data-v-085ec60a] { border:1px solid var(--color-border ); border-radius:8px; overflow:hidden; } .calendar-cell[data-v-085ec60a] { display:flex; min-height:3.2rem; flex-direction:column; justify-content:space-between; gap:0.3rem; } .calendar-cell span[data-v-085ec60a] { color:var(--color-text-soft ); font-size:0.9rem; font-weight:700; } .calendar-cell strong[data-v-085ec60a] { color:#ef4444; font-size:0.82rem; } .weather-list[data-v-085ec60a] { display:grid; gap:0.85rem; } .weather-day[data-v-085ec60a] { padding:1rem; border:1px solid var(--color-border ); border-radius:8px; background:var(--gradient-soft ); } .weather-day.muted[data-v-085ec60a] { background:rgba(255,255,255,0.58); } .weather-title[data-v-085ec60a] { display:flex; align-items:baseline; justify-content:space-between; gap:1rem; margin-bottom:0.55rem; } .weather-title strong[data-v-085ec60a] { color:var(--color-text ); font-size:1.08rem; } .weather-title span[data-v-085ec60a],.weather-day p[data-v-085ec60a] { color:var(--color-text-soft ); } .weather-day p[data-v-085ec60a] { margin:0.22rem 0; line-height:1.55; } .manage-section[data-v-085ec60a] { margin-top:clamp(1.5rem,3vw,2.5rem); } .section-heading[data-v-085ec60a] { text-align:left; margin-bottom:1rem; } .manage-grid[data-v-085ec60a] { display:grid; grid-template-columns:repeat(auto-fit,minmax(18rem,1fr)); gap:clamp(0.9rem,1.5vw,1.35rem); } .manage-card[data-v-085ec60a] { display:grid; grid-template-rows:minmax(12rem,0.84fr) auto; min-height:24rem; overflow:hidden; text-align:left; cursor:pointer; transition:transform 0.24s ease,box-shadow 0.24s ease,border-color 0.24s ease; } .manage-card[data-v-085ec60a]:hover { transform:translateY(-5px); border-color:var(--color-primary ); box-shadow:0 28px 70px var(--color-shadow ); } .card-cover[data-v-085ec60a] { min-height:12rem; background-position:center; background-size:cover; } .card-body[data-v-085ec60a] { min-height:10rem; padding:1rem; } .card-body span[data-v-085ec60a] { display:inline-flex; align-items:center; min-height:1.7rem; padding:0 0.7rem; border-radius:999px; background:var(--gradient-soft ); color:#0f766e; font-size:0.78rem; font-weight:800; } .card-body h3[data-v-085ec60a] { margin:0.9rem 0 0.45rem; color:var(--ink ); font-size:clamp(1.18rem,1.15vw,1.55rem); line-height:1.22; letter-spacing:0; } .card-body p[data-v-085ec60a] { margin:0; color:var(--muted ); font-size:0.95rem; line-height:1.7; } [data-v-085ec60a] .el-calendar { background:rgba(255,255,255,0.78); } [data-v-085ec60a] .el-calendar__header { padding:0.85rem; } [data-v-085ec60a] .el-calendar__body { padding:0; } [data-v-085ec60a] .el-calendar-table .el-calendar-day { height:auto; min-height:4.2rem; padding:0.55rem; } @media (min-width:1440px) { .manage-grid[data-v-085ec60a] { grid-template-columns:repeat(auto-fit,minmax(22rem,1fr)); } .manage-card[data-v-085ec60a] { min-height:27rem; } } @media (max-width:1199px) { .office-hero[data-v-085ec60a],.summary-grid[data-v-085ec60a] { grid-template-columns:1fr; } .hero-copy h1[data-v-085ec60a] { max-width:24ch; } .gold-spotlight[data-v-085ec60a] { min-height:18rem; } } @media (max-width:767px) { .backoffice-page[data-v-085ec60a] { background:linear-gradient(135deg,rgba(255,255,255,0.38),transparent 34%),var(--color-bg ); } .office-topbar[data-v-085ec60a],.office-hero[data-v-085ec60a],.office-shell[data-v-085ec60a] { width:min(100% - 28px,1760px); max-width:calc(100vw - 28px); } .office-topbar[data-v-085ec60a] { min-height:4.2rem; } .logo-mark[data-v-085ec60a] { width:9.2rem; } .office-hero[data-v-085ec60a] { padding-top:1.2rem; gap:1.2rem; } .hero-copy h1[data-v-085ec60a] { max-width:100%; width:100%; font-size:clamp(2rem,9.5vw,2.8rem); line-height:1.08; overflow-wrap:break-word; } .hero-text[data-v-085ec60a] { max-width:calc(100vw - 28px); font-size:1rem; line-height:1.7; overflow-wrap:break-word; } .panel[data-v-085ec60a] { min-height:auto; } .gold-now[data-v-085ec60a] { margin-top:2rem; font-size:clamp(3.2rem,17vw,5.5rem); } .manage-grid[data-v-085ec60a] { grid-template-columns:1fr; } .manage-card[data-v-085ec60a] { min-height:auto; grid-template-columns:8rem minmax(0,1fr); grid-template-rows:auto; } .card-cover[data-v-085ec60a] { min-height:100%; } .card-body[data-v-085ec60a] { min-height:9.2rem; padding:0.9rem; } } @media (max-width:575px) { .office-topbar[data-v-085ec60a],.office-hero[data-v-085ec60a],.office-shell[data-v-085ec60a] { width:min(100% - 20px,1760px); } .manage-card[data-v-085ec60a] { grid-template-columns:6.8rem minmax(0,1fr); } .card-body h3[data-v-085ec60a] { font-size:1.05rem; } .card-body p[data-v-085ec60a],.weather-day p[data-v-085ec60a] { font-size:0.86rem; line-height:1.55; } } .backoffice-page[data-v-085ec60a] { --ink:#1A1A1D; --muted:rgba(26,26,29,0.68); --line:#1A1A1D; --accent:#E72D48; --accent-2:#2FA84F; min-height:100vh; color:var(--ink ); background:radial-gradient(circle at 18px 18px,rgba(26,26,29,0.12) 2px,transparent 2.2px) 0 0/28px 28px,linear-gradient(135deg,rgba(255,249,247,0.65),transparent 42%),#F1DDDF; } .office-topbar[data-v-085ec60a],.office-hero[data-v-085ec60a],.office-shell[data-v-085ec60a] { width:min(100% - 48px,1440px); } .back-button[data-v-085ec60a],.spotlight-top button[data-v-085ec60a],.panel-action[data-v-085ec60a] { border:3px solid #1A1A1D !important; border-radius:999px; background:#FFF9F7 !important; color:#1A1A1D !important; box-shadow:5px 5px 0 #1A1A1D !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; font-weight:900; } .back-button[data-v-085ec60a]:hover,.spotlight-top button[data-v-085ec60a]:hover,.panel-action[data-v-085ec60a]:hover,.manage-card[data-v-085ec60a]:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 #1A1A1D !important; } .logo-mark[data-v-085ec60a] { padding:8px 12px; border:3px solid #1A1A1D; border-radius:18px; background:#FFF9F7; box-shadow:6px 6px 0 #E72D48; } .office-hero[data-v-085ec60a] { grid-template-columns:minmax(0,1.18fr) minmax(320px,0.82fr); gap:22px; align-items:stretch; } .hero-copy[data-v-085ec60a],.gold-spotlight[data-v-085ec60a],.panel[data-v-085ec60a],.manage-section[data-v-085ec60a] { border:3px solid #1A1A1D !important; border-radius:24px !important; background:#FFF9F7 !important; box-shadow:8px 8px 0 #E72D48 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } .hero-copy[data-v-085ec60a] { padding:clamp(24px,4vw,52px); } .eyebrow[data-v-085ec60a],.panel-kicker[data-v-085ec60a] { display:inline-flex; width:-moz-max-content; width:max-content; padding:6px 10px; border:3px solid #1A1A1D; border-radius:999px; background:#E72D48; color:#FFF9F7 !important; font-weight:900; letter-spacing:0; text-transform:none; } .hero-copy h1[data-v-085ec60a],.section-heading h2[data-v-085ec60a],.panel-header h2[data-v-085ec60a] { color:#1A1A1D; letter-spacing:-0.05em; } .hero-text[data-v-085ec60a],.weather-day p[data-v-085ec60a],.card-body p[data-v-085ec60a],.gold-spotlight p[data-v-085ec60a] { color:rgba(26,26,29,.72) !important; } .gold-spotlight[data-v-085ec60a] { background:#E72D48 !important; color:#FFF9F7 !important; box-shadow:8px 8px 0 #1A1A1D !important; } .gold-spotlight strong[data-v-085ec60a] { color:#FFF9F7 !important; text-shadow:3px 3px 0 #1A1A1D; } .gold-spotlight p[data-v-085ec60a] { color:rgba(255,249,247,.88) !important; } .summary-grid[data-v-085ec60a] { grid-template-columns:minmax(0,1.08fr) minmax(300px,.92fr); gap:20px; } .gold-now[data-v-085ec60a] { color:#E72D48 !important; text-shadow:4px 4px 0 rgba(26,26,29,.16); letter-spacing:-0.08em; } .gold-chip[data-v-085ec60a],.weather-day[data-v-085ec60a],.calendar-cell[data-v-085ec60a],.manage-card[data-v-085ec60a] { border:3px solid #1A1A1D !important; border-radius:18px !important; background:#FFF9F7 !important; box-shadow:5px 5px 0 rgba(26,26,29,.92) !important; } .weather-day[data-v-085ec60a]:first-child { background:#E72D48 !important; color:#FFF9F7 !important; } .weather-day:first-child p[data-v-085ec60a],.weather-day:first-child span[data-v-085ec60a] { color:rgba(255,249,247,.9) !important; } .manage-section[data-v-085ec60a] { padding:clamp(18px,3vw,28px); } .manage-grid[data-v-085ec60a] { grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; } .manage-card[data-v-085ec60a] { overflow:hidden; transition:transform .18s ease,box-shadow .18s ease; } .card-cover[data-v-085ec60a] { filter:saturate(1.08) contrast(1.02); } .card-body span[data-v-085ec60a] { display:inline-flex; width:-moz-max-content; width:max-content; max-width:100%; padding:5px 9px; border:2px solid #1A1A1D; border-radius:999px; background:#F1DDDF; color:#1A1A1D !important; font-weight:900; } .card-body h3[data-v-085ec60a] { color:#1A1A1D; } [data-v-085ec60a] .el-calendar,[data-v-085ec60a] .el-calendar__body,[data-v-085ec60a] .el-calendar-table td { background:#FFF9F7 !important; color:#1A1A1D !important; } [data-v-085ec60a] .el-button,[data-v-085ec60a] .el-calendar__button-group button { border:2px solid #1A1A1D !important; background:#FFF9F7 !important; color:#1A1A1D !important; font-weight:900; } @media (max-width:1199px) { .office-hero[data-v-085ec60a],.summary-grid[data-v-085ec60a] { grid-template-columns:1fr; } .gold-spotlight[data-v-085ec60a] { min-height:auto; } } @media (max-width:767px) { .backoffice-page[data-v-085ec60a] { background-size:22px 22px,auto,auto; } .office-topbar[data-v-085ec60a],.office-hero[data-v-085ec60a],.office-shell[data-v-085ec60a] { width:min(100% - 28px,1440px); } .hero-copy[data-v-085ec60a],.gold-spotlight[data-v-085ec60a],.panel[data-v-085ec60a],.manage-section[data-v-085ec60a] { border-width:2px !important; border-radius:18px !important; box-shadow:5px 5px 0 #E72D48 !important; } .gold-spotlight[data-v-085ec60a] { box-shadow:5px 5px 0 #1A1A1D !important; } .manage-card[data-v-085ec60a] { grid-template-columns:92px minmax(0,1fr); border-width:2px !important; box-shadow:4px 4px 0 #1A1A1D !important; } .card-body[data-v-085ec60a] { min-width:0; } .card-body p[data-v-085ec60a] { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } } @media (max-width:480px) { .office-topbar[data-v-085ec60a],.office-hero[data-v-085ec60a],.office-shell[data-v-085ec60a] { width:min(100% - 20px,1440px); } .manage-card[data-v-085ec60a] { grid-template-columns:1fr; } .card-cover[data-v-085ec60a] { min-height:120px; } .mobile-hidden[data-v-085ec60a] { display:none !important; } } #calculator[data-v-5721b1fb] { margin-top:50px; flex:99; width:100%; height:90vh; display:flex; flex-direction:column; justify-content:center; align-items:center; background-color:rgba(134,189,153,0.23); } .display[data-v-5721b1fb] { font-size:40px; margin-bottom:20px; padding:30px 15px; background-color:#fff; border:2px solid #ccc; border-radius:10px; width:93%; text-align:end; overflow:hidden; } .buttons[data-v-5721b1fb] { display:grid; grid-template-columns:repeat(4,1fr); gap:15px; width:95%; } .button[data-v-5721b1fb] { font-size:30px; padding:35px 20px; border:none; border-radius:10px; background-color:#e0e0e0; cursor:pointer; transition:background-color 0.3s ease; } .double[data-v-5721b1fb] { grid-column:span 2; } .clear-btn[data-v-5721b1fb] { background-color:#ff6347; color:#fff; } .operator-btn[data-v-5721b1fb] { background-color:#6a5acd; color:#fff; } .equal-btn[data-v-5721b1fb] { background-color:#32cd32; color:#fff; } .button[data-v-5721b1fb]:hover { background-color:#ccc; transform:scale(1.05); } .return-button[data-v-25e374e3] { border-radius:5px; padding:2px; top:5px; left:5px; z-index:999; cursor:pointer; } .return-button img[data-v-25e374e3]{ opacity:0.5; height:3vh; position:fixed; right:1px; top:60vh; cursor:pointer; } .return-button img[data-v-25e374e3]:hover{ opacity:1; scale:0.9; } .todo-container[data-v-2d6a4f5f] { min-height:100vh; width:100%; padding:28px 18px 72px; box-sizing:border-box; background:#F1DDDF; color:#1A1A1D; overflow-x:hidden; background-image:radial-gradient(#1A1A1D 1.1px,transparent 1.1px); background-size:24px 24px; position:relative; } .image-repeater[data-v-2d6a4f5f] { position:fixed; inset:0; pointer-events:none; opacity:.18; background:linear-gradient(135deg,transparent 0 45%,rgba(231,45,72,.25) 45% 55%,transparent 55% 100%); background-size:52px 52px; } .title[data-v-2d6a4f5f] { width:min(920px,calc(100% - 10px)); margin:18px auto 18px; padding:18px 22px; box-sizing:border-box; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #1A1A1D; font-size:clamp(34px,6vw,72px); line-height:1; font-weight:1000; letter-spacing:-2px; text-align:left; position:relative; z-index:1; } .create-button[data-v-2d6a4f5f] { position:fixed; right:28px; bottom:28px; z-index:20; width:64px; height:64px; display:flex; align-items:center; justify-content:center; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:6px 6px 0 #1A1A1D; border-radius:0; font-size:42px; line-height:1; font-weight:1000; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease; } .create-button[data-v-2d6a4f5f]:hover { transform:translate(-3px,-3px); box-shadow:9px 9px 0 #1A1A1D; } .create-button[data-v-2d6a4f5f]:active { transform:translate(3px,3px); box-shadow:3px 3px 0 #1A1A1D; } .search[data-v-2d6a4f5f] { width:min(920px,calc(100% - 10px)); margin:0 auto 18px; display:flex; gap:12px; flex-wrap:wrap; align-items:center; padding:16px; box-sizing:border-box; background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; position:relative; z-index:1; } .search > div[data-v-2d6a4f5f] { display:flex; align-items:center; gap:8px; color:#1A1A1D; font-weight:900; } .search label[data-v-2d6a4f5f] { font-weight:900; } .search input[data-v-2d6a4f5f],.search select[data-v-2d6a4f5f],.addPage input[data-v-2d6a4f5f],.addPage textarea[data-v-2d6a4f5f],.todoInfo textarea[data-v-2d6a4f5f] { background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; outline:none; min-height:40px; padding:8px 10px; box-sizing:border-box; font-weight:800; font-size:15px; transition:box-shadow .16s ease,transform .16s ease; } .search input[data-v-2d6a4f5f]:focus,.search select[data-v-2d6a4f5f]:focus,.addPage input[data-v-2d6a4f5f]:focus,.addPage textarea[data-v-2d6a4f5f]:focus,.todoInfo textarea[data-v-2d6a4f5f]:focus { box-shadow:4px 4px 0 #E72D48; transform:translate(-2px,-2px); } .toDoList[data-v-2d6a4f5f] { width:min(920px,calc(100% - 10px)); margin:0 auto; display:flex; flex-direction:column; gap:12px; position:relative; z-index:1; } .todoInfo[data-v-2d6a4f5f] { display:grid; grid-template-columns:42px minmax(0,1fr); gap:12px; align-items:start; padding:14px; background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:6px 6px 0 #E72D48; color:#1A1A1D; font-weight:900; line-height:1.6; transition:transform .16s ease,box-shadow .16s ease; } .todoInfo[data-v-2d6a4f5f]:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 #1A1A1D; } .checkBox[data-v-2d6a4f5f] { width:36px; height:36px; border:3px solid #1A1A1D; background:#F1DDDF; display:flex; align-items:center; justify-content:center; font-size:20px; cursor:pointer; box-shadow:3px 3px 0 #1A1A1D; -webkit-user-select:none; -moz-user-select:none; user-select:none; } .checkBox[data-v-2d6a4f5f]:not(:empty) { background:#2FA84F; color:#FFF9F7; } .todo-meta[data-v-2d6a4f5f],.meta-info[data-v-2d6a4f5f] { color:rgba(26,26,29,.65); font-size:13px; font-weight:800; } .addPage[data-v-2d6a4f5f] { width:min(720px,calc(100% - 10px)); margin:28px auto 0; padding:20px; box-sizing:border-box; background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; position:relative; z-index:1; } .addPageLine[data-v-2d6a4f5f],.addPageAuthor[data-v-2d6a4f5f],.addPageInfo[data-v-2d6a4f5f] { margin-bottom:14px; color:#1A1A1D; font-weight:900; } .addPage input[data-v-2d6a4f5f],.addPage textarea[data-v-2d6a4f5f] { width:100%; margin-top:8px; } .addPage textarea[data-v-2d6a4f5f],.textareaPlace[data-v-2d6a4f5f] { min-height:160px; resize:vertical; } .addPageConfirm[data-v-2d6a4f5f],.addPageCancel[data-v-2d6a4f5f] { display:inline-flex; align-items:center; justify-content:center; margin-right:10px; padding:10px 18px; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; font-weight:1000; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease; } .addPageCancel[data-v-2d6a4f5f] { background:#FFF9F7; color:#1A1A1D; box-shadow:5px 5px 0 #E72D48; } .addPageConfirm[data-v-2d6a4f5f]:hover,.addPageCancel[data-v-2d6a4f5f]:hover { transform:translate(-2px,-2px); } .addPageConfirm[data-v-2d6a4f5f]:active,.addPageCancel[data-v-2d6a4f5f]:active { transform:translate(3px,3px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:720px) { .todo-container[data-v-2d6a4f5f] { padding:16px 16px 72px; } .title[data-v-2d6a4f5f],.search[data-v-2d6a4f5f],.toDoList[data-v-2d6a4f5f],.addPage[data-v-2d6a4f5f] { width:100%; } .search[data-v-2d6a4f5f] { display:grid; grid-template-columns:1fr; } .search > div[data-v-2d6a4f5f] { width:100%; align-items:flex-start; flex-direction:column; } .search input[data-v-2d6a4f5f],.search select[data-v-2d6a4f5f] { width:100%; } .todoInfo[data-v-2d6a4f5f] { grid-template-columns:38px minmax(0,1fr); box-shadow:5px 5px 0 #E72D48; } .create-button[data-v-2d6a4f5f] { right:18px; bottom:18px; } } *[data-v-2d6a4f5f],*[data-v-2d6a4f5f]::before,*[data-v-2d6a4f5f]::after { box-sizing:border-box; } button[data-v-2d6a4f5f],input[data-v-2d6a4f5f],textarea[data-v-2d6a4f5f],select[data-v-2d6a4f5f] { max-width:100%; font:inherit; } button[data-v-2d6a4f5f] { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; } img[data-v-2d6a4f5f],svg[data-v-2d6a4f5f],canvas[data-v-2d6a4f5f] { max-width:100%; height:auto; } @media (hover:hover) and (pointer:fine) { button[data-v-2d6a4f5f]:not(:disabled):hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } } button[data-v-2d6a4f5f]:not(:disabled):active { transform:translate(2px,2px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { h1[data-v-2d6a4f5f],h2[data-v-2d6a4f5f],h3[data-v-2d6a4f5f],p[data-v-2d6a4f5f],strong[data-v-2d6a4f5f],span[data-v-2d6a4f5f],small[data-v-2d6a4f5f],label[data-v-2d6a4f5f],button[data-v-2d6a4f5f],input[data-v-2d6a4f5f],textarea[data-v-2d6a4f5f] { overflow-wrap:break-word; } button[data-v-2d6a4f5f],input[data-v-2d6a4f5f],textarea[data-v-2d6a4f5f],select[data-v-2d6a4f5f] { min-height:44px; } } .toDoList[data-v-2d6a4f5f],.todo-container[data-v-2d6a4f5f],.todoInfo[data-v-2d6a4f5f],.addPage[data-v-2d6a4f5f] { min-width:0; max-width:100%; } .todoInfo[data-v-2d6a4f5f] { width:100%; } .addPageInfo textarea[data-v-2d6a4f5f] { width:100%; min-width:0; } @media (max-width:760px) { .toDoList[data-v-2d6a4f5f] { padding:16px 16px 40px !important; } .todo-container[data-v-2d6a4f5f],.addPage[data-v-2d6a4f5f] { padding:16px !important; box-shadow:5px 5px 0 #E72D48 !important; } .search[data-v-2d6a4f5f] { grid-template-columns:minmax(0,1fr) !important; } .todoInfo[data-v-2d6a4f5f] { grid-template-columns:38px minmax(0,1fr) !important; gap:10px !important; } .create-button[data-v-2d6a4f5f],.addPageConfirm[data-v-2d6a4f5f],.addPageCancel[data-v-2d6a4f5f] { width:100%; } .addPageLine[data-v-2d6a4f5f] { flex-direction:column; align-items:stretch; } } .ancient-scroll[data-v-64e03bde] { min-height:100vh; background:#f5e6d3; background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><rect width="100" height="100" fill="none" stroke="rgba%28139,69,19,0.1%29" stroke-width="2"/><text x="50" y="50" font-size="40" text-anchor="middle" dy=".35em" fill="rgba%28139,69,19,0.05%29">%E7%8E%8B</text></svg>'); background-size:100px 100px; padding:2rem; font-family:"楷体","KaiTi",serif; position:relative; } .scroll-header[data-v-64e03bde] { display:flex; justify-content:center; align-items:center; margin-bottom:3rem; position:relative; } .dragon-left[data-v-64e03bde],.dragon-right[data-v-64e03bde] { width:120px; height:80px; background-size:contain; background-repeat:no-repeat; position:absolute; opacity:0.8; transition: 0.5s ease; } .dragon-left[data-v-64e03bde]:hover,.dragon-right[data-v-64e03bde]:hover { opacity:1; transform:scale(1.2); filter:drop-shadow(0 0 10px rgba(139,69,19,0.3)); } .dragon-left[data-v-64e03bde] { left:0; transform:scaleX(-1); background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 50"><path d="M10,25 C20,15 30,20 40,25 S60,30 70,25 S90,20 95,25" stroke="rgb%28160,82,45%29" fill="none" stroke-width="3"/></svg>'); } .dragon-right[data-v-64e03bde] { right:0; background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 50"><path d="M10,25 C20,15 30,20 40,25 S60,30 70,25 S90,20 95,25" stroke="rgb%28160,82,45%29" fill="none" stroke-width="3"/></svg>'); } .scroll-title[data-v-64e03bde] { font-size:3.5rem; color:#8B4513; text-shadow:3px 3px 6px rgba(0,0,0,0.2); margin:0 60px; writing-mode:vertical-lr; letter-spacing:0.8em; background:linear-gradient(to bottom,#8B4513,#A0522D); -webkit-background-clip:text; -webkit-text-fill-color:transparent; animation:titleGlow-64e03bde 3s ease-in-out infinite alternate; } @keyframes titleGlow-64e03bde { from { text-shadow:0 0 10px rgba(139,69,19,0.5); } to { text-shadow:0 0 20px rgba(139,69,19,0.8),0 0 30px rgba(139,69,19,0.4); } } .wisdom-list[data-v-64e03bde] { max-width:900px; margin:0 auto; position:relative; } .wisdom-item[data-v-64e03bde] { background:rgba(255,250,245,0.95); margin:2.5rem 0; padding:2.5rem; border-radius:15px; box-shadow:0 10px 30px rgba(139,69,19,0.15); position:relative; transition: 0.6s cubic-bezier(0.4,0,0.2,1); border:2px solid rgba(139,69,19,0.1); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); } .wisdom-item[data-v-64e03bde]:hover { transform:translateY(-12px) rotate(0.8deg); box-shadow:0 20px 40px rgba(139,69,19,0.25); background:rgba(255,250,245,1); } .wisdom-text[data-v-64e03bde] { position:relative; padding:1.5rem; background:rgba(255,255,255,0.5); border-radius:10px; } .calligraphy[data-v-64e03bde] { font-size:1.8rem; line-height:2; color:#4a3728; text-align:center; position:relative; z-index:1; transition: 0.4s ease; text-shadow:1px 1px 2px rgba(0,0,0,0.1); } .wisdom-item:hover .calligraphy[data-v-64e03bde] { transform:scale(1.05); color:#2c1810; } .ink-drops[data-v-64e03bde] { position:absolute; top:-15px; right:-15px; width:60px; height:60px; background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><circle cx="50" cy="50" r="45" fill="rgba%28139,69,19,0.1%29"/></svg>'); background-size:contain; transform:rotate(-15deg); transition:transform 0.4s ease; } .wisdom-item:hover .ink-drops[data-v-64e03bde] { transform:rotate(-30deg) scale(1.2); } .seal-mark[data-v-64e03bde] { position:absolute; bottom:-25px; right:-25px; width:70px; height:70px; background:rgba(255,0,0,0.1); border-radius:50%; transform:rotate(15deg); transition: 0.4s ease; } .wisdom-item:hover .seal-mark[data-v-64e03bde] { transform:rotate(30deg) scale(1.2); background:rgba(255,0,0,0.15); } .chinese-patterns[data-v-64e03bde] { position:absolute; width:40px; height:100%; top:0; background-image:url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 100"><path d="M10,10 L10,90 M5,50 L15,50" stroke="rgba%28139,69,19,0.2%29" stroke-width="1.5" stroke-dasharray="8,8"/></svg>'); background-repeat:repeat-y; opacity:0.7; transition:opacity 0.4s ease; } .wisdom-item:hover .chinese-patterns[data-v-64e03bde] { opacity:1; } .chinese-patterns.left[data-v-64e03bde] { left:10px; } .chinese-patterns.right[data-v-64e03bde] { right:10px; } .add-wisdom[data-v-64e03bde] { max-width:700px; margin:4rem auto; position:relative; } .brush-container[data-v-64e03bde] { position:relative; margin-bottom:2.5rem; } .ink-brush[data-v-64e03bde] { position:absolute; top:-35px; left:-45px; width:35px; height:90px; background:linear-gradient(to bottom,#1a1a1a,#333333); transform:rotate(-45deg); transition: 0.5s cubic-bezier(0.4,0,0.2,1); border-radius:3px; box-shadow:2px 2px 5px rgba(0,0,0,0.2); } .wisdom-input[data-v-64e03bde] { width:100%; padding:1.5rem; background:rgba(255,255,255,0.95); border:none; border-bottom:3px solid #8B4513; font-size:1.4rem; font-family:inherit; transition: 0.5s cubic-bezier(0.4,0,0.2,1); border-radius:12px; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 5px 15px rgba(139,69,19,0.1); } .wisdom-input[data-v-64e03bde]:focus { outline:none; background:#fff; box-shadow:0 10px 35px rgba(139,69,19,0.2); border-bottom-width:4px; } .writing .ink-brush[data-v-64e03bde] { transform:rotate(-35deg) translateY(-15px); background:linear-gradient(to bottom,#000000,#1a1a1a); } .ink-splash[data-v-64e03bde] { position:absolute; bottom:-25px; right:-25px; width:50px; height:50px; background:rgba(139,69,19,0.1); border-radius:50%; transform:scale(0); transition: 0.5s cubic-bezier(0.4,0,0.2,1); } .ink-splash.active[data-v-64e03bde] { transform:scale(1.2) rotate(-20deg); } .loading-container[data-v-64e03bde] { display:flex; justify-content:center; align-items:center; margin:4rem 0; min-height:120px; } .loading-scroll[data-v-64e03bde] { position:relative; width:70px; height:70px; } .scroll-roller[data-v-64e03bde] { width:100%; height:100%; border:5px solid rgba(139,69,19,0.15); border-top-color:#8B4513; border-radius:50%; animation:spin-64e03bde 1.5s cubic-bezier(0.5,0,0.5,1) infinite; } .loading-text[data-v-64e03bde] { position:absolute; width:150px; text-align:center; top:100%; left:50%; transform:translateX(-50%); margin-top:1.5rem; color:#8B4513; font-size:1.1rem; animation:pulse-64e03bde 2s ease-in-out infinite; } .scroll-footer[data-v-64e03bde] { text-align:center; margin-top:5rem; padding:2.5rem; position:relative; } .chinese-border[data-v-64e03bde] { position:absolute; top:0; left:50%; transform:translateX(-50%); width:250px; height:3px; background:rgba(139,69,19,0.2); } .signature[data-v-64e03bde] { position:relative; display:inline-block; padding:1.5rem 3.5rem; } .signature-text[data-v-64e03bde] { font-size:1.3rem; color:#8B4513; letter-spacing:0.3em; text-shadow:1px 1px 2px rgba(0,0,0,0.1); } .red-seal[data-v-64e03bde] { position:absolute; right:-25px; bottom:-15px; width:50px; height:50px; background:rgba(255,0,0,0.1); border-radius:8px; transform:rotate(15deg); transition:transform 0.4s ease; } .signature:hover .red-seal[data-v-64e03bde] { transform:rotate(30deg) scale(1.2); } @keyframes spin-64e03bde { to { transform:rotate(360deg); } } @keyframes pulse-64e03bde { 50% { opacity:0.6; } } .fade-enter-active[data-v-64e03bde],.fade-leave-active[data-v-64e03bde] { transition: 1s cubic-bezier(0.4,0,0.2,1); } .fade-enter[data-v-64e03bde],.fade-leave-to[data-v-64e03bde] { opacity:0; transform:translateY(50px) scale(0.95); } @media (max-width:575px) { .ancient-scroll[data-v-64e03bde] { padding:1rem; } .scroll-title[data-v-64e03bde] { font-size:2.5rem; } .wisdom-item[data-v-64e03bde] { padding:1.5rem; margin:2rem 0; } .calligraphy[data-v-64e03bde] { font-size:1.4rem; } .chinese-patterns[data-v-64e03bde] { width:20px; } .ink-brush[data-v-64e03bde] { transform:scale(0.8); } } @media (min-width:1200px) { .wisdom-item[data-v-64e03bde] { transition: 0.7s cubic-bezier(0.4,0,0.2,1); } .wisdom-item[data-v-64e03bde]:hover { transform:translateY(-15px) rotate(1deg); } } @media (prefers-reduced-motion:reduce) { .wisdom-item[data-v-64e03bde],.fade-enter-active[data-v-64e03bde],.fade-leave-active[data-v-64e03bde],.scroll-roller[data-v-64e03bde],.loading-text[data-v-64e03bde] { animation:none; transition:opacity 0.4s ease-in-out; } } .page-shell[data-v-f44a8624],.bill-page[data-v-f44a8624] { min-height:100vh; width:100%; box-sizing:border-box; padding:28px 20px 56px; background:#F1DDDF; color:#1A1A1D; overflow-x:hidden; background-image:radial-gradient(#1A1A1D 1.1px,transparent 1.1px); background-size:24px 24px; } .page-container[data-v-f44a8624],.bill-shell[data-v-f44a8624],.bill-hero[data-v-f44a8624],.summary-grid[data-v-f44a8624] { width:min(1320px,100%); margin-left:auto; margin-right:auto; } .bill-hero[data-v-f44a8624] { display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:22px; align-items:stretch; margin-bottom:22px; } .hero-copy[data-v-f44a8624],.author-card[data-v-f44a8624],.summary-grid article[data-v-f44a8624],.bill-editor[data-v-f44a8624],.bill-table-panel[data-v-f44a8624],.preview-card[data-v-f44a8624],.empty-state[data-v-f44a8624],.bill-row[data-v-f44a8624] { background:#FFF9F7; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; color:#1A1A1D; } .hero-copy[data-v-f44a8624],.author-card[data-v-f44a8624],.bill-editor[data-v-f44a8624],.bill-table-panel[data-v-f44a8624] { padding:22px; } .eyebrow[data-v-f44a8624],.panel-head span[data-v-f44a8624] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:6px 10px; margin-bottom:12px; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:4px 4px 0 #1A1A1D; font-size:12px; font-weight:1000; letter-spacing:.08em; text-transform:uppercase; } .hero-copy h1[data-v-f44a8624] { margin:0 0 10px; font-size:clamp(42px,6vw,82px); line-height:.95; font-weight:1000; letter-spacing:-2px; } .hero-copy p[data-v-f44a8624],.author-card small[data-v-f44a8624] { margin:0; color:rgba(26,26,29,.75); font-size:16px; line-height:1.75; font-weight:700; } .author-card label[data-v-f44a8624],.bill-form label span[data-v-f44a8624],.search-box span[data-v-f44a8624],.panel-head h2[data-v-f44a8624] { color:#1A1A1D; font-weight:1000; } .author-input-wrap[data-v-f44a8624],.search-box[data-v-f44a8624] { display:flex; gap:10px; align-items:center; margin:10px 0; } input[data-v-f44a8624] { background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; outline:none; min-height:46px; padding:0 12px; box-sizing:border-box; font-weight:800; } input[data-v-f44a8624]:focus,.input-focus input[data-v-f44a8624] { box-shadow:4px 4px 0 #E72D48; } .author-input-wrap input[data-v-f44a8624],.search-box input[data-v-f44a8624] { flex:1; min-width:0; } button[data-v-f44a8624] { background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #1A1A1D; padding:10px 14px; font-weight:1000; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease; } button[data-v-f44a8624]:hover:not(:disabled) { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } button[data-v-f44a8624]:active:not(:disabled) { transform:translate(3px,3px); box-shadow:2px 2px 0 #1A1A1D; } button[data-v-f44a8624]:disabled { opacity:.55; cursor:not-allowed; } button.ghost[data-v-f44a8624],.ghost[data-v-f44a8624] { background:#FFF9F7; color:#1A1A1D; box-shadow:5px 5px 0 #E72D48; } .summary-grid[data-v-f44a8624] { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; } .summary-grid article[data-v-f44a8624] { padding:16px; box-shadow:6px 6px 0 #E72D48; } .summary-grid span[data-v-f44a8624],.summary-grid small[data-v-f44a8624] { display:block; color:rgba(26,26,29,.65); font-weight:900; } .summary-grid strong[data-v-f44a8624] { display:block; margin:8px 0; color:#E72D48; font-size:30px; line-height:1; font-weight:1000; } .summary-grid strong.good[data-v-f44a8624],.summary-grid strong.positive[data-v-f44a8624],.positive[data-v-f44a8624],.good[data-v-f44a8624] { color:#2FA84F !important; } .summary-grid strong.bad[data-v-f44a8624],.negative[data-v-f44a8624],.bad[data-v-f44a8624] { color:#E72D48 !important; } .bill-shell[data-v-f44a8624] { display:grid; grid-template-columns:360px minmax(0,1fr); gap:22px; align-items:start; } .bill-form[data-v-f44a8624] { display:flex; flex-direction:column; gap:14px; } .bill-form label[data-v-f44a8624] { display:flex; flex-direction:column; gap:8px; } .form-grid[data-v-f44a8624] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .preview-card[data-v-f44a8624] { padding:14px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; background:#F1DDDF; box-shadow:5px 5px 0 #1A1A1D; } .preview-card div[data-v-f44a8624] { background:#FFF9F7; border:3px solid #1A1A1D; padding:10px; } .preview-card span[data-v-f44a8624] { color:rgba(26,26,29,.65); font-weight:900; } .preview-card strong[data-v-f44a8624] { display:block; margin-top:5px; color:#E72D48; font-weight:1000; } .form-actions[data-v-f44a8624],.toolbar[data-v-f44a8624] { display:flex; gap:10px; flex-wrap:wrap; align-items:center; } .table-toolbar[data-v-f44a8624] { display:flex; justify-content:space-between; gap:14px; align-items:center; margin-bottom:16px; } .table-wrap[data-v-f44a8624] { width:100%; overflow-x:auto; padding-bottom:8px; } table[data-v-f44a8624] { width:100%; border-collapse:separate; border-spacing:0 10px; color:#1A1A1D; } th[data-v-f44a8624] { text-align:left; padding:8px 10px; color:#1A1A1D; font-weight:1000; border-bottom:3px solid #1A1A1D; white-space:nowrap; } td[data-v-f44a8624] { padding:12px 10px; background:#FFF9F7; border-top:3px solid #1A1A1D; border-bottom:3px solid #1A1A1D; font-weight:800; vertical-align:middle; } td[data-v-f44a8624]:first-child { border-left:3px solid #1A1A1D; } td[data-v-f44a8624]:last-child { border-right:3px solid #1A1A1D; } .name-cell[data-v-f44a8624] { font-weight:1000; color:#1A1A1D; } .mobile-compact[data-v-f44a8624],.mobile-hidden[data-v-f44a8624] { white-space:nowrap; } .empty-state[data-v-f44a8624] { padding:28px; text-align:center; font-weight:900; } @media (max-width:1100px) { .bill-hero[data-v-f44a8624],.bill-shell[data-v-f44a8624] { grid-template-columns:1fr; } .summary-grid[data-v-f44a8624] { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:720px) { .page-shell[data-v-f44a8624],.bill-page[data-v-f44a8624] { padding:16px 16px 44px; } .hero-copy[data-v-f44a8624],.author-card[data-v-f44a8624],.bill-editor[data-v-f44a8624],.bill-table-panel[data-v-f44a8624] { padding:16px; } .summary-grid[data-v-f44a8624],.form-grid[data-v-f44a8624],.preview-card[data-v-f44a8624] { grid-template-columns:1fr; } .author-input-wrap[data-v-f44a8624],.table-toolbar[data-v-f44a8624] { flex-direction:column; align-items:stretch; } .mobile-hidden[data-v-f44a8624] { display:none; } input[data-v-f44a8624],button[data-v-f44a8624] { width:100%; } .table-wrap[data-v-f44a8624] { overflow-x:auto; } } *[data-v-f44a8624],*[data-v-f44a8624]::before,*[data-v-f44a8624]::after { box-sizing:border-box; } button[data-v-f44a8624],input[data-v-f44a8624],textarea[data-v-f44a8624],select[data-v-f44a8624] { max-width:100%; font:inherit; } button[data-v-f44a8624] { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; } img[data-v-f44a8624],svg[data-v-f44a8624],canvas[data-v-f44a8624] { max-width:100%; height:auto; } @media (hover:hover) and (pointer:fine) { button[data-v-f44a8624]:not(:disabled):hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } } button[data-v-f44a8624]:not(:disabled):active { transform:translate(2px,2px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { h1[data-v-f44a8624],h2[data-v-f44a8624],h3[data-v-f44a8624],p[data-v-f44a8624],strong[data-v-f44a8624],span[data-v-f44a8624],small[data-v-f44a8624],label[data-v-f44a8624],button[data-v-f44a8624],input[data-v-f44a8624],textarea[data-v-f44a8624] { overflow-wrap:break-word; } button[data-v-f44a8624],input[data-v-f44a8624],textarea[data-v-f44a8624],select[data-v-f44a8624] { min-height:44px; } } .page-container[data-v-f44a8624],.bill-hero[data-v-f44a8624],.summary-grid[data-v-f44a8624],.bill-shell[data-v-f44a8624],.form-grid[data-v-f44a8624],.preview-card[data-v-f44a8624],.bill-editor[data-v-f44a8624],.bill-table-panel[data-v-f44a8624],.author-card[data-v-f44a8624] { min-width:0; max-width:100%; } .table-wrap[data-v-f44a8624] { width:100%; max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; } table[data-v-f44a8624] { max-width:100%; } @media (max-width:1180px) { .bill-hero[data-v-f44a8624],.bill-shell[data-v-f44a8624] { grid-template-columns:minmax(0,1fr) !important; } .summary-grid[data-v-f44a8624] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; } } @media (max-width:760px) { .page-shell[data-v-f44a8624],.bill-page[data-v-f44a8624] { padding:16px 16px 40px !important; } .page-container[data-v-f44a8624] { width:100% !important; } .hero-copy[data-v-f44a8624],.author-card[data-v-f44a8624],.bill-editor[data-v-f44a8624],.bill-table-panel[data-v-f44a8624],.summary-grid article[data-v-f44a8624] { padding:16px !important; box-shadow:5px 5px 0 #E72D48 !important; } .summary-grid[data-v-f44a8624],.form-grid[data-v-f44a8624],.preview-card[data-v-f44a8624] { grid-template-columns:minmax(0,1fr) !important; } .author-input-wrap[data-v-f44a8624],.table-toolbar[data-v-f44a8624],.form-actions[data-v-f44a8624],.toolbar[data-v-f44a8624] { flex-direction:column !important; align-items:stretch !important; } .author-input-wrap input[data-v-f44a8624],.search-box input[data-v-f44a8624],.form-grid input[data-v-f44a8624],.form-grid select[data-v-f44a8624],.form-grid textarea[data-v-f44a8624],.form-actions button[data-v-f44a8624],.toolbar button[data-v-f44a8624],.table-toolbar button[data-v-f44a8624] { width:100%; min-width:0; } .mobile-hidden[data-v-f44a8624] { display:none !important; } .mobile-compact[data-v-f44a8624] { white-space:normal !important; } th[data-v-f44a8624],td[data-v-f44a8624] { padding:8px 8px !important; } } .page-shell[data-v-0d895394],.copy-page[data-v-0d895394] { min-height:100vh; width:100%; box-sizing:border-box; padding:28px 20px 56px; background:#F1DDDF; color:#1A1A1D; overflow-x:hidden; background-image:radial-gradient(#1A1A1D 1.1px,transparent 1.1px); background-size:24px 24px; } .page-container[data-v-0d895394],.copy-shell[data-v-0d895394] { width:min(1320px,100%); margin:0 auto; } .copy-hero[data-v-0d895394] { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:22px; align-items:stretch; margin-bottom:22px; } .hero-panel[data-v-0d895394],.space-panel[data-v-0d895394],.stats-strip article[data-v-0d895394],.toolbar-panel[data-v-0d895394],.library-panel[data-v-0d895394],.recent-panel[data-v-0d895394],.composer-panel[data-v-0d895394],.copy-card[data-v-0d895394],.empty-state[data-v-0d895394] { background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; box-shadow:8px 8px 0 #E72D48; } .hero-panel[data-v-0d895394],.space-panel[data-v-0d895394],.toolbar-panel[data-v-0d895394],.library-panel[data-v-0d895394],.recent-panel[data-v-0d895394],.composer-panel[data-v-0d895394] { padding:22px; } .eyebrow[data-v-0d895394],.panel-kicker[data-v-0d895394],.section-head span[data-v-0d895394],.side-label[data-v-0d895394] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:6px 10px; margin-bottom:12px; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:4px 4px 0 #1A1A1D; font-size:12px; font-weight:1000; letter-spacing:.08em; text-transform:uppercase; } .hero-panel h1[data-v-0d895394] { margin:0 0 10px; font-size:clamp(42px,6vw,82px); line-height:.95; font-weight:1000; letter-spacing:-2px; } .hero-panel p[data-v-0d895394],.space-panel p[data-v-0d895394] { margin:0; color:rgba(26,26,29,.75); font-size:16px; line-height:1.75; font-weight:700; } .hero-actions[data-v-0d895394],.toolbar-actions[data-v-0d895394],.composer-actions[data-v-0d895394] { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; } button[data-v-0d895394] { background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; box-shadow:5px 5px 0 #E72D48; padding:10px 14px; font-weight:1000; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease,background .16s ease,color .16s ease; } button.primary-button[data-v-0d895394],.primary-button[data-v-0d895394],button.active[data-v-0d895394] { background:#E72D48; color:#FFF9F7; box-shadow:5px 5px 0 #1A1A1D; } button[data-v-0d895394]:hover:not(:disabled) { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } button[data-v-0d895394]:active:not(:disabled) { transform:translate(3px,3px); box-shadow:2px 2px 0 #1A1A1D; } button[data-v-0d895394]:disabled { opacity:.55; cursor:not-allowed; } .author-field[data-v-0d895394],.search-field[data-v-0d895394],.composer-field[data-v-0d895394] { display:flex; flex-direction:column; gap:8px; color:#1A1A1D; font-weight:1000; } input[data-v-0d895394],textarea[data-v-0d895394] { width:100%; box-sizing:border-box; background:#FFF9F7; color:#1A1A1D; border:3px solid #1A1A1D; outline:none; padding:10px 12px; min-height:46px; font-weight:800; } textarea[data-v-0d895394] { min-height:120px; resize:vertical; line-height:1.6; } input[data-v-0d895394]:focus,textarea[data-v-0d895394]:focus { box-shadow:4px 4px 0 #E72D48; } .stats-strip[data-v-0d895394] { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-bottom:22px; } .stats-strip article[data-v-0d895394] { padding:16px; box-shadow:6px 6px 0 #E72D48; } .stats-strip strong[data-v-0d895394] { display:block; color:#E72D48; font-size:30px; line-height:1; font-weight:1000; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .stats-strip span[data-v-0d895394] { display:block; margin-top:8px; color:#1A1A1D; font-weight:900; } .toolbar-panel[data-v-0d895394] { display:flex; justify-content:space-between; align-items:flex-end; gap:16px; margin-bottom:22px; } .search-field[data-v-0d895394] { flex:1; min-width:260px; } .copy-workspace[data-v-0d895394] { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:22px; align-items:start; } .section-head[data-v-0d895394] { display:flex; justify-content:space-between; align-items:flex-end; gap:12px; margin-bottom:16px; } .section-head h2[data-v-0d895394] { margin:0; color:#1A1A1D; font-size:30px; line-height:1; font-weight:1000; } .section-head small[data-v-0d895394] { color:rgba(26,26,29,.65); font-weight:900; } .copy-grid[data-v-0d895394] { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:14px; } .copy-grid.compact[data-v-0d895394] { grid-template-columns:1fr; } .copy-card[data-v-0d895394] { padding:14px; box-shadow:5px 5px 0 #E72D48; cursor:pointer; transition:transform .16s ease,box-shadow .16s ease; } .copy-card[data-v-0d895394]:hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } .copy-card-main[data-v-0d895394] { display:flex; gap:12px; align-items:flex-start; } .copy-index[data-v-0d895394] { flex:0 0 auto; background:#E72D48; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:3px 3px 0 #1A1A1D; padding:3px 8px; font-weight:1000; } .copy-meta[data-v-0d895394] { margin-top:8px; color:rgba(26,26,29,.62); font-size:13px; font-weight:800; } .delete-button[data-v-0d895394] { background:#FFF9F7; color:#E72D48; box-shadow:4px 4px 0 #E72D48; } .recent-panel[data-v-0d895394],.composer-panel[data-v-0d895394] { margin-bottom:18px; } .quick-templates[data-v-0d895394] { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; } .empty-state[data-v-0d895394] { padding:28px; text-align:center; font-weight:900; } .toast-line[data-v-0d895394] { position:fixed; left:50%; bottom:26px; transform:translateX(-50%); z-index:50; background:#2FA84F; color:#FFF9F7; border:3px solid #1A1A1D; box-shadow:6px 6px 0 #1A1A1D; padding:10px 16px; font-weight:1000; } @media (max-width:1100px) { .copy-hero[data-v-0d895394],.copy-workspace[data-v-0d895394] { grid-template-columns:1fr; } .stats-strip[data-v-0d895394] { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:720px) { .page-shell[data-v-0d895394],.copy-page[data-v-0d895394] { padding:16px 16px 44px; } .hero-panel[data-v-0d895394],.space-panel[data-v-0d895394],.toolbar-panel[data-v-0d895394],.library-panel[data-v-0d895394],.recent-panel[data-v-0d895394],.composer-panel[data-v-0d895394] { padding:16px; } .toolbar-panel[data-v-0d895394] { flex-direction:column; align-items:stretch; } .stats-strip[data-v-0d895394],.copy-grid[data-v-0d895394] { grid-template-columns:1fr; } .hero-actions[data-v-0d895394],.toolbar-actions[data-v-0d895394],.composer-actions[data-v-0d895394] { flex-direction:column; } button[data-v-0d895394] { width:100%; } } *[data-v-0d895394],*[data-v-0d895394]::before,*[data-v-0d895394]::after { box-sizing:border-box; } button[data-v-0d895394],input[data-v-0d895394],textarea[data-v-0d895394],select[data-v-0d895394] { max-width:100%; font:inherit; } button[data-v-0d895394] { cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; } img[data-v-0d895394],svg[data-v-0d895394],canvas[data-v-0d895394] { max-width:100%; height:auto; } @media (hover:hover) and (pointer:fine) { button[data-v-0d895394]:not(:disabled):hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D; } } button[data-v-0d895394]:not(:disabled):active { transform:translate(2px,2px); box-shadow:2px 2px 0 #1A1A1D; } @media (max-width:760px) { h1[data-v-0d895394],h2[data-v-0d895394],h3[data-v-0d895394],p[data-v-0d895394],strong[data-v-0d895394],span[data-v-0d895394],small[data-v-0d895394],label[data-v-0d895394],button[data-v-0d895394],input[data-v-0d895394],textarea[data-v-0d895394] { overflow-wrap:break-word; } button[data-v-0d895394],input[data-v-0d895394],textarea[data-v-0d895394],select[data-v-0d895394] { min-height:44px; } } .page-container[data-v-0d895394],.copy-shell[data-v-0d895394],.copy-hero[data-v-0d895394],.copy-workspace[data-v-0d895394],.stats-strip[data-v-0d895394],.copy-grid[data-v-0d895394],.hero-panel[data-v-0d895394],.space-panel[data-v-0d895394],.toolbar-panel[data-v-0d895394],.library-panel[data-v-0d895394],.recent-panel[data-v-0d895394],.composer-panel[data-v-0d895394] { min-width:0; max-width:100%; } .search-field[data-v-0d895394] { min-width:0 !important; } .search-field input[data-v-0d895394],.composer-field textarea[data-v-0d895394],.author-field input[data-v-0d895394] { width:100%; min-width:0; } .copy-card[data-v-0d895394] { min-width:0; } @media (max-width:1180px) { .copy-hero[data-v-0d895394],.copy-workspace[data-v-0d895394] { grid-template-columns:minmax(0,1fr) !important; } .stats-strip[data-v-0d895394] { grid-template-columns:repeat(2,minmax(0,1fr)) !important; } } @media (max-width:760px) { .page-shell[data-v-0d895394],.copy-page[data-v-0d895394] { padding:16px 16px 40px !important; } .page-container[data-v-0d895394] { width:100% !important; } .hero-panel[data-v-0d895394],.space-panel[data-v-0d895394],.toolbar-panel[data-v-0d895394],.library-panel[data-v-0d895394],.recent-panel[data-v-0d895394],.composer-panel[data-v-0d895394],.stats-strip article[data-v-0d895394],.copy-card[data-v-0d895394] { padding:16px !important; box-shadow:5px 5px 0 #E72D48 !important; } .stats-strip[data-v-0d895394],.copy-grid[data-v-0d895394] { grid-template-columns:minmax(0,1fr) !important; } .toolbar-panel[data-v-0d895394],.hero-actions[data-v-0d895394],.toolbar-actions[data-v-0d895394],.composer-actions[data-v-0d895394] { flex-direction:column !important; align-items:stretch !important; } .hero-actions button[data-v-0d895394],.toolbar-actions button[data-v-0d895394],.composer-actions button[data-v-0d895394],.quick-templates button[data-v-0d895394] { width:100%; } .quick-templates[data-v-0d895394] { display:grid; grid-template-columns:1fr; } .toast-line[data-v-0d895394] { left:16px !important; right:16px !important; transform:none !important; width:auto !important; } } .card-page[data-v-0d2f74b6] { min-height:100vh; color:#111827; background:radial-gradient(circle at 12% 6%,rgba(42,196,255,0.16),transparent 28rem),radial-gradient(circle at 88% 8%,rgba(255,111,159,0.14),transparent 30rem),linear-gradient(180deg,#fffdf8 0%,#f8fafc 48%,#eef2f7 100%); } .card-shell[data-v-0d2f74b6] { width:min(1760px,calc(100% - 32px)); margin:0 auto; padding:clamp(54px,6vw,86px) 0 clamp(42px,6vw,80px); } .card-hero[data-v-0d2f74b6] { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,420px); gap:clamp(18px,3vw,34px); align-items:flex-end; margin-bottom:16px; } .eyebrow[data-v-0d2f74b6],.hero-panel span[data-v-0d2f74b6],.creator-head span[data-v-0d2f74b6] { display:block; color:#0f9f9a; font-size:12px; font-weight:900; text-transform:uppercase; } .hero-copy h1[data-v-0d2f74b6] { margin:8px 0 12px; font-size:clamp(42px,5vw,78px); line-height:0.98; letter-spacing:0; } .hero-copy p[data-v-0d2f74b6] { max-width:820px; margin:0; color:#475569; font-size:clamp(15px,1.2vw,18px); line-height:1.75; } .hero-panel[data-v-0d2f74b6],.card-toolbar[data-v-0d2f74b6],.detail-strip[data-v-0d2f74b6] { border:1px solid rgba(15,23,42,0.12); border-radius:8px; background:rgba(255,255,255,0.78); box-shadow:0 22px 60px rgba(15,23,42,0.1); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-panel[data-v-0d2f74b6] { padding:20px; } .hero-panel strong[data-v-0d2f74b6] { display:block; margin:6px 0 10px; font-size:clamp(32px,5vw,52px); line-height:1; } .hero-panel p[data-v-0d2f74b6] { margin:0; color:#64748b; line-height:1.55; } .card-toolbar[data-v-0d2f74b6] { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:12px; margin-bottom:18px; } .filter-row[data-v-0d2f74b6],.toolbar-right[data-v-0d2f74b6] { display:flex; flex-wrap:wrap; gap:8px; } .filter-row button[data-v-0d2f74b6],.toolbar-right select[data-v-0d2f74b6],.toolbar-right input[data-v-0d2f74b6],.primary-button[data-v-0d2f74b6],.detail-strip button[data-v-0d2f74b6],.creator-head button[data-v-0d2f74b6],.submit-button[data-v-0d2f74b6] { min-height:40px; border:1px solid rgba(15,23,42,0.12); border-radius:8px; color:#334155; background:#fff; font-weight:900; outline:none; } .filter-row button[data-v-0d2f74b6],.primary-button[data-v-0d2f74b6],.detail-strip button[data-v-0d2f74b6],.creator-head button[data-v-0d2f74b6],.submit-button[data-v-0d2f74b6] { padding:0 14px; cursor:pointer; } .toolbar-right select[data-v-0d2f74b6],.toolbar-right input[data-v-0d2f74b6] { padding:0 12px; } .toolbar-right input[data-v-0d2f74b6] { width:min(280px,34vw); } .filter-row button.active[data-v-0d2f74b6],.filter-row button[data-v-0d2f74b6]:hover,.primary-button[data-v-0d2f74b6],.submit-button[data-v-0d2f74b6] { border-color:transparent; color:#fff; background:#111827; } .card-grid[data-v-0d2f74b6] { display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:clamp(14px,1.5vw,22px); } .ability-card[data-v-0d2f74b6] { --card-color:#2ac4ff; position:relative; aspect-ratio:63/88; border-radius:8px; cursor:pointer; perspective:1200px; transform-style:preserve-3d; transition:transform 0.28s ease,filter 0.28s ease; } .ability-card[data-v-0d2f74b6]:hover { transform:translateY(-8px) rotateX(2deg) rotateY(-3deg); filter:saturate(1.08); } .ability-card.selected[data-v-0d2f74b6] { transform:translateY(-6px); } .card-glow[data-v-0d2f74b6] { position:absolute; inset:8%; border-radius:50%; background:var(--card-color ); filter:blur(34px); opacity:0.22; transform:translateZ(-20px); } .card-frame[data-v-0d2f74b6] { position:absolute; inset:0; display:grid; grid-template-rows:auto 36% auto 1fr auto; padding:11px; border:3px solid color-mix(in srgb,var(--card-color ) 72%,#111827); border-radius:8px; overflow:hidden; background:linear-gradient(135deg,rgba(255,255,255,0.26),transparent 22%),linear-gradient(180deg,color-mix(in srgb,var(--card-color ) 18%,#1f2937),#101827 42%,#edf2f7 43%,#f8fafc 100%); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16),inset 0 0 0 7px rgba(0,0,0,0.16),0 20px 46px rgba(15,23,42,0.22); } .card-frame[data-v-0d2f74b6]::before { content:""; position:absolute; inset:-60% -30%; background:linear-gradient(110deg,transparent 38%,rgba(255,255,255,0.35) 48%,transparent 58%); transform:translateX(-45%) rotate(8deg); transition:transform 0.8s ease; pointer-events:none; } .ability-card:hover .card-frame[data-v-0d2f74b6]::before { transform:translateX(45%) rotate(8deg); } .card-frame[data-v-0d2f74b6]::after { content:""; position:absolute; inset:9px; border:1px solid rgba(255,255,255,0.22); border-radius:6px; pointer-events:none; } .card-top[data-v-0d2f74b6] { position:relative; z-index:2; display:grid; grid-template-columns:44px minmax(0,1fr); gap:9px; align-items:center; min-height:54px; padding:7px; border-radius:6px; background:rgba(255,255,255,0.13); } .level-badge[data-v-0d2f74b6] { display:grid; place-items:center; width:42px; height:42px; border-radius:50%; color:#111827; background:#fff; font-size:22px; font-weight:1000; box-shadow:inset 0 -4px 0 rgba(0,0,0,0.12); } .card-top strong[data-v-0d2f74b6],.card-top small[data-v-0d2f74b6] { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .card-top strong[data-v-0d2f74b6] { color:#fff; font-size:clamp(16px,1.2vw,20px); } .card-top small[data-v-0d2f74b6] { color:rgba(255,255,255,0.72); font-weight:900; } .card-art[data-v-0d2f74b6] { position:relative; z-index:2; display:grid; place-items:center; margin-top:10px; border:2px solid rgba(255,255,255,0.24); border-radius:6px; overflow:hidden; background:radial-gradient(circle at 50% 46%,color-mix(in srgb,var(--card-color ) 55%,transparent),transparent 34%),linear-gradient(145deg,#24324a,#0b1020); } .sigil-pattern[data-v-0d2f74b6] { position:relative; z-index:2; width:min(62%,150px); aspect-ratio:1; border-radius:50%; filter:drop-shadow(0 18px 24px rgba(0,0,0,0.42)); } .sigil-pattern[data-v-0d2f74b6]::before,.sigil-pattern[data-v-0d2f74b6]::after,.sigil-pattern .mark[data-v-0d2f74b6] { content:""; position:absolute; inset:0; border-radius:inherit; border:2px solid rgba(255,255,255,0.86); } .sigil-pattern[data-v-0d2f74b6]::after { inset:18%; border-style:dashed; transform:rotate(28deg); } .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(50% 0,62% 35%,100% 50%,62% 65%,50% 100%,38% 65%,0 50%,38% 35%); clip-path:polygon(50% 0,62% 35%,100% 50%,62% 65%,50% 100%,38% 65%,0 50%,38% 35%); background:color-mix(in srgb,var(--card-color ) 76%,transparent); } .mark-two[data-v-0d2f74b6] { inset:28% !important; border-radius:18% !important; transform:rotate(45deg); background:rgba(255,255,255,0.16); } .mark-three[data-v-0d2f74b6] { inset:42% 8% !important; height:16% !important; border-radius:999px !important; background:rgba(255,255,255,0.86); } .mark-four[data-v-0d2f74b6] { inset:8% 42% !important; width:16% !important; border-radius:999px !important; background:rgba(255,255,255,0.86); } .art-time .sigil-pattern[data-v-0d2f74b6]::before { border-style:double; } .art-time .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(48% 6%,57% 45%,88% 51%,57% 58%,50% 94%,43% 58%,12% 51%,43% 45%); clip-path:polygon(48% 6%,57% 45%,88% 51%,57% 58%,50% 94%,43% 58%,12% 51%,43% 45%); } .art-time .mark-two[data-v-0d2f74b6] { transform:rotate(0deg); border-radius:50% !important; background:repeating-conic-gradient(from 0deg,rgba(255,255,255,.9) 0 5deg,transparent 5deg 16deg); } .art-space .sigil-pattern[data-v-0d2f74b6],.art-void .sigil-pattern[data-v-0d2f74b6] { border-radius:18%; transform:skew(-8deg) rotate(-8deg); } .art-space .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(8% 8%,88% 20%,58% 48%,92% 92%,12% 76%,42% 49%); clip-path:polygon(8% 8%,88% 20%,58% 48%,92% 92%,12% 76%,42% 49%); } .art-void .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(50% 0,95% 25%,70% 100%,35% 68%,0 75%,26% 35%); clip-path:polygon(50% 0,95% 25%,70% 100%,35% 68%,0 75%,26% 35%); background:rgba(17,24,39,.7); } .art-life .sigil-pattern[data-v-0d2f74b6]::before { -webkit-clip-path:polygon(50% 0,61% 28%,92% 14%,76% 45%,100% 66%,66% 68%,62% 100%,42% 74%,12% 92%,26% 58%,0 39%,34% 36%); clip-path:polygon(50% 0,61% 28%,92% 14%,76% 45%,100% 66%,66% 68%,62% 100%,42% 74%,12% 92%,26% 58%,0 39%,34% 36%); background:color-mix(in srgb,var(--card-color ) 62%,transparent); } .art-life .mark-two[data-v-0d2f74b6] { border-radius:50% 0 50% 0 !important; } .art-archmagic .sigil-pattern[data-v-0d2f74b6]::before { -webkit-clip-path:polygon(50% 0,59% 36%,96% 36%,66% 57%,78% 94%,50% 70%,22% 94%,34% 57%,4% 36%,41% 36%); clip-path:polygon(50% 0,59% 36%,96% 36%,66% 57%,78% 94%,50% 70%,22% 94%,34% 57%,4% 36%,41% 36%); } .art-supernal .sigil-pattern[data-v-0d2f74b6]::before { -webkit-clip-path:polygon(8% 72%,18% 28%,38% 50%,50% 10%,62% 50%,82% 28%,92% 72%); clip-path:polygon(8% 72%,18% 28%,38% 50%,50% 10%,62% 50%,82% 28%,92% 72%); background:color-mix(in srgb,var(--card-color ) 70%,transparent); } .art-flame .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(52% 0,78% 35%,66% 43%,88% 70%,62% 100%,28% 88%,18% 58%,36% 34%); clip-path:polygon(52% 0,78% 35%,66% 43%,88% 70%,62% 100%,28% 88%,18% 58%,36% 34%); } .art-water .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(50% 0,82% 42%,70% 82%,50% 100%,30% 82%,18% 42%); clip-path:polygon(50% 0,82% 42%,70% 82%,50% 100%,30% 82%,18% 42%); border-radius:50% 50% 52% 52% !important; } .art-earth .sigil-pattern[data-v-0d2f74b6] { border-radius:10%; } .art-earth .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(50% 0,95% 24%,84% 78%,50% 100%,16% 78%,5% 24%); clip-path:polygon(50% 0,95% 24%,84% 78%,50% 100%,16% 78%,5% 24%); } .art-thunder .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(58% 0,22% 52%,48% 52%,34% 100%,82% 38%,56% 38%); clip-path:polygon(58% 0,22% 52%,48% 52%,34% 100%,82% 38%,56% 38%); } .art-summon .sigil-pattern[data-v-0d2f74b6]::after { inset:8%; transform:rotate(45deg); border-radius:12%; } .art-mirror .sigil-pattern[data-v-0d2f74b6] { border-radius:8%; } .art-mirror .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(50% 0,88% 50%,50% 100%,12% 50%); clip-path:polygon(50% 0,88% 50%,50% 100%,12% 50%); background:linear-gradient(135deg,rgba(255,255,255,.72),color-mix(in srgb,var(--card-color ) 64%,transparent)); } .art-fate .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(14% 42%,32% 24%,50% 42%,68% 24%,86% 42%,68% 60%,50% 42%,32% 60%); clip-path:polygon(14% 42%,32% 24%,50% 42%,68% 24%,86% 42%,68% 60%,50% 42%,32% 60%); } .art-death .sigil-pattern[data-v-0d2f74b6] { border-radius:18% 18% 48% 48%; } .art-death .mark-one[data-v-0d2f74b6] { -webkit-clip-path:polygon(22% 8%,78% 8%,92% 45%,72% 92%,28% 92%,8% 45%); clip-path:polygon(22% 8%,78% 8%,92% 45%,72% 92%,28% 92%,8% 45%); background:rgba(15,23,42,0.72); } .art-dream .sigil-pattern[data-v-0d2f74b6]::before { border-radius:52% 48% 45% 55%; transform:rotate(18deg); } .art-dream .mark-one[data-v-0d2f74b6] { -webkit-clip-path:circle(46% at 50% 50%); clip-path:circle(46% at 50% 50%); background:conic-gradient(from 40deg,rgba(255,255,255,.28),color-mix(in srgb,var(--card-color ) 75%,transparent),rgba(255,255,255,.48)); } .orbit-three[data-v-0d2f74b6] { width:88%; transform:rotate(-28deg); animation:cardSpin-0d2f74b6 24s linear infinite; } .level-SS .card-frame[data-v-0d2f74b6],.level-unknown .card-frame[data-v-0d2f74b6],.level-unknownunknownunknown .card-frame[data-v-0d2f74b6] { box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16),inset 0 0 0 7px rgba(0,0,0,0.18),0 0 0 2px color-mix(in srgb,var(--card-color ) 48%,#fff),0 24px 72px rgba(15,23,42,0.32); } .level-unknown .level-badge[data-v-0d2f74b6],.level-unknownunknownunknown .level-badge[data-v-0d2f74b6] { color:#fff; background:#111827; box-shadow:inset 0 0 0 2px rgba(255,255,255,0.22),0 0 28px color-mix(in srgb,var(--card-color ) 42%,transparent); } .orbit[data-v-0d2f74b6] { position:absolute; width:54%; aspect-ratio:1; border:1px solid rgba(255,255,255,0.34); border-radius:50%; } .orbit-one[data-v-0d2f74b6] { animation:cardSpin-0d2f74b6 12s linear infinite; } .orbit-two[data-v-0d2f74b6] { width:72%; transform:rotate(56deg); animation:cardSpin-0d2f74b6 18s linear infinite reverse; } .card-art span[data-v-0d2f74b6] { position:absolute; left:9px; right:9px; bottom:8px; z-index:2; padding:5px 8px; border-radius:6px; color:#fff; background:rgba(0,0,0,0.36); font-size:12px; font-weight:900; line-height:1.35; } .effect-box[data-v-0d2f74b6],.description-box[data-v-0d2f74b6] { position:relative; z-index:2; margin-top:8px; padding:9px; border-radius:6px; background:rgba(255,255,255,0.9); } .effect-box span[data-v-0d2f74b6],.description-box span[data-v-0d2f74b6] { color:color-mix(in srgb,var(--card-color ) 58%,#111827); font-size:11px; font-weight:1000; } .effect-box p[data-v-0d2f74b6],.description-box p[data-v-0d2f74b6] { margin:4px 0 0; color:#1f2937; font-size:clamp(12px,0.85vw,14px); font-weight:800; line-height:1.5; } .description-box[data-v-0d2f74b6] { background:rgba(248,250,252,0.92); } .description-box p[data-v-0d2f74b6] { color:#475569; font-weight:750; } .card-footer[data-v-0d2f74b6] { position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:5px; align-items:flex-end; margin-top:8px; } .card-footer span[data-v-0d2f74b6] { min-height:23px; display:inline-flex; align-items:center; padding:0 8px; border-radius:999px; color:#fff; background:color-mix(in srgb,var(--card-color ) 78%,#111827); font-size:12px; font-weight:900; } .level-S .card-frame[data-v-0d2f74b6] { box-shadow:inset 0 0 0 1px rgba(255,255,255,0.16),inset 0 0 0 7px rgba(0,0,0,0.16),0 0 0 2px rgba(255,207,69,0.34),0 24px 64px rgba(15,23,42,0.28); } .detail-strip[data-v-0d2f74b6] { position:sticky; bottom:14px; z-index:30; display:flex; justify-content:space-between; gap:1rem; align-items:center; margin-top:18px; padding:12px 14px; } .detail-strip span[data-v-0d2f74b6],.detail-strip strong[data-v-0d2f74b6],.detail-strip p[data-v-0d2f74b6] { display:block; } .detail-strip span[data-v-0d2f74b6] { color:#64748b; font-size:12px; font-weight:900; } .detail-strip strong[data-v-0d2f74b6] { margin-top:2px; font-size:20px; } .detail-strip p[data-v-0d2f74b6] { margin:2px 0 0; color:#64748b; } .detail-strip button[data-v-0d2f74b6] { color:#dc2626; background:rgba(220,38,38,0.08); } .empty-state[data-v-0d2f74b6] { grid-column:1/-1; min-height:220px; display:grid; place-items:center; border:1px dashed rgba(15,23,42,0.22); border-radius:8px; color:#64748b; background:rgba(255,255,255,0.55); text-align:center; } .empty-state strong[data-v-0d2f74b6],.empty-state span[data-v-0d2f74b6] { display:block; } .empty-state strong[data-v-0d2f74b6] { color:#111827; font-size:22px; } .creator-mask[data-v-0d2f74b6] { position:fixed; inset:0; z-index:1200; display:grid; place-items:center; padding:20px; background:rgba(15,23,42,0.48); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); } .creator-panel[data-v-0d2f74b6] { width:min(760px,100%); max-height:min(86vh,820px); overflow-y:auto; padding:18px; border:1px solid rgba(15,23,42,0.12); border-radius:8px; background:#fff; box-shadow:0 28px 90px rgba(15,23,42,0.26); } .creator-head[data-v-0d2f74b6] { display:flex; justify-content:space-between; gap:1rem; align-items:center; margin-bottom:14px; } .creator-head h2[data-v-0d2f74b6] { margin:5px 0 0; font-size:28px; } .form-grid[data-v-0d2f74b6] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .form-grid label[data-v-0d2f74b6],.wide-field[data-v-0d2f74b6] { display:grid; gap:6px; } .wide-field[data-v-0d2f74b6] { margin-top:12px; } .form-grid span[data-v-0d2f74b6],.wide-field span[data-v-0d2f74b6] { color:#64748b; font-size:12px; font-weight:900; } .form-grid input[data-v-0d2f74b6],.form-grid select[data-v-0d2f74b6],.wide-field input[data-v-0d2f74b6],.wide-field textarea[data-v-0d2f74b6] { width:100%; min-height:42px; border:1px solid rgba(15,23,42,0.12); border-radius:8px; padding:0 12px; color:#111827; background:#fff; font:inherit; outline:none; } .wide-field textarea[data-v-0d2f74b6] { min-height:92px; padding:10px 12px; resize:vertical; } .form-grid input[type="color"][data-v-0d2f74b6] { padding:4px; } .submit-button[data-v-0d2f74b6] { width:100%; margin-top:14px; } .modal-enter-active[data-v-0d2f74b6],.modal-leave-active[data-v-0d2f74b6] { transition:opacity 0.2s ease; } .modal-enter[data-v-0d2f74b6],.modal-leave-to[data-v-0d2f74b6] { opacity:0; } @keyframes cardSpin-0d2f74b6 { to { transform:rotate(360deg); } } @supports not (background:color-mix(in srgb,red 50%,blue)) { .card-frame[data-v-0d2f74b6] { border-color:var(--card-color ); background:linear-gradient(180deg,#1f2937,#101827 42%,#edf2f7 43%,#f8fafc 100%); } .card-art[data-v-0d2f74b6] { background:linear-gradient(145deg,#24324a,#0b1020); } .effect-box span[data-v-0d2f74b6],.description-box span[data-v-0d2f74b6] { color:#111827; } .card-footer span[data-v-0d2f74b6] { background:#111827; } } @media (max-width:991px) { .card-hero[data-v-0d2f74b6],.card-toolbar[data-v-0d2f74b6] { grid-template-columns:1fr; display:grid; } .toolbar-right input[data-v-0d2f74b6] { width:100%; } } @media (max-width:767px) { .card-shell[data-v-0d2f74b6] { width:min(100% - 20px,1760px); padding-top:42px; } .hero-copy h1[data-v-0d2f74b6] { font-size:38px; } .toolbar-right[data-v-0d2f74b6],.form-grid[data-v-0d2f74b6] { display:grid; grid-template-columns:1fr; } .card-grid[data-v-0d2f74b6] { grid-template-columns:repeat(auto-fill,minmax(190px,1fr)); gap:12px; } .detail-strip[data-v-0d2f74b6] { position:static; align-items:stretch; flex-direction:column; } } [data-v-72ccf1a7]:root { --black:#1a1a1a; --bg-color:#f0f0f8; } .dopamine-root[data-v-72ccf1a7] { min-height:100vh; background-color:#f0f0f8; background-image:radial-gradient(#d1d1e0 1px,transparent 1px),linear-gradient(90deg,#ebebef 1px,transparent 1px); background-size:20px 20px,100% 100%; overflow-x:hidden; position:relative; font-family:"PingFang SC","Microsoft YaHei",sans-serif; } .bg-decoration .shape[data-v-72ccf1a7] { position:fixed; z-index:0; opacity:0.5; pointer-events:none; } .circle[data-v-72ccf1a7] { width:300px; height:300px; background:#FFD93D; border-radius:50%; top:-100px; left:-100px; } .triangle[data-v-72ccf1a7] { width:0; height:0; border-left:100px solid transparent; border-right:100px solid transparent; border-bottom:150px solid #FF6B6B; bottom:10%; right:-50px; transform:rotate(25deg); } .star[data-v-72ccf1a7] { width:100px; height:100px; background:#6BCB77; -webkit-clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%); clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%); top:20%; right:10%; } .word-container[data-v-72ccf1a7] { position:relative; z-index:1; max-width:1200px; margin:0 auto; padding:40px 20px 120px; } .page-header[data-v-72ccf1a7] { text-align:center; margin-bottom:50px; } .main-title[data-v-72ccf1a7] { font-size:clamp(2rem,5vw,3.5rem); font-weight:900; color:var(--black ); margin-bottom:15px; } .title-char[data-v-72ccf1a7] { display:inline-block; transition:transform 0.3s cubic-bezier(0.175,0.885,0.32,1.275); } .title-char[data-v-72ccf1a7]:hover { transform:translateY(-10px) rotate(10deg); color:#FF6B6B; } .info-pill[data-v-72ccf1a7] { display:inline-block; background:var(--black ); color:#ff6767; padding:5px 15px; border-radius:50px; font-size:12px; font-weight:bold; letter-spacing:2px; } .search-section[data-v-72ccf1a7] { display:flex; justify-content:center; margin-bottom:60px; } .search-wrapper[data-v-72ccf1a7] { display:flex; background:white; border:4px solid var(--black ); box-shadow:8px 8px 0 var(--black ); border-radius:12px; width:100%; max-width:500px; overflow:hidden; transition:0.2s; } .search-wrapper[data-v-72ccf1a7]:focus-within { transform:translate(-2px,-2px); box-shadow:12px 12px 0 var(--black ); } .search-input[data-v-72ccf1a7] { flex:1; border:none; padding:15px 20px; font-size:1.1rem; font-weight:600; outline:none; background:transparent; } .search-trigger[data-v-72ccf1a7] { background:#FFE66D; border-left:4px solid var(--black ); padding:0 20px; cursor:pointer; transition:0.2s; } .search-trigger[data-v-72ccf1a7]:hover { background:#FFD93D; } .search-trigger .icon[data-v-72ccf1a7] { width:24px; height:24px; fill:var(--black ); } .word-grid[data-v-72ccf1a7] { display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:30px; } .word-card[data-v-72ccf1a7] { background:white; border:4px solid var(--black ); border-radius:20px; padding:25px; box-shadow:10px 10px 0 var(--card-color ); cursor:pointer; position:relative; min-width:0; transition: 0.2s cubic-bezier(0.175,0.885,0.32,1.275); } .word-card[data-v-72ccf1a7]:hover { transform:translate(-5px,-5px); box-shadow:15px 15px 0 var(--card-color ); } .word-card[data-v-72ccf1a7]:active { transform:translate(5px,5px); box-shadow:0px 0px 0 var(--card-color ); } .card-top[data-v-72ccf1a7] { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; } .word-text[data-v-72ccf1a7] { font-size:1.8rem; font-weight:900; color:var(--black ); min-width:0; overflow:hidden; text-overflow:ellipsis; } .copy-tag[data-v-72ccf1a7] { font-size:10px; font-weight:900; background:var(--card-color ); padding:2px 8px; border:2px solid var(--black ); border-radius:4px; } .meaning-box[data-v-72ccf1a7] { background:#f8f8f8; border:3px solid var(--black ); padding:15px; border-radius:12px; font-size:1.05rem; font-weight:600; color:#444; line-height:1.4; } .search-notice[data-v-72ccf1a7] { grid-column:1/-1; background:#A593E0; border:4px solid var(--black ); padding:15px 25px; border-radius:12px; display:flex; justify-content:space-between; align-items:center; font-weight:900; color:white; box-shadow:6px 6px 0 var(--black ); } .close-search[data-v-72ccf1a7] { background:var(--black ); color:white; border:none; padding:5px 15px; border-radius:50px; cursor:pointer; font-weight:bold; } .action-btn[data-v-72ccf1a7] { position:fixed; bottom:40px; left:50%; transform:translateX(-50%); background:#FF6B6B; border:4px solid var(--black ); border-radius:100px; padding:15px 40px; box-shadow:0 10px 0 var(--black ); cursor:pointer; transition:0.2s; z-index:100; } .action-btn[data-v-72ccf1a7]:hover { transform:translateX(-50%) translateY(-5px); box-shadow:0 15px 0 var(--black ); } .action-btn[data-v-72ccf1a7]:active { transform:translateX(-50%) translateY(5px); box-shadow:0 0px 0 var(--black ); } .btn-content[data-v-72ccf1a7] { display:flex; align-items:center; gap:10px; } .btn-icon[data-v-72ccf1a7] { font-size:1.5rem; } .btn-text[data-v-72ccf1a7] { font-size:1.1rem; font-weight:900; color:white; letter-spacing:1px; } .is-loading .btn-icon[data-v-72ccf1a7] { animation:jitter-72ccf1a7 0.2s infinite alternate; } @keyframes jitter-72ccf1a7 { from { transform:scale(1) rotate(0); } to { transform:scale(1.3) rotate(15deg); } } .stagger-enter-active[data-v-72ccf1a7] { animation:card-pop-72ccf1a7 0.5s cubic-bezier(0.175,0.885,0.32,1.275) forwards; } @keyframes card-pop-72ccf1a7 { 0% { opacity:0; transform:scale(0.5) translateY(50px); } 100% { opacity:1; transform:scale(1) translateY(0); } } @media (max-width:768px) { .word-grid[data-v-72ccf1a7] { grid-template-columns:1fr; } .main-title[data-v-72ccf1a7] { font-size:2rem; } .action-btn[data-v-72ccf1a7] { width:80%; padding:12px; } .bg-decoration .shape[data-v-72ccf1a7] { display:none; } } .game-hub-page[data-v-5c9db940] { --ink:#111827; --muted:#64748b; --line:rgba(15,23,42,0.12); min-height:100vh; color:var(--ink ); background:radial-gradient(circle at 12% 6%,rgba(25,201,154,0.18),transparent 28rem),radial-gradient(circle at 88% 8%,rgba(239,111,97,0.16),transparent 30rem),linear-gradient(180deg,#fffdf8 0%,#f8fafc 44%,#eef2f7 100%); overflow-x:hidden; } .game-topbar[data-v-5c9db940] { position:relative; z-index:20; display:flex; align-items:center; gap:1rem; width:min(100% - 48px,1760px); min-height:clamp(4.4rem,6vw,5.8rem); margin:0 auto; } .back-button[data-v-5c9db940] { display:inline-flex; align-items:center; justify-content:center; width:clamp(2.45rem,3.2vw,3rem); height:clamp(2.45rem,3.2vw,3rem); border:1px solid var(--line ); border-radius:999px; background:rgba(255,255,255,0.76); cursor:pointer; box-shadow:0 16px 46px rgba(15,23,42,0.08); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); } .back-button span[data-v-5c9db940] { width:0.72rem; height:0.72rem; border-left:2px solid var(--ink ); border-bottom:2px solid var(--ink ); transform:rotate(45deg); margin-left:0.25rem; } .logo-mark[data-v-5c9db940] { display:block; width:clamp(10rem,12vw,13rem); height:auto; aspect-ratio:304/51; -o-object-fit:contain; object-fit:contain; } .game-hero[data-v-5c9db940] { display:grid; grid-template-columns:minmax(0,1fr) minmax(22rem,0.68fr); gap:clamp(1rem,3vw,3rem); width:min(100% - 48px,1760px); min-height:clamp(360px,50vh,600px); margin:0 auto; padding:clamp(1rem,3.5vw,3.4rem) 0 clamp(1.8rem,4vw,3rem); align-items:end; } .hero-copy[data-v-5c9db940] { min-width:0; text-align:left; padding-bottom:clamp(1rem,2.4vw,2.4rem); } .eyebrow[data-v-5c9db940],.library-head span[data-v-5c9db940] { display:block; color:#0f9f9a; font-size:0.8rem; font-weight:900; text-transform:uppercase; } .hero-copy h1[data-v-5c9db940] { max-width:24ch; margin:0; font-size:clamp(2.8rem,6.7vw,7rem); line-height:0.98; letter-spacing:0; } .hero-copy h1 span[data-v-5c9db940] { display:block; } .hero-text[data-v-5c9db940] { max-width:46rem; margin:clamp(1.2rem,3vw,2rem) 0 0; color:#475569; font-size:clamp(1rem,1.25vw,1.22rem); line-height:1.8; } .hero-card[data-v-5c9db940],.game-card[data-v-5c9db940] { border-radius:8px; overflow:hidden; cursor:pointer; } .hero-card[data-v-5c9db940] { position:relative; min-height:clamp(300px,38vw,510px); background-position:center; background-size:cover; box-shadow:0 28px 80px rgba(15,23,42,0.2); isolation:isolate; } .hero-card[data-v-5c9db940]::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg,rgba(15,23,42,0.04) 0%,rgba(15,23,42,0.34) 42%,rgba(15,23,42,0.86) 100%),linear-gradient(120deg,rgba(25,201,154,0.22),rgba(239,111,97,0.12)); } .hero-card-content[data-v-5c9db940] { position:absolute; left:clamp(1rem,3vw,2rem); right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem); color:#fff; } .hero-card-content span[data-v-5c9db940],.card-cover span[data-v-5c9db940],.card-meta span[data-v-5c9db940] { display:inline-flex; align-items:center; width:-moz-fit-content; width:fit-content; min-height:1.7rem; padding:0 0.72rem; border-radius:999px; font-size:0.78rem; font-weight:900; } .hero-card-content span[data-v-5c9db940],.card-cover span[data-v-5c9db940] { color:rgba(255,255,255,0.9); background:rgba(255,255,255,0.18); } .hero-card h2[data-v-5c9db940] { margin:0.7rem 0 0.45rem; font-size:clamp(2rem,4vw,4.2rem); line-height:1; } .hero-card p[data-v-5c9db940] { max-width:29rem; margin:0 0 1rem; color:rgba(255,255,255,0.78); line-height:1.7; } .hero-card button[data-v-5c9db940],.card-body button[data-v-5c9db940] { min-height:2.6rem; padding:0 1.1rem; border:0; border-radius:999px; color:var(--color-text ); background:#ffcf45; font-weight:900; cursor:pointer; } .game-shell[data-v-5c9db940] { width:min(100% - 48px,1760px); margin:0 auto; padding:0 0 clamp(3rem,5vw,5.6rem); } .library-head[data-v-5c9db940] { display:grid; grid-template-columns:minmax(0,1fr) minmax(16rem,25rem); gap:1rem; align-items:center; margin-bottom:1rem; } .library-head h2[data-v-5c9db940] { margin:0.35rem 0 0; font-size:clamp(1.8rem,3vw,3rem); line-height:1.05; } .search-box[data-v-5c9db940] { display:flex; align-items:center; gap:0.65rem; height:3.1rem; padding:0 1rem; border:1px solid var(--line ); border-radius:999px; background:rgba(255,255,255,0.86); box-shadow:0 14px 40px rgba(15,23,42,0.06); } .search-icon[data-v-5c9db940] { position:relative; flex:0 0 auto; width:0.88rem; height:0.88rem; border:2px solid #334155; border-radius:50%; } .search-icon[data-v-5c9db940]::after { content:""; position:absolute; right:-0.42rem; bottom:-0.34rem; width:0.48rem; height:2px; border-radius:999px; background:var(--color-surface-strong ); transform:rotate(45deg); } .search-box input[data-v-5c9db940] { width:100%; min-width:0; border:0; outline:none; background:transparent; color:var(--ink ); font-size:1rem; } .game-grid[data-v-5c9db940] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(1rem,2vw,1.5rem); } .game-card[data-v-5c9db940] { display:grid; grid-template-columns:minmax(15rem,0.74fr) minmax(0,1fr); min-height:24rem; border:1px solid rgba(15,23,42,0.1); background:rgba(255,255,255,0.86); box-shadow:0 18px 54px rgba(15,23,42,0.1); transition:transform 0.24s ease,box-shadow 0.24s ease,border-color 0.24s ease; } .game-card[data-v-5c9db940]:hover { transform:translateY(-5px); border-color:rgba(15,159,154,0.36); box-shadow:0 28px 70px rgba(15,23,42,0.16); } .card-cover[data-v-5c9db940] { position:relative; min-height:100%; background-position:center; background-size:cover; } .card-cover[data-v-5c9db940]::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,23,42,0.04) 0%,rgba(15,23,42,0.7) 100%),linear-gradient(120deg,rgba(25,201,154,0.2),transparent); } .card-cover span[data-v-5c9db940] { position:absolute; left:1rem; top:1rem; z-index:2; } .card-body[data-v-5c9db940] { display:flex; padding:clamp(1rem,2vw,1.4rem); flex-direction:column; justify-content:center; align-items:flex-start; } .card-meta[data-v-5c9db940] { display:flex; flex-wrap:wrap; gap:0.45rem; } .card-meta span[data-v-5c9db940] { color:#0f766e; background:var(--gradient-soft ); } .card-meta span[data-v-5c9db940]:last-child { color:#c2410c; background:rgba(239,111,97,0.11); } .card-body h2[data-v-5c9db940] { margin:1rem 0 0.55rem; font-size:clamp(1.7rem,2.6vw,3.2rem); line-height:1.05; } .card-body p[data-v-5c9db940] { margin:0 0 1.2rem; color:var(--muted ); line-height:1.75; } .empty-state[data-v-5c9db940] { grid-column:1/-1; min-height:14rem; border:1px dashed rgba(15,23,42,0.22); border-radius:8px; display:grid; place-items:center; color:var(--muted ); background:rgba(255,255,255,0.72); text-align:center; } .empty-state strong[data-v-5c9db940],.empty-state span[data-v-5c9db940] { display:block; } .empty-state strong[data-v-5c9db940] { color:var(--ink ); font-size:1.25rem; } @media (max-width:1199px) { .game-hero[data-v-5c9db940],.library-head[data-v-5c9db940] { grid-template-columns:1fr; } .game-grid[data-v-5c9db940] { grid-template-columns:1fr; } } @media (max-width:767px) { .game-topbar[data-v-5c9db940],.game-hero[data-v-5c9db940],.game-shell[data-v-5c9db940] { width:min(100% - 28px,1760px); } .logo-mark[data-v-5c9db940] { width:9.2rem; } .game-hero[data-v-5c9db940] { min-height:auto; padding-top:1.2rem; } .hero-copy h1[data-v-5c9db940] { max-width:100%; font-size:clamp(2rem,9.5vw,2.8rem); line-height:1.08; } .hero-card[data-v-5c9db940] { min-height:19rem; } .game-card[data-v-5c9db940] { grid-template-columns:1fr; min-height:auto; } .card-cover[data-v-5c9db940] { min-height:13rem; } } @media (max-width:575px) { .game-topbar[data-v-5c9db940],.game-hero[data-v-5c9db940],.game-shell[data-v-5c9db940] { width:min(100% - 20px,1760px); } } @font-face { font-family:"lcd"; src:url(/fonts/lcd.3aaf0417.TTF) format("truetype"); font-weight:normal; font-style:normal; font-display:swap; } .machine_body[data-v-21ee04b4] { position:relative; box-sizing:border-box; width:min(100%,640px); min-height:100vh; min-height:100svh; margin:0 auto; padding:clamp(6px,1vh,12px) 0 clamp(10px,2vh,18px); background-image:url(/img/machineCover.efeec3af.png); background-color:#4f1616; background-size:100% 100%; background-position:center top; background-repeat:no-repeat; overflow:hidden; -webkit-user-select:none; -moz-user-select:none; user-select:none; touch-action:manipulation; } .machine_screen[data-v-21ee04b4] { position:relative; min-height:min(54vh,520px); padding-top:clamp(4px,1vh,10px); box-sizing:border-box; } .machine_display[data-v-21ee04b4] { display:flex; width:52%; height:clamp(34px,5vh,48px); margin:0 23% 0 25%; font-family:lcd; } .machine_win[data-v-21ee04b4],.machine_remainder[data-v-21ee04b4] { flex:1; min-width:0; border:#ffcc5a solid clamp(3px,0.8vw,5px); border-radius:5px; background:black; text-align:right; margin-right:-3px; padding:0 4px; font-size:clamp(20px,4.2vw,30px); line-height:clamp(28px,4.4vh,40px); color:red; text-shadow:0 0 10px rgba(243,4,88,0.7),0 0 20px rgba(243,4,88,0.5),0 0 30px rgba(243,4,88,0.3); } .machine_line[data-v-21ee04b4] { display:flex; width:86%; margin:clamp(4px,1vh,10px) auto 0; background:rgba(253,252,252,0.5); gap:clamp(2px,0.7vw,5px); border-radius:10px; border-right:clamp(3px,0.8vw,5px) solid #ffec74; border-left:clamp(3px,0.8vw,5px) solid #ffec74; border-bottom:clamp(3px,0.8vw,5px) solid #ffec74; box-sizing:border-box; overflow:hidden; } .machine_line > div[data-v-21ee04b4] { flex:1 1 0; min-width:0; text-align:center; } .machine_button[data-v-21ee04b4] { width:90%; margin:clamp(4px,1vh,10px) auto 0; color:white; } .machineButtonElement[data-v-21ee04b4] { min-width:0; } .machineButtonElement img[data-v-21ee04b4] { display:block; width:80%; max-width:58px; height:clamp(28px,7vw,54px); -o-object-fit:contain; object-fit:contain; margin:0 auto; border-bottom:3px solid #ffec74; border-left:2px solid #ffec74; border-right:2px solid #ffec74; } .buttonScore[data-v-21ee04b4] { background:white; min-height:clamp(20px,3vh,28px); border-radius:40px; border:clamp(2px,0.8vw,5px) solid #ffec74; color:black; font-weight:bolder; font-size:clamp(12px,3vw,20px); line-height:clamp(16px,2.2vh,22px); } .buttonDisplay[data-v-21ee04b4] { font-family:lcd; background:#1e0d0d; border:2px solid #ffec74; color:red; text-shadow:0 0 10px rgba(243,4,88,0.7),0 0 20px rgba(243,4,88,0.5),0 0 30px rgba(243,4,88,0.3); font-weight:500; text-align:right; font-size:clamp(17px,4vw,28px); height:clamp(26px,4vh,38px); line-height:clamp(24px,3.6vh,36px); padding-right:2px; } .machine_icon[data-v-21ee04b4] { position:relative; display:grid; grid-template-columns:repeat(7,1fr); grid-template-rows:repeat(7,1fr); width:77%; aspect-ratio:1/1; margin:clamp(6px,1vh,12px) 12% 0 11%; } .grid-item[data-v-21ee04b4] { background:rgba(255,255,255,0.68); border:clamp(2px,0.55vw,3px) solid #dc5d03; box-sizing:border-box; min-width:0; min-height:0; display:grid; place-items:center; } .grid-item img[data-v-21ee04b4] { display:block; width:86%; height:86%; margin:0; -o-object-fit:contain; object-fit:contain; } .AB[data-v-21ee04b4] { margin-left:-3px; } .AC[data-v-21ee04b4] { margin-left:-3px; } .BA[data-v-21ee04b4] { margin-top:-3px; } .choseElement[data-v-21ee04b4] { background:#ffffff; box-shadow:0 3px 8px rgba(255,46,46,1),0 0 15px rgba(255,46,46,1); } .machine_button_lineOne[data-v-21ee04b4],.machine_button_lineTwo[data-v-21ee04b4] { display:flex; justify-content:center; gap:clamp(2px,0.7vw,6px); } .machine_total_button[data-v-21ee04b4] { flex:1; min-width:0; text-align:center; } .machine_button_title[data-v-21ee04b4] { font-weight:bolder; margin:0 auto; border-radius:5px; width:84%; min-height:clamp(18px,2.6vh,28px); line-height:clamp(18px,2.6vh,28px); font-size:clamp(12px,2.6vw,17px); background:linear-gradient(to bottom,yellow,#ff6a00,#ff6a00,#ff6a00,yellow); overflow:hidden; white-space:nowrap; } .machine_real_button[data-v-21ee04b4] { display:block; background:black; width:clamp(42px,10.5vw,72px); height:clamp(42px,10.5vw,72px); margin:0 auto; border-radius:30px; -o-object-fit:contain; object-fit:contain; cursor:pointer; -webkit-user-drag:none; } .machine_button_lineTwo_icon[data-v-21ee04b4] { border:2px double #d25d00; background:white; display:block; width:clamp(34px,9vw,62px); height:clamp(34px,9vw,62px); margin:0 auto; -o-object-fit:contain; object-fit:contain; } .coin_flip[data-v-21ee04b4] { position:absolute; right:0; top:clamp(8px,2vh,16px); z-index:3; cursor:pointer; } .coin_flip img[data-v-21ee04b4] { width:clamp(52px,10vw,78px); height:clamp(40px,7vh,58px); -o-object-fit:contain; object-fit:contain; -webkit-user-drag:none; } .machine_screen_middle_display[data-v-21ee04b4] { position:absolute; background:black; height:clamp(28px,4vh,42px); width:34%; border:#e99036 2px solid; left:50%; transform:translateX(-50%); text-align:center; top:43%; font-family:lcd; color:red; font-size:clamp(20px,5vw,34px); line-height:clamp(27px,4vh,40px); z-index:2; box-sizing:border-box; } .machine_screen_middle_dot_enable[data-v-21ee04b4] { position:absolute; width:18%; aspect-ratio:1/1; border-radius:50%; top:26%; border:#e99036 2px solid; background:rgba(252,38,38,0.76); left:50%; transform:translateX(-50%); box-shadow:0 0 30px #ff4524; z-index:2; } .machine_screen_middle_dot_unable[data-v-21ee04b4] { position:absolute; width:18%; aspect-ratio:1/1; border-radius:50%; top:26%; border:#e99036 2px solid; background:rgba(255,255,255,0.5); left:50%; transform:translateX(-50%); z-index:2; } @media (min-width:767px) { .machine_body[data-v-21ee04b4] { min-height:100vh; box-shadow:0 0 0 999px #220b0b,0 28px 90px rgba(0,0,0,0.45); } } @media (max-width:575px) { .machine_body[data-v-21ee04b4] { width:100%; } .machine_screen[data-v-21ee04b4] { min-height:52vh; } .machine_button[data-v-21ee04b4] { width:94%; } } .update-page[data-v-6a647cbf] { min-height:100vh; background:radial-gradient(circle at 12% 8%,rgba(255,211,67,0.44),transparent 23rem),radial-gradient(circle at 84% 4%,rgba(51,214,255,0.36),transparent 26rem),linear-gradient(135deg,#fff8e5 0%,#f2fbff 48%,#fff0f6 100%); color:var(--color-text ); overflow-x:hidden; } .update-shell[data-v-6a647cbf] { width:min(1280px,calc(100% - 40px)); margin:0 auto; padding:46px 0 78px; } .update-hero[data-v-6a647cbf] { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,420px); gap:22px; align-items:stretch; margin-bottom:24px; } .update-hero > div[data-v-6a647cbf]:first-child,.log-stats[data-v-6a647cbf],.log-card[data-v-6a647cbf] { border:1px solid var(--color-border ); border-radius:8px; box-shadow:0 20px 52px var(--color-shadow ); } .update-hero > div[data-v-6a647cbf]:first-child { padding:clamp(28px,5vw,58px); background:linear-gradient(125deg,rgba(255,255,255,0.9),rgba(255,255,255,0.68)),linear-gradient(135deg,rgba(255,117,150,0.18),rgba(52,207,255,0.16)); } .eyebrow[data-v-6a647cbf] { display:inline-flex; padding:8px 12px; border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .update-hero h1[data-v-6a647cbf] { margin:18px 0 12px; font-size:clamp(42px,6vw,82px); line-height:1.05; letter-spacing:0; } .update-hero p[data-v-6a647cbf] { max-width:650px; margin:0; color:var(--color-text-soft ); font-size:clamp(16px,2vw,20px); line-height:1.7; } .log-stats[data-v-6a647cbf] { display:grid; grid-template-columns:1fr; gap:12px; padding:18px; background:rgba(255,255,255,0.78); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .log-stats div[data-v-6a647cbf] { display:flex; min-width:0; flex-direction:column; justify-content:center; gap:6px; padding:22px; border-radius:8px; background:linear-gradient(135deg,rgba(255,230,92,0.45),rgba(62,213,255,0.28)); } .log-stats strong[data-v-6a647cbf] { overflow:hidden; color:#121a2c; font-size:clamp(24px,3vw,36px); font-weight:900; text-overflow:ellipsis; white-space:nowrap; } .log-stats span[data-v-6a647cbf] { color:#65738b; font-size:13px; font-weight:800; } .timeline[data-v-6a647cbf] { display:grid; gap:14px; position:relative; } .timeline[data-v-6a647cbf]::before { content:""; position:absolute; top:12px; bottom:12px; left:20px; width:3px; border-radius:999px; background:linear-gradient(#32cfff,#ff6aa2,#ffdd4d); } .log-card[data-v-6a647cbf] { position:relative; margin-left:54px; background:rgba(255,255,255,0.86); overflow:hidden; transition:transform 0.22s ease,box-shadow 0.22s ease,border-color 0.22s ease; } .log-card[data-v-6a647cbf]::before { content:""; position:absolute; left:-42px; top:22px; width:14px; height:14px; border:4px solid #ffffff; border-radius:50%; background:#2ac4ff; box-shadow:0 0 0 7px rgba(42,196,255,0.14); } .log-card.active[data-v-6a647cbf] { border-color:rgba(0,129,255,0.26); box-shadow:0 24px 62px rgba(0,129,255,0.15); } .log-card.active[data-v-6a647cbf]::before { background:#ff5c91; box-shadow:0 0 0 8px rgba(255,92,145,0.15); } .log-card-head[data-v-6a647cbf] { display:grid; width:100%; grid-template-columns:80px minmax(0,1fr) auto; gap:12px; align-items:center; border:0; background:transparent; cursor:pointer; padding:18px 20px; text-align:left; } .log-index[data-v-6a647cbf] { color:#00a8d8; font-size:13px; font-weight:900; } .log-title[data-v-6a647cbf] { overflow:hidden; color:var(--color-text ); font-size:clamp(16px,1.8vw,21px); font-weight:900; text-overflow:ellipsis; white-space:nowrap; } .log-toggle[data-v-6a647cbf] { padding:8px 12px; border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); font-size:12px; font-weight:900; } .logInfo[data-v-6a647cbf] { margin:0 20px 20px; padding:18px 20px; border-radius:8px; background:linear-gradient(135deg,rgba(245,252,255,0.95),rgba(255,248,222,0.92)); color:#445069; font-size:15px; font-weight:700; line-height:1.75; text-align:left; } .logInfo p[data-v-6a647cbf] { margin:0; } .logInfo p + p[data-v-6a647cbf] { margin-top:8px; } .log-open-enter-active[data-v-6a647cbf],.log-open-leave-active[data-v-6a647cbf] { transition:opacity 0.18s ease,transform 0.18s ease; } .log-open-enter[data-v-6a647cbf],.log-open-leave-to[data-v-6a647cbf] { opacity:0; transform:translateY(-6px); } @media (min-width:1440px) { .update-shell[data-v-6a647cbf] { width:min(1560px,calc(100% - 96px)); } .timeline[data-v-6a647cbf] { grid-template-columns:repeat(2,minmax(0,1fr)); } .timeline[data-v-6a647cbf]::before { display:none; } .log-card[data-v-6a647cbf] { margin-left:0; } .log-card[data-v-6a647cbf]::before { display:none; } } @media (max-width:820px) { .update-shell[data-v-6a647cbf] { width:min(100% - 28px,720px); padding-top:28px; } .update-hero[data-v-6a647cbf] { grid-template-columns:1fr; } .log-card-head[data-v-6a647cbf] { grid-template-columns:1fr auto; } .log-index[data-v-6a647cbf] { display:none; } } @media (max-width:520px) { .update-shell[data-v-6a647cbf] { width:min(100% - 20px,480px); } .timeline[data-v-6a647cbf]::before,.log-card[data-v-6a647cbf]::before { display:none; } .log-card[data-v-6a647cbf] { margin-left:0; } .log-card-head[data-v-6a647cbf] { padding:16px; } .log-title[data-v-6a647cbf] { white-space:normal; } .logInfo[data-v-6a647cbf] { margin:0 14px 14px; padding:14px; } } .qr-page { min-height:100vh; background:radial-gradient(circle at 12% 6%,rgba(255,207,69,0.46),transparent 24rem),radial-gradient(circle at 88% 4%,rgba(42,196,255,0.36),transparent 28rem),linear-gradient(135deg,#fff9e7 0%,#f3fbff 48%,#fff0f6 100%); color:var(--color-text ); overflow-x:hidden; } .qr-page * { box-sizing:border-box; } .qr-shell { width:min(1560px,calc(100% - 40px)); margin:0 auto; padding:46px 0 78px; } .qr-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,420px); gap:18px; align-items:stretch; margin-bottom:18px; } .hero-copy,.hero-stats,.qr-editor,.preview-card,.settings-panel,.editor-panel { border:1px solid var(--color-border ); border-radius:8px; box-shadow:0 20px 52px var(--color-shadow ); } .hero-copy { position:relative; overflow:hidden; padding:clamp(30px,5vw,62px); background:linear-gradient(125deg,rgba(255,255,255,0.92),rgba(255,255,255,0.68)),repeating-linear-gradient(-45deg,rgba(42,196,255,0.1) 0 10px,transparent 10px 20px); } .hero-copy::after { content:""; position:absolute; right:-40px; bottom:-70px; width:clamp(180px,22vw,360px); aspect-ratio:1; border-radius:50%; background:var(--gradient-soft ); } .eyebrow,.section-title span,.panel-head span,.preview-head span,.modal-head span { display:inline-flex; width:-moz-fit-content; width:fit-content; border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); font-size:12px; font-weight:900; letter-spacing:0; padding:8px 12px; text-transform:uppercase; } .hero-copy h1 { position:relative; z-index:1; max-width:10ch; margin:18px 0 14px; color:var(--color-text ); font-size:clamp(42px,6.4vw,92px); font-weight:950; line-height:0.94; letter-spacing:0; } .hero-copy p { position:relative; z-index:1; max-width:680px; margin:0; color:#536179; font-size:clamp(16px,1.8vw,21px); font-weight:750; line-height:1.75; } .hero-stats { display:grid; gap:12px; padding:14px; background:rgba(255,255,255,0.76); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-stats div { display:flex; min-width:0; flex-direction:column; justify-content:center; gap:6px; border-radius:8px; background:var(--gradient-soft ); padding:18px; } .hero-stats strong { overflow:hidden; color:var(--color-text ); font-size:clamp(24px,3vw,36px); font-weight:950; text-overflow:ellipsis; white-space:nowrap; } .hero-stats span { color:#65738b; font-size:13px; font-weight:850; } .qr-workbench { display:grid; grid-template-columns:minmax(0,1fr) minmax(330px,460px); gap:18px; align-items:start; } .qr-workbench.dimmed { filter:brightness(0.72); } .qr-editor,.preview-card { background:rgba(255,255,255,0.76); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); padding:14px; } .mode-tabs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:10px; margin-bottom:14px; } .mode-tabs button { display:flex; min-width:0; min-height:86px; flex-direction:column; justify-content:space-between; border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.7); color:var(--color-text ); cursor:pointer; padding:14px; text-align:left; transition:transform 0.2s ease,background 0.2s ease,border-color 0.2s ease; } .mode-tabs button:hover,.mode-tabs button.active { border-color:rgba(42,196,255,0.34); background:var(--color-surface ); transform:translateY(-3px); } .mode-tabs button.active { background:var(--gradient-primary ); color:var(--color-button-text ); } .mode-tabs span { overflow:hidden; font-size:16px; font-weight:950; text-overflow:ellipsis; white-space:nowrap; } .mode-tabs small { color:inherit; font-size:12px; font-weight:750; opacity:0.68; } .editor-panel,.settings-panel { margin-top:14px; background:rgba(255,255,255,0.84); padding:clamp(18px,3vw,26px); } .panel-head,.preview-head,.file-list-head,.modal-head,.section-title { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; margin-bottom:16px; } .panel-head h2,.preview-head h2,.modal-head h2,.section-title h2 { margin:8px 0 0; color:var(--color-text ); font-size:clamp(24px,3vw,38px); font-weight:950; line-height:1.05; letter-spacing:0; } .panel-head button,.preview-head button,.file-list-head button,.transfer-link button,.file-row button,.modal-head button { border:0; border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); cursor:pointer; font-weight:900; padding:10px 14px; white-space:nowrap; } .input-stack { display:grid; gap:10px; } .field-label,.wifi-grid label span,.setting-grid label span,.transfer-link span { color:#627087; font-size:13px; font-weight:900; } .smart-textarea,.smart-input { width:100%; border:1px solid rgba(35,63,108,0.1); border-radius:8px; outline:0; background:rgba(255,255,255,0.86); color:var(--color-text ); font-size:16px; font-weight:750; transition:border-color 0.2s ease,box-shadow 0.2s ease; } .smart-textarea { min-height:260px; resize:vertical; line-height:1.65; padding:18px; } .smart-input { min-height:48px; padding:0 14px; } .smart-textarea:focus,.smart-input:focus { border-color:rgba(42,196,255,0.72); box-shadow:0 0 0 4px rgba(42,196,255,0.12); } .inline-field { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; } .inline-field button { border:0; border-radius:8px; background:var(--gradient-primary ); color:var(--color-button-text ); cursor:pointer; font-weight:950; padding:0 18px; } .field-tip,.upload-state,.transfer-note { margin:8px 0 0; color:#65738b; font-size:13px; font-weight:750; line-height:1.6; } .wifi-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; } .wifi-grid label { display:grid; gap:8px; } .switch-line { display:flex !important; align-items:center; align-self:end; min-height:48px; gap:10px !important; border:1px solid rgba(35,63,108,0.1); border-radius:8px; background:rgba(255,255,255,0.72); padding:0 14px; } .switch-line input { width:18px; height:18px; accent-color:var(--color-primary ); } .upload-zone { display:grid; gap:12px; } .upload-drop { display:grid; min-height:220px; place-items:center; border:2px dashed rgba(42,196,255,0.42); border-radius:8px; background:var(--gradient-soft ),rgba(255,255,255,0.78); color:var(--color-text ); cursor:pointer; padding:24px; text-align:center; transition:transform 0.2s ease,border-color 0.2s ease; } .upload-drop:hover { border-color:rgba(255,111,159,0.6); transform:translateY(-3px); } .upload-drop span { display:block; font-size:clamp(28px,4vw,46px); font-weight:950; } .upload-drop small { display:block; margin-top:8px; color:#65738b; font-size:14px; font-weight:800; } .file-upload { position:absolute; width:0; height:0; opacity:0; pointer-events:none; } .preset-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-bottom:16px; } .preset-row button { min-height:42px; border:0; border-radius:8px; color:var(--color-button-text ); cursor:pointer; font-weight:950; text-shadow:0 1px 12px rgba(17,24,39,0.32); } .setting-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; } .setting-grid label { display:grid; gap:8px; min-width:0; } .setting-grid input[type="color"] { width:100%; height:48px; border:1px solid rgba(35,63,108,0.1); border-radius:8px; background:rgba(255,255,255,0.86); cursor:pointer; padding:5px; } .setting-grid input[type="range"] { width:100%; min-height:48px; accent-color:var(--color-primary ); } .preview-panel { position:sticky; top:16px; } .preview-card { display:grid; gap:14px; } .qr-preview { display:grid; min-height:360px; place-items:center; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); padding:24px; box-shadow:inset 0 0 0 10px rgba(17,24,39,0.025); } .qrImg { max-width:100%; border-radius:8px; } .preview-empty { display:grid; min-height:360px; place-items:center; border:1px dashed rgba(35,63,108,0.18); border-radius:8px; background:linear-gradient(135deg,rgba(255,255,255,0.84),rgba(239,249,255,0.72)); color:#65738b; cursor:pointer; font-size:16px; font-weight:900; } .qr_desc { border-radius:8px; background:rgba(42,196,255,0.1); color:#526077; font-size:13px; font-weight:850; padding:12px 14px; text-align:center; } .logo-tools,.action-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .tool-button,.action-grid button { display:grid; min-height:44px; place-items:center; border:0; border-radius:8px; background:var(--color-button ); color:var(--color-button-text ); cursor:pointer; font-size:14px; font-weight:950; text-align:center; } .tool-button { background:linear-gradient(135deg,#19c99a,#2ac4ff); } .tool-button.subtle { background:#eef3f9; color:#526077; } .tool-button:disabled,.action-grid button:disabled { cursor:not-allowed; opacity:0.45; } .action-grid button:first-child { background:var(--gradient-primary ); } .transfer-panel { display:grid; gap:16px; } .transfer-link { display:grid; gap:10px; border-radius:8px; background:var(--gradient-soft ); padding:16px; } .transfer-link strong { overflow-wrap:break-word; color:var(--color-text ); font-size:14px; line-height:1.5; } .file-list-head { margin:0; } .file-list-head h3 { margin:0; color:var(--color-text ); font-size:20px; font-weight:950; } .file-list { display:grid; gap:10px; } .file-row { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.82); padding:12px; } .file-row strong { display:block; overflow:hidden; color:var(--color-text ); font-size:15px; font-weight:950; text-overflow:ellipsis; white-space:nowrap; } .file-row span { display:block; margin-top:4px; color:#65738b; font-size:12px; font-weight:800; } .empty-list { display:grid; min-height:120px; place-items:center; border:1px dashed rgba(35,63,108,0.18); border-radius:8px; color:#65738b; font-weight:850; } .transfer-card { background:var(--color-surface ); } .transfer-preview { min-height:330px; } .logo-modal { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; background:rgba(17,24,39,0.42); padding:20px; -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); } .modal-panel { width:min(920px,100%); max-height:min(720px,88vh); overflow:hidden; border:1px solid rgba(255,255,255,0.58); border-radius:8px; background:rgba(255,255,255,0.96); box-shadow:0 28px 80px var(--color-shadow ); padding:18px; } .dialog_iconList { display:grid; grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:12px; max-height:540px; overflow:auto; padding:4px; } .icon { display:grid; gap:8px; justify-items:center; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); color:#526077; cursor:pointer; padding:12px 8px; } .icon:hover { border-color:rgba(42,196,255,0.5); box-shadow:0 14px 28px rgba(42,196,255,0.12); } .icon_image { display:grid; width:46px; height:46px; place-items:center; } .icon_image img { max-width:46px; max-height:46px; -o-object-fit:contain; object-fit:contain; } .icon_name { overflow:hidden; width:100%; font-size:12px; font-weight:850; text-align:center; text-overflow:ellipsis; white-space:nowrap; } .qr-toast { position:fixed; right:24px; bottom:24px; z-index:1200; border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); font-size:14px; font-weight:950; padding:12px 16px; box-shadow:0 18px 42px var(--color-shadow ); } .qr-toast.error { background:#ff5b88; } .modal-fade-enter-active,.modal-fade-leave-active,.toast-pop-enter-active,.toast-pop-leave-active { transition:opacity 0.18s ease,transform 0.18s ease; } .modal-fade-enter,.modal-fade-leave-to { opacity:0; } .toast-pop-enter,.toast-pop-leave-to { opacity:0; transform:translateY(10px); } @media (min-width:1440px) { .qr-shell { width:min(1800px,calc(100% - 96px)); } .qr-workbench { grid-template-columns:minmax(0,1fr) minmax(420px,520px); } } @media (max-width:1199px) { .qr-hero,.qr-workbench { grid-template-columns:1fr; } .preview-panel { position:static; } } @media (max-width:991px) { .qr-shell { width:min(100% - 28px,760px); padding-top:30px; } .mode-tabs,.setting-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .wifi-grid,.hero-stats { grid-template-columns:1fr; } } @media (max-width:575px) { .qr-shell { width:min(100% - 18px,480px); padding-bottom:50px; } .hero-copy,.editor-panel,.settings-panel,.preview-card { padding:16px; } .hero-copy h1 { max-width:100%; font-size:clamp(38px,13vw,58px); } .mode-tabs,.setting-grid,.preset-row,.logo-tools,.action-grid,.inline-field { grid-template-columns:1fr; } .mode-tabs button { min-height:68px; } .panel-head,.preview-head,.file-list-head,.modal-head,.section-title { align-items:flex-start; flex-direction:column; } .smart-textarea { min-height:210px; } .qr-preview,.preview-empty { min-height:280px; padding:14px; } .file-row { grid-template-columns:1fr; } .qr-toast { right:12px; bottom:12px; left:12px; text-align:center; } } @media (prefers-reduced-motion:reduce) { * { animation:none !important; transition:none !important; } } .qr-page[data-v-5e29eb45] { --pink-bg:#F1DDDF; --cream:#FFF9F7; --ink:#1A1A1D; --red:#E72D48; --green:#2FA84F; min-height:100vh; padding:clamp(16px,3vw,42px); background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.16) 2px,transparent 2.5px) 0 0/26px 26px,var(--pink-bg ); color:var(--ink ); box-sizing:border-box; overflow-x:hidden; } .qr-page *[data-v-5e29eb45],.qr-page *[data-v-5e29eb45]::before,.qr-page *[data-v-5e29eb45]::after { box-sizing:border-box; } .qr-shell[data-v-5e29eb45] { width:min(100%,1380px); margin:0 auto; } .qr-hero[data-v-5e29eb45],.editor-panel[data-v-5e29eb45],.settings-panel[data-v-5e29eb45],.preview-panel[data-v-5e29eb45],.preview-card[data-v-5e29eb45],.transfer-panel[data-v-5e29eb45],.upload-drop[data-v-5e29eb45],.file-row[data-v-5e29eb45],.file-list[data-v-5e29eb45],.empty-list[data-v-5e29eb45] { background:var(--cream ) !important; color:var(--ink ) !important; border:3px solid var(--ink ) !important; border-radius:24px !important; box-shadow:8px 8px 0 var(--red ) !important; } .qr-hero[data-v-5e29eb45] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:22px; align-items:end; padding:clamp(20px,3vw,34px); margin-bottom:24px; } .hero-copy h1[data-v-5e29eb45] { margin:8px 0 10px; color:var(--ink ); line-height:1.05; letter-spacing:-1.5px; } .hero-copy p[data-v-5e29eb45] { max-width:720px; color:rgba(26,26,29,.78); line-height:1.75; } .eyebrow[data-v-5e29eb45] { display:inline-flex; align-items:center; width:-moz-fit-content; width:fit-content; padding:6px 12px; border:3px solid var(--ink ); border-radius:999px; background:var(--red ); color:var(--cream ); box-shadow:4px 4px 0 var(--ink ); font-weight:900; letter-spacing:.08em; } .hero-stats[data-v-5e29eb45] { display:grid; grid-template-columns:repeat(3,minmax(96px,1fr)); gap:10px; } .hero-stats > div[data-v-5e29eb45] { background:var(--cream ); border:3px solid var(--ink ); border-radius:18px; padding:12px; box-shadow:5px 5px 0 var(--ink ); min-width:0; } .hero-stats strong[data-v-5e29eb45] { display:block; color:var(--red ); font-size:clamp(18px,2vw,28px); line-height:1.1; word-break:break-word; } .hero-stats span[data-v-5e29eb45] { color:var(--ink ); font-weight:800; } .qr-workbench[data-v-5e29eb45] { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr); gap:24px; align-items:start; } .qr-editor[data-v-5e29eb45] { display:grid; gap:18px; min-width:0; } .preview-panel[data-v-5e29eb45] { position:sticky; top:20px; min-width:0; padding:clamp(16px,2vw,22px); } .mode-tabs[data-v-5e29eb45],.preset-row[data-v-5e29eb45],.setting-grid[data-v-5e29eb45],.wifi-grid[data-v-5e29eb45] { min-width:0; } .mode-tabs[data-v-5e29eb45] { display:flex; flex-wrap:wrap; gap:10px; } .mode-tabs button[data-v-5e29eb45],.preset-row button[data-v-5e29eb45],.panel-head button[data-v-5e29eb45],.primary-button[data-v-5e29eb45],.ghost-button[data-v-5e29eb45],.inline-field button[data-v-5e29eb45],.transfer-link button[data-v-5e29eb45],.file-row button[data-v-5e29eb45] { min-height:42px; border:3px solid var(--ink ) !important; border-radius:14px !important; background:var(--cream ) !important; color:var(--ink ) !important; font-weight:900; box-shadow:4px 4px 0 var(--ink ) !important; transition:transform .15s ease,box-shadow .15s ease,background .15s ease; } .mode-tabs button.active[data-v-5e29eb45],.primary-button[data-v-5e29eb45],.inline-field button[data-v-5e29eb45],.transfer-link button[data-v-5e29eb45] { background:var(--red ) !important; color:var(--cream ) !important; } .mode-tabs button[data-v-5e29eb45]:hover,.preset-row button[data-v-5e29eb45]:hover,.panel-head button[data-v-5e29eb45]:hover,.primary-button[data-v-5e29eb45]:hover,.ghost-button[data-v-5e29eb45]:hover,.inline-field button[data-v-5e29eb45]:hover,.transfer-link button[data-v-5e29eb45]:hover,.file-row button[data-v-5e29eb45]:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--ink ) !important; } .mode-tabs button[data-v-5e29eb45]:active,.preset-row button[data-v-5e29eb45]:active,.panel-head button[data-v-5e29eb45]:active,.primary-button[data-v-5e29eb45]:active,.ghost-button[data-v-5e29eb45]:active,.inline-field button[data-v-5e29eb45]:active,.transfer-link button[data-v-5e29eb45]:active,.file-row button[data-v-5e29eb45]:active { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink ) !important; } .smart-input[data-v-5e29eb45],.smart-textarea[data-v-5e29eb45],select.smart-input[data-v-5e29eb45] { width:100%; min-width:0; border:3px solid var(--ink ) !important; border-radius:16px !important; background:var(--cream ) !important; color:var(--ink ) !important; font-weight:800; box-shadow:4px 4px 0 rgba(26,26,29,.18) !important; } .smart-input[data-v-5e29eb45]:focus,.smart-textarea[data-v-5e29eb45]:focus,select.smart-input[data-v-5e29eb45]:focus { outline:none; box-shadow:0 0 0 4px rgba(231,45,72,.20),4px 4px 0 var(--ink ) !important; } .inline-field[data-v-5e29eb45] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:stretch; } .panel-head[data-v-5e29eb45],.preview-head[data-v-5e29eb45],.file-list-head[data-v-5e29eb45],.section-title[data-v-5e29eb45] { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; } .upload-zone[data-v-5e29eb45],.input-stack[data-v-5e29eb45],.setting-grid[data-v-5e29eb45],.wifi-grid[data-v-5e29eb45] { display:grid; gap:14px; } .file-list[data-v-5e29eb45] { max-height:min(48vh,520px); overflow:auto; padding:12px; box-shadow:inset 0 0 0 3px rgba(26,26,29,.06) !important; } .file-row[data-v-5e29eb45] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px !important; box-shadow:4px 4px 0 var(--ink ) !important; } .preview-card img[data-v-5e29eb45],.preview-card canvas[data-v-5e29eb45],.preview-card svg[data-v-5e29eb45] { max-width:100%; height:auto; } @media (max-width:1199px) { .qr-workbench[data-v-5e29eb45] { grid-template-columns:1fr; } .preview-panel[data-v-5e29eb45] { position:static; } .qr-hero[data-v-5e29eb45] { grid-template-columns:1fr; } .hero-stats[data-v-5e29eb45] { grid-template-columns:repeat(3,minmax(0,1fr)); } } @media (max-width:767px) { .qr-page[data-v-5e29eb45] { padding:14px; } .qr-hero[data-v-5e29eb45],.editor-panel[data-v-5e29eb45],.settings-panel[data-v-5e29eb45],.preview-panel[data-v-5e29eb45],.preview-card[data-v-5e29eb45] { border-radius:18px !important; box-shadow:5px 5px 0 var(--red ) !important; } .hero-stats[data-v-5e29eb45],.setting-grid[data-v-5e29eb45],.wifi-grid[data-v-5e29eb45] { grid-template-columns:1fr !important; } .inline-field[data-v-5e29eb45],.file-row[data-v-5e29eb45] { grid-template-columns:1fr; } .mode-tabs button[data-v-5e29eb45],.preset-row button[data-v-5e29eb45],.panel-head button[data-v-5e29eb45],.primary-button[data-v-5e29eb45],.ghost-button[data-v-5e29eb45] { width:100%; } .panel-head[data-v-5e29eb45],.preview-head[data-v-5e29eb45],.section-title[data-v-5e29eb45] { align-items:flex-start; flex-direction:column; } } .uploadButton[data-v-be127b52] { position:absolute; width:100px; top:20%; height:40px; border-radius:5px; background:#42b983; display:flex; justify-content:center; align-items:center; padding:5px; box-sizing:border-box; cursor:pointer; color:white; } .memo-app-container[data-v-5141a010] { --page-bg:#F1DDDF; --panel:#FFF9F7; --ink:#1A1A1D; --red:#E72D48; --green:#2FA84F; min-height:100vh; padding:28px 18px 56px; background:var(--page-bg ); color:var(--ink ); box-sizing:border-box; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; overflow-x:hidden; } .memo-page-shell[data-v-5141a010] { width:min(1320px,100%); margin:0 auto; } .panel-primary[data-v-5141a010],.panel-card[data-v-5141a010],.panel-accent[data-v-5141a010] { border:3px solid var(--ink ); box-sizing:border-box; } .panel-primary[data-v-5141a010],.panel-card[data-v-5141a010] { background:var(--panel ); box-shadow:8px 8px 0 var(--red ); } .panel-accent[data-v-5141a010] { background:var(--red ); color:var(--panel ); box-shadow:8px 8px 0 var(--ink ); } .memo-hero[data-v-5141a010] { display:grid; grid-template-columns:minmax(0,1fr) 260px; gap:24px; align-items:stretch; padding:34px; position:relative; overflow:hidden; } .memo-hero[data-v-5141a010]::after { content:""; position:absolute; right:28px; bottom:24px; width:116px; height:116px; background-image:radial-gradient(var(--red ) 3px,transparent 3px); background-size:16px 16px; opacity:.14; pointer-events:none; } .sticker[data-v-5141a010] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:8px 14px; background:var(--red ); color:var(--panel ); border:3px solid var(--ink ); box-shadow:4px 4px 0 var(--ink ); font-weight:900; transform:rotate(-2deg); } h1[data-v-5141a010],h2[data-v-5141a010],p[data-v-5141a010] { margin:0; } .hero-copy h1[data-v-5141a010] { margin-top:18px; font-size:clamp(42px,7vw,86px); line-height:.95; letter-spacing:-4px; font-weight:1000; } .hero-copy p[data-v-5141a010] { max-width:620px; margin-top:18px; font-size:18px; line-height:1.8; font-weight:700; } .hero-stat[data-v-5141a010] { border:3px solid var(--ink ); background:var(--red ); color:var(--panel ); box-shadow:6px 6px 0 var(--ink ); padding:22px; display:flex; flex-direction:column; justify-content:center; } .hero-stat span[data-v-5141a010],.hero-stat small[data-v-5141a010] { font-weight:900; } .hero-stat strong[data-v-5141a010] { font-size:74px; line-height:1; margin:12px 0; } .memo-workbench[data-v-5141a010] { display:grid; grid-template-columns:minmax(0,1fr) 340px; gap:24px; margin-top:28px; align-items:stretch; } .memo-editor[data-v-5141a010],.memo-list-card[data-v-5141a010] { padding:28px; } .section-head[data-v-5141a010] { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:22px; } .section-head span[data-v-5141a010] { display:block; font-size:13px; font-weight:1000; letter-spacing:.08em; color:var(--red ); } .section-head h2[data-v-5141a010] { margin-top:6px; font-size:clamp(26px,3vw,40px); line-height:1.05; font-weight:1000; } .user-badge[data-v-5141a010] { width:52px; height:52px; border:3px solid var(--ink ); background:var(--red ); color:var(--panel ); box-shadow:5px 5px 0 var(--ink ); display:grid; place-items:center; font-weight:1000; font-size:24px; } .login-row[data-v-5141a010],.input-row[data-v-5141a010] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; } .login-done[data-v-5141a010] { border:3px solid var(--ink ); background:#fff; padding:16px; font-weight:900; display:flex; gap:10px; align-items:center; } .login-done strong[data-v-5141a010] { color:var(--red ); } .memo-input-box[data-v-5141a010] { margin-top:22px; } .memo-input-box label[data-v-5141a010] { display:block; font-weight:1000; margin-bottom:10px; } input[data-v-5141a010] { width:100%; min-height:54px; border:3px solid var(--ink ); background:var(--panel ); color:var(--ink ); padding:0 16px; font-size:16px; font-weight:800; box-sizing:border-box; outline:none; } input[data-v-5141a010]:focus { box-shadow:4px 4px 0 var(--red ); } button[data-v-5141a010] { min-height:54px; border:3px solid var(--ink ); background:var(--red ); color:var(--panel ); box-shadow:5px 5px 0 var(--ink ); padding:0 20px; font-size:15px; font-weight:1000; cursor:pointer; } button[data-v-5141a010]:disabled { opacity:.5; cursor:not-allowed; transform:none; } button[data-v-5141a010]:not(:disabled):active { transform:translate(3px,3px); box-shadow:2px 2px 0 var(--ink ); } .memo-side[data-v-5141a010] { padding:26px; display:flex; flex-direction:column; justify-content:space-between; min-height:230px; } .memo-side span[data-v-5141a010] { font-weight:1000; } .memo-side strong[data-v-5141a010] { display:block; font-size:38px; line-height:1.05; margin:16px 0; } .memo-side p[data-v-5141a010] { font-weight:800; line-height:1.7; } .memo-list-card[data-v-5141a010] { margin-top:28px; } .list-head small[data-v-5141a010] { border:3px solid var(--ink ); background:var(--red ); color:var(--panel ); padding:8px 12px; font-weight:1000; } .empty-state[data-v-5141a010] { border:3px dashed var(--ink ); background:#fff; padding:32px; text-align:center; } .empty-state strong[data-v-5141a010] { font-size:24px; font-weight:1000; } .empty-state p[data-v-5141a010] { margin-top:8px; font-weight:700; } .memo-list[data-v-5141a010] { list-style:none; padding:0; margin:0; display:grid; gap:14px; } .memo-item[data-v-5141a010] { display:grid; grid-template-columns:70px minmax(0,1fr) auto; align-items:center; gap:16px; border:3px solid var(--ink ); background:#fff; padding:14px; box-shadow:5px 5px 0 rgba(26,26,29,.18); } .memo-index[data-v-5141a010] { color:var(--red ); font-weight:1000; } .memo-item p[data-v-5141a010] { font-size:16px; line-height:1.6; font-weight:800; word-break:break-word; } .memo-item button[data-v-5141a010] { min-height:42px; padding:0 14px; background:var(--panel ); color:var(--ink ); box-shadow:4px 4px 0 var(--ink ); } .memo-list-enter-active[data-v-5141a010],.memo-list-leave-active[data-v-5141a010] { transition: .22s ease; } .memo-list-enter[data-v-5141a010],.memo-list-leave-to[data-v-5141a010] { opacity:0; transform:translateY(10px); } @media (max-width:900px) { .memo-hero[data-v-5141a010],.memo-workbench[data-v-5141a010] { grid-template-columns:1fr; } .memo-side[data-v-5141a010] { min-height:auto; } } @media (max-width:640px) { .memo-app-container[data-v-5141a010] { padding:16px 16px 96px; } .memo-hero[data-v-5141a010],.memo-editor[data-v-5141a010],.memo-list-card[data-v-5141a010] { padding:20px; } .hero-copy h1[data-v-5141a010] { letter-spacing:-2px; } .login-row[data-v-5141a010],.input-row[data-v-5141a010],.memo-item[data-v-5141a010] { grid-template-columns:1fr; } .hero-stat strong[data-v-5141a010] { font-size:54px; } button[data-v-5141a010] { width:100%; } .memo-item[data-v-5141a010] { gap:10px; } } .video-wrapper[data-v-7bae9ee9] { display:flex; flex-direction:column; align-items:center; margin:20px; } .video-container[data-v-7bae9ee9] { max-width:800px; margin:0 auto; border:5px solid #ddd; border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,0.1); overflow:hidden; } .video-js[data-v-7bae9ee9] { width:100%; height:auto; } .video-controls[data-v-7bae9ee9] { margin-top:20px; display:flex; justify-content:center; } .video-controls button[data-v-7bae9ee9] { padding:10px 20px; margin:0 10px; font-size:16px; background-color:#4caf50; color:white; border:none; border-radius:4px; cursor:pointer; transition:background-color 0.3s ease; } .video-controls button[data-v-7bae9ee9]:disabled { background-color:#ccc; cursor:not-allowed; } .video-controls button[data-v-7bae9ee9]:hover:not(:disabled) { background-color:#45a049; } .loading[data-v-7bae9ee9] { text-align:center; font-size:18px; color:#888; } .error[data-v-7bae9ee9] { text-align:center; font-size:18px; color:red; } .dream-page[data-v-ea1aa206] { --dream-bg:#F1DDDF; --dream-panel:#FFF9F7; --dream-red:#E72D48; --dream-black:#1A1A1D; --dream-green:#2FA84F; min-height:100vh; padding:clamp(72px,7vw,104px) 16px 56px; box-sizing:border-box; color:var(--dream-black ); background:radial-gradient(circle at 16px 16px,rgba(26,26,29,0.16) 2px,transparent 3px),linear-gradient(135deg,rgba(255,249,247,0.72),transparent 42%),var(--dream-bg ); background-size:26px 26px,auto,auto; font-family:"Inter","PingFang SC","Microsoft YaHei",sans-serif; overflow-x:hidden; } .dream-select-shell[data-v-ea1aa206],.dream-workbench[data-v-ea1aa206] { width:min(100%,1360px); margin:0 auto; } .dream-select-shell[data-v-ea1aa206] { display:grid; gap:26px; } .panel-main[data-v-ea1aa206],.emphasis-panel[data-v-ea1aa206] { border:3px solid var(--dream-black ); border-radius:18px; } .panel-main[data-v-ea1aa206] { background:var(--dream-panel ); box-shadow:8px 8px 0 var(--dream-red ); } .emphasis-panel[data-v-ea1aa206] { color:var(--dream-panel ); background:var(--dream-red ); box-shadow:8px 8px 0 var(--dream-black ); } .select-hero[data-v-ea1aa206] { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:26px; align-items:center; padding:clamp(24px,4vw,42px); overflow:hidden; } .select-hero[data-v-ea1aa206]::after,.workbench-hero[data-v-ea1aa206]::after { content:""; position:absolute; width:130px; height:130px; right:-34px; top:-34px; border:3px solid var(--dream-black ); background:repeating-linear-gradient(45deg,var(--dream-red ) 0 10px,var(--dream-panel ) 10px 20px); transform:rotate(10deg); opacity:0.85; } .sticker[data-v-ea1aa206] { display:inline-flex; align-items:center; width:-moz-fit-content; width:fit-content; padding:7px 12px; border:3px solid var(--dream-black ); border-radius:999px; color:var(--dream-panel ); background:var(--dream-red ); font-size:13px; font-weight:900; line-height:1; box-shadow:4px 4px 0 var(--dream-black ); } .sticker.light[data-v-ea1aa206] { color:var(--dream-red ); background:var(--dream-panel ); } .hero-copy h1[data-v-ea1aa206],.workbench-hero h1[data-v-ea1aa206] { margin:16px 0 12px; font-size:clamp(42px,7vw,86px); line-height:0.98; letter-spacing:-0.06em; font-weight:1000; } .hero-copy p[data-v-ea1aa206],.workbench-hero p[data-v-ea1aa206],.section-head p[data-v-ea1aa206],.editor-head p[data-v-ea1aa206] { max-width:620px; margin:0; font-size:16px; line-height:1.8; font-weight:700; } .hero-board[data-v-ea1aa206] { position:relative; z-index:1; min-height:230px; display:flex; flex-direction:column; justify-content:space-between; padding:22px; border:3px solid var(--dream-black ); border-radius:16px; background:var(--dream-red ); color:var(--dream-panel ); box-shadow:8px 8px 0 var(--dream-black ); transform:rotate(2deg); } .board-money[data-v-ea1aa206] { width:64px; height:64px; display:grid; place-items:center; border:3px solid var(--dream-black ); border-radius:50%; background:var(--dream-panel ); color:var(--dream-red ); font-size:34px; font-weight:1000; } .board-text[data-v-ea1aa206] { font-size:42px; line-height:0.95; font-weight:1000; letter-spacing:-0.05em; } .amount-section[data-v-ea1aa206] { display:grid; gap:16px; } .section-head[data-v-ea1aa206],.editor-head[data-v-ea1aa206],.progress-topline[data-v-ea1aa206] { display:flex; align-items:flex-end; justify-content:space-between; gap:16px; } .section-head h2[data-v-ea1aa206],.editor-head h2[data-v-ea1aa206] { margin:0 0 6px; font-size:clamp(24px,3vw,36px); line-height:1.1; font-weight:1000; } .amount-grid[data-v-ea1aa206] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; } .amount-card[data-v-ea1aa206] { position:relative; min-width:0; min-height:166px; padding:20px; border:3px solid var(--dream-black ); border-radius:16px; color:var(--dream-black ); background:var(--dream-panel ); box-shadow:7px 7px 0 var(--dream-black ); cursor:pointer; text-align:left; overflow:hidden; transition:transform 0.18s ease,box-shadow 0.18s ease,background 0.18s ease; } .amount-card[data-v-ea1aa206]:hover { transform:translate(-2px,-2px); background:#fff1ef; box-shadow:10px 10px 0 var(--dream-red ); } .amount-index[data-v-ea1aa206] { display:inline-flex; padding:5px 9px; border:3px solid var(--dream-black ); border-radius:999px; background:var(--dream-red ); color:var(--dream-panel ); font-size:12px; font-weight:1000; } .amount-card strong[data-v-ea1aa206] { display:block; margin:36px 0 8px; font-size:25px; line-height:1.12; font-weight:1000; } .amount-card em[data-v-ea1aa206] { color:var(--dream-red ); font-size:16px; font-style:normal; font-weight:1000; } .dream-workbench[data-v-ea1aa206] { display:grid; grid-template-columns:minmax(0,1fr); gap:18px; } .workbench-hero[data-v-ea1aa206] { position:relative; display:flex; align-items:center; justify-content:space-between; gap:22px; padding:clamp(20px,3vw,34px); overflow:hidden; } .hero-main[data-v-ea1aa206] { position:relative; z-index:1; display:flex; align-items:flex-start; gap:18px; min-width:0; } .back-btn[data-v-ea1aa206] { width:48px; height:48px; flex:0 0 auto; border:3px solid var(--dream-black ); border-radius:14px; color:var(--dream-black ); background:var(--dream-panel ); box-shadow:5px 5px 0 var(--dream-black ); cursor:pointer; font-size:22px; font-weight:1000; } .total-budget-box[data-v-ea1aa206] { position:relative; z-index:1; flex:0 0 300px; padding:18px; border:3px solid var(--dream-black ); border-radius:16px; color:var(--dream-black ); background:var(--dream-panel ); box-shadow:6px 6px 0 var(--dream-black ); } .total-budget-box span[data-v-ea1aa206],.budget-metric span[data-v-ea1aa206],.progress-topline span[data-v-ea1aa206],.input-col label[data-v-ea1aa206] { display:block; color:rgba(26,26,29,0.72); font-size:13px; font-weight:1000; } .total-budget-box strong[data-v-ea1aa206] { display:block; margin-top:8px; font-size:clamp(24px,3vw,34px); line-height:1.05; font-weight:1000; } .budget-overview[data-v-ea1aa206] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; padding:18px; } .budget-metric[data-v-ea1aa206] { min-width:0; padding:18px; border:3px solid var(--dream-black ); border-radius:14px; background:#fff; } .budget-metric strong[data-v-ea1aa206] { display:block; margin-top:8px; color:var(--dream-black ); font-size:clamp(24px,3vw,38px); line-height:1.05; font-weight:1000; word-break:break-word; } .budget-metric.is-negative strong[data-v-ea1aa206],.warning-text[data-v-ea1aa206],.footer-tip.warning[data-v-ea1aa206] { color:var(--dream-red ); } .progress-panel[data-v-ea1aa206] { padding:18px; } .progress-topline[data-v-ea1aa206] { margin-bottom:12px; } .progress-topline strong[data-v-ea1aa206] { display:block; margin-bottom:4px; font-size:18px; font-weight:1000; } .progress-topline em[data-v-ea1aa206] { padding:6px 10px; border:3px solid var(--dream-black ); border-radius:999px; background:var(--dream-panel ); color:var(--dream-black ); font-size:13px; font-style:normal; font-weight:1000; } .progress-bar[data-v-ea1aa206] { height:18px; border:3px solid var(--dream-black ); border-radius:999px; background:#fff; overflow:hidden; } .progress-inner[data-v-ea1aa206] { height:100%; background:var(--dream-red ); transition:width 0.45s ease; } .progress-inner.over-budget[data-v-ea1aa206] { background:repeating-linear-gradient(45deg,var(--dream-red ) 0 10px,var(--dream-black ) 10px 20px); } .dream-editor[data-v-ea1aa206] { display:grid; gap:18px; padding:20px; } .dreams-scroll-area[data-v-ea1aa206] { min-height:0; max-height:560px; overflow-y:auto; overflow-x:hidden; padding:2px 8px 8px 2px; } .dreams-wrapper[data-v-ea1aa206] { display:grid; grid-template-columns:minmax(0,1fr); gap:14px; min-width:0; width:100%; } .dream-item[data-v-ea1aa206] { min-width:0; padding:16px; border:3px solid var(--dream-black ); border-radius:16px; background:#fff; box-shadow:6px 6px 0 rgba(26,26,29,0.92); transition:transform 0.18s ease,box-shadow 0.18s ease,background 0.18s ease; } .dream-item.is-focused[data-v-ea1aa206] { transform:translate(-1px,-1px); background:#fff6f3; box-shadow:8px 8px 0 var(--dream-red ); } .dream-card-head[data-v-ea1aa206] { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:14px; } .dream-index[data-v-ea1aa206] { display:inline-flex; align-items:center; justify-content:center; min-width:46px; min-height:32px; padding:0 10px; border:3px solid var(--dream-black ); border-radius:999px; color:var(--dream-panel ); background:var(--dream-red ); font-size:13px; font-weight:1000; line-height:1; } .delete-btn[data-v-ea1aa206] { min-height:36px; padding:0 12px; border:3px solid var(--dream-black ); border-radius:999px; color:var(--dream-red ); background:var(--dream-panel ); box-shadow:3px 3px 0 var(--dream-black ); cursor:pointer; font-size:13px; font-weight:1000; } .dream-main-row[data-v-ea1aa206] { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,320px); gap:16px; align-items:start; } .input-col[data-v-ea1aa206] { display:grid; min-width:0; gap:8px; } textarea[data-v-ea1aa206],.cost-input-wrapper input[data-v-ea1aa206] { width:100%; min-width:0; box-sizing:border-box; color:var(--dream-black ); background:transparent; outline:none; box-shadow:none; font-family:inherit; } textarea[data-v-ea1aa206] { min-height:48px; padding:12px 14px; border:3px solid var(--dream-black ); border-radius:14px; resize:none; font-size:16px; line-height:1.6; font-weight:700; } textarea[data-v-ea1aa206]::-moz-placeholder,.cost-input-wrapper input[data-v-ea1aa206]::-moz-placeholder { color:rgba(26,26,29,0.42); } textarea[data-v-ea1aa206]::placeholder,.cost-input-wrapper input[data-v-ea1aa206]::placeholder { color:rgba(26,26,29,0.42); } .cost-input-wrapper[data-v-ea1aa206] { display:flex; align-items:center; min-width:0; height:78px; border:3px solid var(--dream-black ); border-radius:14px; background:var(--dream-panel ); } .currency-prefix[data-v-ea1aa206] { padding-left:14px; color:var(--dream-red ); font-size:18px; font-weight:1000; } .cost-input-wrapper input[data-v-ea1aa206] { height:100%; padding:0 14px; border:0; font-size:22px; font-weight:1000; } .dream-footer[data-v-ea1aa206] { display:flex; align-items:center; justify-content:space-between; gap:14px; padding-top:2px; } .add-btn[data-v-ea1aa206] { min-height:48px; padding:0 18px; border:3px solid var(--dream-black ); border-radius:14px; color:var(--dream-panel ); background:var(--dream-red ); box-shadow:5px 5px 0 var(--dream-black ); font-size:15px; font-weight:1000; cursor:pointer; transition:transform 0.18s ease,box-shadow 0.18s ease,opacity 0.18s ease; } .add-btn[data-v-ea1aa206]:hover:not(:disabled) { transform:translate(-1px,-1px); box-shadow:7px 7px 0 var(--dream-black ); } .add-btn[data-v-ea1aa206]:disabled { opacity:0.45; cursor:not-allowed; } .mobile-add[data-v-ea1aa206] { display:none; } .footer-tip[data-v-ea1aa206] { color:rgba(26,26,29,0.76); font-size:14px; font-weight:900; text-align:right; } .footer-tip.success[data-v-ea1aa206] { color:var(--dream-green ); } .fade-scale-enter-active[data-v-ea1aa206],.fade-scale-leave-active[data-v-ea1aa206],.list-stagger-enter-active[data-v-ea1aa206],.list-stagger-leave-active[data-v-ea1aa206] { transition: 0.26s ease; } .fade-scale-enter[data-v-ea1aa206],.fade-scale-leave-to[data-v-ea1aa206],.list-stagger-enter[data-v-ea1aa206],.list-stagger-leave-to[data-v-ea1aa206] { opacity:0; transform:translateY(10px) scale(0.98); } @keyframes shake-ea1aa206 { 0%,100% { transform:translateX(0); } 25% { transform:translateX(-4px); } 75% { transform:translateX(4px); } } .shake-animation[data-v-ea1aa206] { animation:shake-ea1aa206 0.2s ease-in-out 0s 2; border-color:var(--dream-red ) !important; } .dreams-scroll-area[data-v-ea1aa206]::-webkit-scrollbar { width:8px; } .dreams-scroll-area[data-v-ea1aa206]::-webkit-scrollbar-track { background:transparent; } .dreams-scroll-area[data-v-ea1aa206]::-webkit-scrollbar-thumb { border:2px solid var(--dream-panel ); border-radius:999px; background:var(--dream-black ); } input[data-v-ea1aa206]::-webkit-outer-spin-button,input[data-v-ea1aa206]::-webkit-inner-spin-button { -webkit-appearance:none; margin:0; } @media (min-width:1680px) { .dream-workbench[data-v-ea1aa206],.dream-select-shell[data-v-ea1aa206] { width:min(100%,1420px); } .dreams-scroll-area[data-v-ea1aa206] { max-height:620px; } } @media (max-width:1024px) { .select-hero[data-v-ea1aa206] { grid-template-columns:1fr; } .hero-board[data-v-ea1aa206] { min-height:180px; } .amount-grid[data-v-ea1aa206] { grid-template-columns:repeat(2,minmax(0,1fr)); } .workbench-hero[data-v-ea1aa206] { align-items:stretch; flex-direction:column; } .total-budget-box[data-v-ea1aa206] { flex-basis:auto; } } @media (max-width:767px) { .dream-page[data-v-ea1aa206] { padding:64px 16px 32px; background-size:22px 22px,auto,auto; } .select-hero[data-v-ea1aa206],.workbench-hero[data-v-ea1aa206],.budget-overview[data-v-ea1aa206],.progress-panel[data-v-ea1aa206],.dream-editor[data-v-ea1aa206] { border-width:3px; border-radius:16px; box-shadow:6px 6px 0 var(--dream-red ); } .workbench-hero[data-v-ea1aa206] { box-shadow:6px 6px 0 var(--dream-black ); } .hero-main[data-v-ea1aa206] { flex-direction:column; } .hero-copy h1[data-v-ea1aa206],.workbench-hero h1[data-v-ea1aa206] { font-size:clamp(38px,12vw,56px); } .hero-copy p[data-v-ea1aa206],.workbench-hero p[data-v-ea1aa206],.section-head p[data-v-ea1aa206],.editor-head p[data-v-ea1aa206] { font-size:14px; line-height:1.7; } .hero-board[data-v-ea1aa206] { display:none; } .amount-grid[data-v-ea1aa206],.budget-overview[data-v-ea1aa206],.dream-main-row[data-v-ea1aa206] { grid-template-columns:1fr; } .amount-card[data-v-ea1aa206] { min-height:132px; } .amount-card strong[data-v-ea1aa206] { margin-top:26px; } .section-head[data-v-ea1aa206],.editor-head[data-v-ea1aa206],.progress-topline[data-v-ea1aa206],.dream-footer[data-v-ea1aa206] { align-items:flex-start; flex-direction:column; } .desktop-add[data-v-ea1aa206] { display:none; } .mobile-add[data-v-ea1aa206] { display:inline-flex; align-items:center; justify-content:center; width:100%; } .dreams-scroll-area[data-v-ea1aa206] { max-height:none; padding-right:0; overflow:visible; } .dream-item[data-v-ea1aa206] { padding:14px; box-shadow:5px 5px 0 var(--dream-black ); } .cost-input-wrapper[data-v-ea1aa206] { height:58px; } .footer-tip[data-v-ea1aa206] { text-align:left; } } @media (max-width:420px) { .dream-page[data-v-ea1aa206] { padding-left:12px; padding-right:12px; } .select-hero[data-v-ea1aa206],.workbench-hero[data-v-ea1aa206],.budget-overview[data-v-ea1aa206],.progress-panel[data-v-ea1aa206],.dream-editor[data-v-ea1aa206] { padding:16px; } .total-budget-box strong[data-v-ea1aa206],.budget-metric strong[data-v-ea1aa206] { font-size:24px; } } .time-lessons-page[data-v-76d07ea1] { --page-bg:#F1DDDF; --panel-bg:#FFF9F7; --accent:#E72D48; --text:#1A1A1D; --positive:#2FA84F; min-height:100vh; padding:34px 24px 142px; background:radial-gradient(circle at 16px 16px,rgba(26,26,29,0.12) 2px,transparent 3px) 0 0/28px 28px,var(--page-bg ); color:var(--text ); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Arial,sans-serif; box-sizing:border-box; overflow-x:hidden; } .time-lessons-page *[data-v-76d07ea1] { box-sizing:border-box; } .page-shell[data-v-76d07ea1] { width:min(100%,1360px); margin:0 auto; } .hero-panel[data-v-76d07ea1] { position:relative; display:grid; grid-template-columns:minmax(0,1fr) 220px; gap:28px; align-items:stretch; margin-bottom:26px; padding:34px; background:var(--panel-bg ); border:3px solid var(--text ); box-shadow:8px 8px 0 var(--accent ); } .hero-panel[data-v-76d07ea1]::after { content:""; position:absolute; right:24px; top:22px; width:54px; height:54px; background:linear-gradient(90deg,var(--text ) 3px,transparent 3px) 0 0/14px 14px,linear-gradient(var(--text ) 3px,transparent 3px) 0 0/14px 14px; opacity:0.16; pointer-events:none; } .hero-copy[data-v-76d07ea1] { position:relative; z-index:1; } .sticker[data-v-76d07ea1] { display:inline-flex; align-items:center; justify-content:center; margin-bottom:18px; padding:8px 14px; background:var(--accent ); color:var(--panel-bg ); border:3px solid var(--text ); box-shadow:5px 5px 0 var(--text ); font-size:15px; font-weight:900; letter-spacing:1px; transform:rotate(-1deg); } .hero-copy h1[data-v-76d07ea1] { margin:0; max-width:760px; font-size:clamp(34px,5vw,68px); line-height:1.02; font-weight:950; letter-spacing:-2px; } .hero-copy p[data-v-76d07ea1] { max-width:620px; margin:18px 0 0; color:var(--text ); font-size:18px; line-height:1.7; font-weight:700; } .hero-stat[data-v-76d07ea1] { display:flex; min-height:178px; padding:22px; flex-direction:column; justify-content:center; align-items:center; background:var(--accent ); color:var(--panel-bg ); border:3px solid var(--text ); box-shadow:8px 8px 0 var(--text ); text-align:center; } .stat-number[data-v-76d07ea1] { display:block; font-size:clamp(44px,6vw,76px); line-height:0.95; font-weight:950; letter-spacing:-2px; } .stat-label[data-v-76d07ea1] { display:block; margin-top:12px; font-size:17px; font-weight:900; } .list-panel[data-v-76d07ea1] { padding:28px; background:var(--panel-bg ); border:3px solid var(--text ); box-shadow:8px 8px 0 var(--accent ); } .section-head[data-v-76d07ea1] { display:flex; gap:20px; align-items:flex-start; justify-content:space-between; margin-bottom:20px; padding-bottom:18px; border-bottom:3px solid var(--text ); } .section-head h2[data-v-76d07ea1] { margin:0; font-size:clamp(22px,2.4vw,34px); line-height:1.15; font-weight:950; } .section-head p[data-v-76d07ea1] { margin:8px 0 0; color:rgba(26,26,29,0.74); font-size:15px; line-height:1.5; font-weight:700; } .count-pill[data-v-76d07ea1] { flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center; min-width:92px; padding:9px 12px; background:#F1DDDF; border:3px solid var(--text ); box-shadow:4px 4px 0 var(--text ); font-size:14px; font-weight:950; } .lesson-list[data-v-76d07ea1] { display:flex; flex-direction:column; gap:14px; margin:0; padding:0; list-style:none; } .lesson-item[data-v-76d07ea1] { display:grid; grid-template-columns:62px minmax(0,1fr); align-items:start; min-height:72px; padding:16px 18px; background:#FFF9F7; border:3px solid var(--text ); box-shadow:5px 5px 0 rgba(26,26,29,0.95); animation:itemIn-76d07ea1 0.35s both; animation-delay:var(--delay ); transition:transform 0.18s ease,box-shadow 0.18s ease,background 0.18s ease; } .lesson-item[data-v-76d07ea1]:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 var(--accent ); background:#fff3ef; } .lesson-index[data-v-76d07ea1] { width:42px; height:42px; display:inline-flex; align-items:center; justify-content:center; background:var(--accent ); color:var(--panel-bg ); border:3px solid var(--text ); box-shadow:3px 3px 0 var(--text ); font-size:14px; font-weight:950; } .lesson-text[data-v-76d07ea1] { min-width:0; margin:6px 0 0; color:var(--text ); font-size:18px; line-height:1.75; font-weight:800; word-break:break-word; overflow-wrap:anywhere; } .empty-state[data-v-76d07ea1] { min-height:260px; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:34px 18px; background:#F1DDDF; border:3px dashed var(--text ); text-align:center; } .empty-icon[data-v-76d07ea1] { display:inline-flex; width:54px; height:54px; align-items:center; justify-content:center; margin-bottom:14px; background:var(--accent ); color:var(--panel-bg ); border:3px solid var(--text ); box-shadow:4px 4px 0 var(--text ); font-size:30px; font-weight:950; } .empty-state h3[data-v-76d07ea1] { margin:0; font-size:24px; font-weight:950; } .empty-state p[data-v-76d07ea1] { margin:8px 0 0; font-size:16px; line-height:1.6; font-weight:700; } .loading-area[data-v-76d07ea1],.no-more[data-v-76d07ea1] { display:flex; align-items:center; justify-content:center; gap:10px; padding:28px 0 10px; color:rgba(26,26,29,0.72); font-size:15px; font-weight:900; } .loading-dot[data-v-76d07ea1] { width:14px; height:14px; background:var(--accent ); border:3px solid var(--text ); box-shadow:3px 3px 0 var(--text ); animation:pulseDot-76d07ea1 0.8s infinite alternate; } .input-fixed-area[data-v-76d07ea1] { position:fixed; left:0; right:0; bottom:0; z-index:100; padding:18px 24px 22px; background:linear-gradient(180deg,rgba(241,221,223,0) 0%,#F1DDDF 32%,#F1DDDF 100%); } .input-inner[data-v-76d07ea1] { width:min(100%,980px); margin:0 auto; padding:13px; background:var(--panel-bg ); border:3px solid var(--text ); box-shadow:8px 8px 0 var(--text ); } .input-label[data-v-76d07ea1] { margin-bottom:8px; font-size:13px; line-height:1; font-weight:950; } .input-wrapper[data-v-76d07ea1] { display:grid; grid-template-columns:minmax(0,1fr) 108px; gap:10px; align-items:center; } .motto-input[data-v-76d07ea1] { width:100%; min-width:0; height:50px; padding:0 15px; background:var(--panel-bg ); color:var(--text ); border:3px solid var(--text ); border-radius:0; outline:none; font-size:16px; font-weight:800; } .motto-input[data-v-76d07ea1]::-moz-placeholder { color:rgba(26,26,29,0.44); } .motto-input[data-v-76d07ea1]::placeholder { color:rgba(26,26,29,0.44); } .motto-input[data-v-76d07ea1]:focus { box-shadow:4px 4px 0 var(--accent ); } .send-btn[data-v-76d07ea1] { height:50px; background:var(--accent ); color:var(--panel-bg ); border:3px solid var(--text ); box-shadow:5px 5px 0 var(--text ); border-radius:0; cursor:pointer; font-size:16px; font-weight:950; transition:transform 0.18s ease,box-shadow 0.18s ease,opacity 0.18s ease; } .send-btn[data-v-76d07ea1]:hover:not(:disabled) { transform:translate(-2px,-2px); box-shadow:7px 7px 0 var(--text ); } .send-btn[data-v-76d07ea1]:active:not(:disabled) { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--text ); } .send-btn[data-v-76d07ea1]:disabled { cursor:not-allowed; opacity:0.55; } .bottomPower[data-v-76d07ea1] { margin-top:5px; font-size:0.7rem; opacity:0.3; font-style:italic; } @keyframes itemIn-76d07ea1 { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } } @keyframes pulseDot-76d07ea1 { from { transform:translateY(0); } to { transform:translateY(-5px); } } @media screen and (min-width:1600px) { .page-shell[data-v-76d07ea1] { width:min(100%,1420px); } .list-panel[data-v-76d07ea1] { padding:32px; } .lesson-list[data-v-76d07ea1] { max-width:1120px; } } @media screen and (max-width:1024px) { .time-lessons-page[data-v-76d07ea1] { padding:28px 20px 140px; } .hero-panel[data-v-76d07ea1] { grid-template-columns:1fr; } .hero-stat[data-v-76d07ea1] { min-height:132px; align-items:flex-start; text-align:left; } } @media screen and (max-width:768px) { .time-lessons-page[data-v-76d07ea1] { padding:22px 16px 148px; } .hero-panel[data-v-76d07ea1],.list-panel[data-v-76d07ea1] { padding:20px; box-shadow:6px 6px 0 var(--accent ); } .hero-copy h1[data-v-76d07ea1] { letter-spacing:-1px; } .hero-copy p[data-v-76d07ea1] { font-size:16px; } .section-head[data-v-76d07ea1] { flex-direction:column; gap:12px; } .count-pill[data-v-76d07ea1] { align-self:flex-start; } .lesson-item[data-v-76d07ea1] { grid-template-columns:48px minmax(0,1fr); min-height:64px; padding:14px; box-shadow:4px 4px 0 var(--text ); } .lesson-index[data-v-76d07ea1] { width:36px; height:36px; font-size:12px; } .lesson-text[data-v-76d07ea1] { margin-top:3px; font-size:16px; line-height:1.65; } .input-fixed-area[data-v-76d07ea1] { padding:14px 16px 18px; } .input-inner[data-v-76d07ea1] { padding:11px; box-shadow:6px 6px 0 var(--text ); } } @media screen and (max-width:480px) { .time-lessons-page[data-v-76d07ea1] { padding:18px 16px 158px; } .sticker[data-v-76d07ea1] { font-size:13px; } .hero-panel[data-v-76d07ea1]::after { display:none; } .hero-stat[data-v-76d07ea1] { min-height:108px; padding:18px; } .lesson-item[data-v-76d07ea1] { grid-template-columns:1fr; gap:8px; } .lesson-index[data-v-76d07ea1] { width:auto; height:30px; justify-content:flex-start; padding:0 10px; } .input-wrapper[data-v-76d07ea1] { grid-template-columns:1fr; } .motto-input[data-v-76d07ea1],.send-btn[data-v-76d07ea1] { height:48px; } } .personal-container[data-v-e49a4730] { min-height:100vh; background:linear-gradient(135deg,#f6d365 0%,#fda085 100%); padding:20px; font-family:"PingFang SC","Microsoft YaHei",sans-serif; } .nav-header[data-v-e49a4730] { background:rgba(255,255,255,0.95); padding:20px; border-radius:15px; margin-bottom:20px; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); box-shadow:0 8px 20px rgba(0,0,0,0.1); display:flex; justify-content:space-between; align-items:center; } .nav-header h1[data-v-e49a4730] { margin:0; font-size:26px; font-weight:700; background:linear-gradient(45deg,#ff6b6b,#fda085); -webkit-background-clip:text; -webkit-text-fill-color:transparent; } .main-content[data-v-e49a4730] { max-width:800px; margin:0 auto; } .profile-card[data-v-e49a4730] { background:rgba(255,255,255,0.95); border-radius:25px; box-shadow:0 15px 35px rgba(0,0,0,0.1); overflow:hidden; transition: 0.4s cubic-bezier(0.4,0,0.2,1); } .profile-card.is-saving[data-v-e49a4730] { transform:scale(0.98); opacity:0.8; } .profile-card[data-v-e49a4730]:hover { transform:translateY(-5px); box-shadow:0 20px 40px rgba(0,0,0,0.15); } .profile-header[data-v-e49a4730] { padding:40px; background:linear-gradient(120deg,#fccb90 0%,#d4d2db 100%); position:relative; overflow:hidden; } .avatar-section[data-v-e49a4730] { text-align:center; margin-bottom:30px; } .avatar-wrapper[data-v-e49a4730] { position:relative; display:inline-block; cursor:pointer; transition:transform 0.3s ease; } .avatar-wrapper[data-v-e49a4730]:hover { transform:scale(1.05); } .avatar-img[data-v-e49a4730] { width:120px; height:120px; border-radius:50%; -o-object-fit:cover; object-fit:cover; border:4px solid #fff; box-shadow:0 5px 15px rgba(0,0,0,0.2); transition: 0.3s ease; } .avatar-ring[data-v-e49a4730] { position:absolute; top:-4px; left:-4px; right:-4px; bottom:-4px; border-radius:50%; border:2px solid rgba(255,255,255,0.5); animation:ring-rotate-e49a4730 8s linear infinite; } @keyframes ring-rotate-e49a4730 { from { transform:rotate(0deg); } to { transform:rotate(360deg); } } .avatar-mask[data-v-e49a4730] { position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5); border-radius:50%; display:flex; flex-direction:column; justify-content:center; align-items:center; color:#fff; font-size:16px; opacity:0; transition:opacity 0.3s ease; } .avatar-wrapper:hover .avatar-mask[data-v-e49a4730] { opacity:1; } .profile-info[data-v-e49a4730] { max-width:500px; margin:0 auto; } .custom-input[data-v-e49a4730]:hover { transform:translateY(-2px); box-shadow:0 4px 15px rgba(0,0,0,0.08); } .custom-input[data-v-e49a4730] .el-input__inner { height:45px; padding:0 20px; font-size:15px; border:none; background:transparent; } .custom-input[data-v-e49a4730] .el-input__prefix { left:15px; color:var(--el-color-primary ); } .custom-textarea[data-v-e49a4730] .el-textarea__inner { padding:15px 20px; border-radius:12px; border:none; background:rgba(255,255,255,0.9); box-shadow:0 2px 12px rgba(0,0,0,0.04); transition: 0.3s ease; } .custom-textarea[data-v-e49a4730] .el-textarea__inner:hover { box-shadow:0 4px 15px rgba(0,0,0,0.08); } .nickname-input[data-v-e49a4730] { margin-bottom:15px; } .nickname-input[data-v-e49a4730] .el-input__inner { font-size:18px; text-align:center; } .bio-input[data-v-e49a4730] { margin-bottom:0; } .custom-tabs[data-v-e49a4730] { margin:20px; } .custom-tabs[data-v-e49a4730] .el-tabs__header { margin-bottom:30px; } .animated-form .el-form-item[data-v-e49a4730] { transition: 0.3s ease; transform-origin:left; } .animated-form .el-form-item[data-v-e49a4730]:hover { transform:translateX(5px); } .gender-group[data-v-e49a4730] { display:flex; gap:20px; } .social-inputs[data-v-e49a4730] { display:grid; grid-template-columns:1fr 1fr; gap:15px; } .custom-fields[data-v-e49a4730] { padding:20px; } .custom-field-item[data-v-e49a4730] { display:grid; grid-template-columns:2fr 3fr auto; gap:10px; margin-bottom:15px; align-items:center; } .custom-field-list-enter-active[data-v-e49a4730],.custom-field-list-leave-active[data-v-e49a4730] { transition: 0.5s ease; } .custom-field-list-enter-from[data-v-e49a4730],.custom-field-list-leave-to[data-v-e49a4730] { opacity:0; transform:translateY(30px); } .delete-btn[data-v-e49a4730] { transition: 0.3s ease; } .delete-btn[data-v-e49a4730]:hover { transform:rotate(90deg); } .add-field-btn[data-v-e49a4730] { margin-top:20px; width:100%; height:45px; border-radius:22.5px; transition: 0.3s ease; } .add-field-btn[data-v-e49a4730]:hover { transform:translateY(-2px); box-shadow:0 5px 15px rgba(0,0,0,0.1); } .action-buttons[data-v-e49a4730] { text-align:center; padding:30px; background:linear-gradient(to top,rgba(255,255,255,0.9),transparent); } .action-buttons .el-button[data-v-e49a4730] { width:200px; height:45px; margin:0 10px; border-radius:22.5px; transition: 0.3s ease; } .save-btn[data-v-e49a4730]:hover { transform:translateY(-2px); box-shadow:0 5px 15px rgba(24,144,255,0.3); } .reset-btn[data-v-e49a4730]:hover { transform:translateY(-2px); box-shadow:0 5px 15px rgba(0,0,0,0.1); } @media screen and (max-width:768px) { .personal-container[data-v-e49a4730] { padding:10px; } .profile-header[data-v-e49a4730] { padding:20px; } .custom-field-item[data-v-e49a4730] { grid-template-columns:1fr; gap:5px; } .action-buttons .el-button[data-v-e49a4730] { width:45%; } .social-inputs[data-v-e49a4730] { grid-template-columns:1fr; } } .period-page[data-v-43b28abb] { min-height:100vh; color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); } .period-shell[data-v-43b28abb] { width:min(1480px,calc(100% - 32px)); margin:0 auto; padding:clamp(54px,6vw,86px) 0 clamp(40px,6vw,74px); } .period-hero[data-v-43b28abb] { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,440px); gap:clamp(18px,3vw,34px); align-items:flex-end; margin-bottom:clamp(18px,3vw,34px); } .eyebrow[data-v-43b28abb],.panel-head span[data-v-43b28abb],.history-head span[data-v-43b28abb],.section-title span[data-v-43b28abb] { display:inline-flex; color:var(--color-primary ); font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .hero-copy h1[data-v-43b28abb] { margin:8px 0 12px; color:var(--color-text ); font-size:clamp(38px,5.2vw,76px); line-height:1; letter-spacing:0; } .hero-copy p[data-v-43b28abb] { max-width:767px; margin:0; color:var(--color-text-soft ); font-size:clamp(15px,1.35vw,19px); line-height:1.75; } .hero-card[data-v-43b28abb],.period-panel[data-v-43b28abb],.prediction-card[data-v-43b28abb] { border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 24px 70px var(--color-shadow ); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-card[data-v-43b28abb] { padding:clamp(20px,2.6vw,30px); color:var(--color-button-text ); background:linear-gradient(135deg,#26334b,#4b5c7a); } .hero-card.period[data-v-43b28abb] { background:linear-gradient(135deg,#be3455,#ef6f61); } .hero-card.fertile[data-v-43b28abb] { background:linear-gradient(135deg,#0f766e,#19c99a); } .hero-card.ovulation[data-v-43b28abb] { background:linear-gradient(135deg,#6d4ed8,#2ac4ff); } .hero-card.pms[data-v-43b28abb] { background:linear-gradient(135deg,#9a5a00,#ffcf45); } .hero-card span[data-v-43b28abb],.hero-card p[data-v-43b28abb] { color:rgba(255,255,255,0.78); } .hero-card span[data-v-43b28abb] { font-size:12px; font-weight:900; } .hero-card strong[data-v-43b28abb] { display:block; margin:8px 0; font-size:clamp(28px,3vw,42px); line-height:1.08; } .hero-card p[data-v-43b28abb] { margin:0; line-height:1.7; } .period-workbench[data-v-43b28abb] { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(340px,0.85fr); gap:clamp(16px,2vw,24px); align-items:start; } .period-panel[data-v-43b28abb] { padding:clamp(20px,2.5vw,30px); } .panel-head[data-v-43b28abb],.history-head[data-v-43b28abb],.section-title[data-v-43b28abb],.prediction-head[data-v-43b28abb] { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; min-width:0; } .panel-head h2[data-v-43b28abb],.section-title h2[data-v-43b28abb] { margin:6px 0 0; color:var(--color-text ); font-size:24px; letter-spacing:0; } .panel-head > div[data-v-43b28abb],.history-head > div[data-v-43b28abb],.section-title > div[data-v-43b28abb],.prediction-head > div[data-v-43b28abb],.prediction-head > span[data-v-43b28abb] { min-width:0; } .form-grid[data-v-43b28abb] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:22px; } .form-grid label[data-v-43b28abb],.history-form[data-v-43b28abb] { min-width:0; } .form-grid label > span[data-v-43b28abb],.range-row span[data-v-43b28abb],.next-card span[data-v-43b28abb],.insight-grid span[data-v-43b28abb],.history-item span[data-v-43b28abb] { display:block; color:#64748b; font-size:12px; font-weight:900; } input[data-v-43b28abb] { width:100%; min-height:44px; padding:0 12px; border:1px solid rgba(15,23,42,0.14); border-radius:8px; background:var(--color-surface ); color:var(--color-text ); box-sizing:border-box; font-weight:800; outline:none; } input[data-v-43b28abb]:focus { border-color:rgba(42,196,255,0.8); box-shadow:0 0 0 4px rgba(42,196,255,0.12); } .date-field[data-v-43b28abb] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; } .date-field button[data-v-43b28abb] { min-height:44px; padding:0 14px; border:none; border-radius:8px; background:#eef6ff; color:#2563eb; font-weight:900; cursor:pointer; } .number-field[data-v-43b28abb] { position:relative; } .number-field em[data-v-43b28abb] { position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#64748b; font-size:13px; font-style:normal; font-weight:900; pointer-events:none; } .number-field input[data-v-43b28abb] { padding-right:44px; } .range-row[data-v-43b28abb] { margin-top:18px; padding:16px; border-radius:8px; background:#f3f7fb; } .range-row > div[data-v-43b28abb] { display:flex; justify-content:space-between; gap:12px; align-items:center; } .range-row strong[data-v-43b28abb] { color:var(--color-text ); } .range-row input[data-v-43b28abb] { min-height:auto; margin-top:12px; padding:0; } .history-box[data-v-43b28abb] { margin-top:18px; padding:18px; border:1px solid rgba(15,23,42,0.08); border-radius:8px; background:var(--color-surface ); } .history-head h3[data-v-43b28abb] { margin:4px 0 0; color:var(--color-text ); } .switch-line[data-v-43b28abb] { display:inline-flex; align-items:center; gap:8px; color:#334155; font-size:13px; font-weight:900; } .switch-line input[data-v-43b28abb] { width:auto; min-height:auto; } .history-form[data-v-43b28abb] { display:grid; grid-template-columns:minmax(0,1fr) 110px auto; gap:10px; margin-top:14px; } .ghost-button[data-v-43b28abb],.primary-button[data-v-43b28abb],.copy-button[data-v-43b28abb],.history-item button[data-v-43b28abb] { min-height:42px; border:none; border-radius:8px; font-weight:900; cursor:pointer; transition:transform 0.2s ease,box-shadow 0.2s ease,background 0.2s ease; } .ghost-button[data-v-43b28abb] { padding:0 16px; background:#eef6ff; color:#2563eb; } .primary-button[data-v-43b28abb],.copy-button[data-v-43b28abb] { padding:0 18px; background:var(--color-button ); color:var(--color-button-text ); } .copy-button[data-v-43b28abb] { width:100%; margin-top:16px; } .ghost-button[data-v-43b28abb]:hover,.primary-button[data-v-43b28abb]:hover,.copy-button[data-v-43b28abb]:hover,.history-item button[data-v-43b28abb]:hover { transform:translateY(-2px); } .copy-button[data-v-43b28abb]:disabled { cursor:not-allowed; opacity:0.55; } .history-list[data-v-43b28abb] { display:grid; gap:8px; margin-top:14px; } .history-item[data-v-43b28abb] { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:10px 12px; border-radius:8px; background:var(--color-bg-soft ); min-width:0; } .history-item strong[data-v-43b28abb] { display:block; color:var(--color-text ); } .history-item button[data-v-43b28abb] { min-height:32px; padding:0 10px; background:#fff1f2; color:#be123c; } .empty-state[data-v-43b28abb] { margin-top:14px; padding:14px; border-radius:8px; background:var(--color-bg-soft ); color:#64748b; line-height:1.7; } .next-card[data-v-43b28abb] { margin-top:20px; padding:22px; border-radius:8px; background:linear-gradient(135deg,#111827,#25324a); color:var(--color-button-text ); } .next-card span[data-v-43b28abb],.next-card p[data-v-43b28abb] { color:rgba(255,255,255,0.72); } .next-card strong[data-v-43b28abb] { display:block; margin:8px 0; font-size:clamp(30px,3vw,44px); line-height:1; } .next-card p[data-v-43b28abb] { margin:0; font-weight:900; } .insight-grid[data-v-43b28abb] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; } .insight-grid div[data-v-43b28abb] { min-width:0; padding:14px; border-radius:8px; background:var(--color-bg-soft ); } .insight-grid strong[data-v-43b28abb] { display:block; margin:6px 0 2px; color:var(--color-text ); font-size:17px; line-height:1.25; } .insight-grid small[data-v-43b28abb] { color:#64748b; font-weight:800; } .quality-card[data-v-43b28abb],.formula-card[data-v-43b28abb],.warning-list[data-v-43b28abb] { margin-top:14px; padding:14px; border-radius:8px; } .quality-card[data-v-43b28abb] { background:#eef6ff; color:#1d4ed8; } .quality-card.good[data-v-43b28abb] { background:#e9fbf4; color:#047857; } .quality-card.warn[data-v-43b28abb] { background:#fff7d8; color:#9a5a00; } .quality-card.alert[data-v-43b28abb] { background:#fff1f2; color:#be123c; } .quality-card strong[data-v-43b28abb] { display:block; margin-bottom:6px; } .quality-card p[data-v-43b28abb],.formula-card p[data-v-43b28abb],.warning-list p[data-v-43b28abb] { margin:0; line-height:1.65; } .formula-card[data-v-43b28abb] { background:#f3f7fb; color:#334155; } .formula-card strong[data-v-43b28abb] { display:block; margin-bottom:6px; color:var(--color-text ); } .warning-list[data-v-43b28abb] { display:grid; gap:8px; background:#fff7ed; color:#9a3412; font-weight:800; } .calendar-panel[data-v-43b28abb] { margin-top:clamp(16px,2vw,24px); } .legend-row[data-v-43b28abb] { display:flex; align-items:center; flex-wrap:wrap; gap:8px; color:#64748b; font-size:13px; font-weight:900; } .legend[data-v-43b28abb] { width:10px; height:10px; border-radius:999px; } .legend.period[data-v-43b28abb] { background:#ff6f9f; } .legend.fertile[data-v-43b28abb] { background:#19c99a; } .legend.ovulation[data-v-43b28abb] { background:#7c5cff; } .legend.pms[data-v-43b28abb] { background:#ffcf45; } .week-row[data-v-43b28abb],.calendar-grid[data-v-43b28abb] { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:8px; } .week-row[data-v-43b28abb] { margin:20px 0 8px; } .week-row span[data-v-43b28abb] { color:#64748b; font-size:12px; font-weight:900; text-align:center; } .calendar-day[data-v-43b28abb] { position:relative; min-height:58px; padding:8px; border:1px solid rgba(15,23,42,0.08); border-radius:8px; background:var(--color-surface ); color:#334155; cursor:default; text-align:left; } .calendar-day span[data-v-43b28abb],.calendar-day small[data-v-43b28abb] { position:relative; z-index:2; display:block; font-weight:900; } .calendar-day small[data-v-43b28abb] { margin-top:8px; color:var(--color-muted ); font-size:11px; } .calendar-day.is-muted[data-v-43b28abb] { opacity:0.48; } .calendar-day.is-period[data-v-43b28abb] { background:#fff0f4; border-color:rgba(255,111,159,0.35); } .calendar-day.is-fertile[data-v-43b28abb] { background:#ecfdf7; border-color:rgba(25,201,154,0.34); } .calendar-day.is-ovulation[data-v-43b28abb] { background:#f1edff; border-color:rgba(124,92,255,0.36); } .calendar-day.is-pms[data-v-43b28abb] { background:#fff8df; border-color:rgba(255,207,69,0.5); } .calendar-day.is-today[data-v-43b28abb] { box-shadow:inset 0 0 0 2px #111827; } .prediction-section[data-v-43b28abb] { margin-top:clamp(18px,3vw,30px); } .prediction-grid[data-v-43b28abb] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:16px; } .prediction-card[data-v-43b28abb] { padding:18px; } .prediction-head span[data-v-43b28abb] { color:#64748b; font-size:12px; font-weight:900; } .prediction-head strong[data-v-43b28abb] { color:var(--color-text ); font-size:20px; } .cycle-line[data-v-43b28abb] { position:relative; height:12px; margin:18px 0; border-radius:999px; background:#e8eef6; } .cycle-line span[data-v-43b28abb] { position:absolute; top:0; bottom:0; border-radius:inherit; } .period-segment[data-v-43b28abb] { background:#ff6f9f; } .fertile-segment[data-v-43b28abb] { background:#19c99a; } .ovulation-dot[data-v-43b28abb] { width:12px; height:12px; transform:translateX(-50%); background:#7c5cff; box-shadow:0 0 0 4px rgba(124,92,255,0.16); } .prediction-card dl[data-v-43b28abb] { display:grid; gap:10px; margin:0; } .prediction-card dl div[data-v-43b28abb] { display:flex; justify-content:space-between; gap:12px; color:var(--color-text-soft ); font-size:13px; font-weight:800; min-width:0; } .prediction-card dt[data-v-43b28abb],.prediction-card dd[data-v-43b28abb] { margin:0; } .prediction-card dd[data-v-43b28abb] { color:var(--color-text ); text-align:right; } .health-note[data-v-43b28abb] { max-width:991px; margin:22px auto 0; color:#64748b; font-size:13px; line-height:1.8; text-align:center; } .period-toast[data-v-43b28abb] { position:fixed; left:50%; bottom:28px; z-index:1200; transform:translateX(-50%); padding:12px 16px; border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); font-size:14px; font-weight:900; box-shadow:0 20px 50px rgba(15,23,42,0.2); } .toast-pop-enter-active[data-v-43b28abb],.toast-pop-leave-active[data-v-43b28abb] { transition:opacity 0.24s ease,transform 0.24s ease; } .toast-pop-enter[data-v-43b28abb],.toast-pop-leave-to[data-v-43b28abb] { opacity:0; transform:translate(-50%,10px); } @media (max-width:1199px) { .period-hero[data-v-43b28abb],.period-workbench[data-v-43b28abb],.prediction-grid[data-v-43b28abb] { grid-template-columns:1fr; } } @media (max-width:767px) { .period-shell[data-v-43b28abb] { width:min(100% - 20px,1480px); padding-top:42px; } .period-hero[data-v-43b28abb] { gap:12px; } .hero-copy h1[data-v-43b28abb] { font-size:34px; } .hero-copy p[data-v-43b28abb] { font-size:13px; line-height:1.55; } .hero-card[data-v-43b28abb],.period-panel[data-v-43b28abb],.prediction-card[data-v-43b28abb] { padding:16px; } .form-grid[data-v-43b28abb],.insight-grid[data-v-43b28abb],.history-form[data-v-43b28abb],.date-field[data-v-43b28abb],.result-meta[data-v-43b28abb] { grid-template-columns:1fr; } .panel-head[data-v-43b28abb],.history-head[data-v-43b28abb],.section-title[data-v-43b28abb],.prediction-head[data-v-43b28abb] { align-items:flex-start; flex-direction:column; } .legend-row[data-v-43b28abb] { gap:6px; } .week-row[data-v-43b28abb],.calendar-grid[data-v-43b28abb] { gap:5px; } .calendar-day[data-v-43b28abb] { min-height:48px; padding:6px; border-radius:7px; } .calendar-day small[data-v-43b28abb] { display:none; } .prediction-card dl div[data-v-43b28abb] { display:grid; gap:2px; } .prediction-card dd[data-v-43b28abb] { text-align:left; } } .period-page[data-v-43b28abb] { --pink-bg:#F1DDDF; --cream:#FFF9F7; --ink:#1A1A1D; --red:#E72D48; --green:#2FA84F; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.13) 2px,transparent 2.5px) 0 0/26px 26px,var(--pink-bg ) !important; color:var(--ink ); overflow-x:hidden; } .period-page *[data-v-43b28abb],.period-page *[data-v-43b28abb]::before,.period-page *[data-v-43b28abb]::after{box-sizing:border-box;} .period-shell[data-v-43b28abb]{width:min(100%,1380px); margin:0 auto;} .period-hero[data-v-43b28abb],.period-panel[data-v-43b28abb],.hero-card[data-v-43b28abb],.history-box[data-v-43b28abb],.next-card[data-v-43b28abb],.quality-card[data-v-43b28abb],.formula-card[data-v-43b28abb],.calendar-day[data-v-43b28abb]{background:var(--cream ) !important;color:var(--ink ) !important;border:3px solid var(--ink ) !important;border-radius:24px !important;box-shadow:8px 8px 0 var(--red ) !important;} .period-hero[data-v-43b28abb]{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,360px);gap:20px;align-items:end;} .hero-copy h1[data-v-43b28abb]{color:var(--ink );line-height:1.05;letter-spacing:-1.5px;}.hero-copy p[data-v-43b28abb]{color:rgba(26,26,29,.76);line-height:1.75;}.eyebrow[data-v-43b28abb],.section-title span[data-v-43b28abb]{display:inline-flex;width:-moz-fit-content;width:fit-content;padding:6px 12px;border:3px solid var(--ink );border-radius:999px;background:var(--red );color:var(--cream );box-shadow:4px 4px 0 var(--ink );font-weight:900;} .hero-card[data-v-43b28abb]{box-shadow:8px 8px 0 var(--ink ) !important;}.hero-card strong[data-v-43b28abb]{color:var(--red );}.hero-card.period[data-v-43b28abb],.hero-card.fertile[data-v-43b28abb],.hero-card.ovulation[data-v-43b28abb],.hero-card.pms[data-v-43b28abb]{background:var(--red ) !important;color:var(--cream ) !important;} .period-workbench[data-v-43b28abb]{display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,380px);gap:22px;align-items:start;}.period-panel[data-v-43b28abb]{min-width:0;padding:clamp(16px,2vw,24px);}.insight-panel[data-v-43b28abb]{position:sticky;top:20px;} .form-grid[data-v-43b28abb],.history-form[data-v-43b28abb],.insight-grid[data-v-43b28abb],.range-row[data-v-43b28abb]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}.date-field[data-v-43b28abb],.number-field[data-v-43b28abb],.range-row>div[data-v-43b28abb]{min-width:0;} .date-field input[data-v-43b28abb],.number-field input[data-v-43b28abb],.range-row input[data-v-43b28abb],input[data-v-43b28abb],select[data-v-43b28abb],textarea[data-v-43b28abb]{max-width:100%;min-width:0;border:3px solid var(--ink ) !important;border-radius:14px !important;background:#fff !important;color:var(--ink ) !important;font-weight:800;} .date-field input[data-v-43b28abb]:focus,.number-field input[data-v-43b28abb]:focus,input[data-v-43b28abb]:focus,select[data-v-43b28abb]:focus,textarea[data-v-43b28abb]:focus{outline:none;box-shadow:0 0 0 4px rgba(231,45,72,.18) !important;} .primary-button[data-v-43b28abb],.ghost-button[data-v-43b28abb],.copy-button[data-v-43b28abb],.history-item button[data-v-43b28abb],.date-field button[data-v-43b28abb]{border:3px solid var(--ink ) !important;border-radius:14px !important;background:var(--cream ) !important;color:var(--ink ) !important;font-weight:900;box-shadow:4px 4px 0 var(--ink ) !important;transition:transform .15s ease,box-shadow .15s ease;} .primary-button[data-v-43b28abb],.copy-button[data-v-43b28abb]{background:var(--red ) !important;color:var(--cream ) !important;}.primary-button[data-v-43b28abb]:hover,.ghost-button[data-v-43b28abb]:hover,.copy-button[data-v-43b28abb]:hover,.history-item button[data-v-43b28abb]:hover,.date-field button[data-v-43b28abb]:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink ) !important;}.primary-button[data-v-43b28abb]:active,.ghost-button[data-v-43b28abb]:active,.copy-button[data-v-43b28abb]:active,.history-item button[data-v-43b28abb]:active,.date-field button[data-v-43b28abb]:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink ) !important;} .history-list[data-v-43b28abb]{display:grid;gap:10px;max-height:340px;overflow:auto;padding-right:4px;}.history-item[data-v-43b28abb]{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;border:3px solid var(--ink ) !important;border-radius:16px !important;background:#fff !important;box-shadow:4px 4px 0 rgba(26,26,29,.2) !important;} .calendar-panel[data-v-43b28abb]{margin-top:22px;}.legend-row[data-v-43b28abb]{display:flex;flex-wrap:wrap;gap:10px;}.calendar-grid[data-v-43b28abb]{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;}.calendar-day[data-v-43b28abb]{min-width:0;box-shadow:3px 3px 0 var(--ink ) !important;aspect-ratio:1/1;overflow:hidden;}.calendar-day small[data-v-43b28abb]{font-weight:900;}.calendar-day.is-period[data-v-43b28abb]{background:var(--red ) !important;color:var(--cream )!important;}.calendar-day.is-fertile[data-v-43b28abb],.calendar-day.is-ovulation[data-v-43b28abb],.calendar-day.is-pms[data-v-43b28abb]{box-shadow:3px 3px 0 var(--green ) !important;} @media(max-width:1199px){.period-workbench[data-v-43b28abb],.period-hero[data-v-43b28abb]{grid-template-columns:1fr}.insight-panel[data-v-43b28abb]{position:static}.insight-panel.mobile-hidden[data-v-43b28abb]{display:block!important}} @media(max-width:767px){.period-page[data-v-43b28abb]{padding:14px!important}.period-hero[data-v-43b28abb],.period-panel[data-v-43b28abb],.hero-card[data-v-43b28abb]{border-radius:18px!important;box-shadow:5px 5px 0 var(--red )!important}.form-grid[data-v-43b28abb],.history-form[data-v-43b28abb],.insight-grid[data-v-43b28abb],.range-row[data-v-43b28abb]{grid-template-columns:1fr}.history-item[data-v-43b28abb]{grid-template-columns:1fr}.panel-head[data-v-43b28abb],.prediction-head[data-v-43b28abb]{align-items:flex-start;flex-direction:column}.primary-button[data-v-43b28abb],.ghost-button[data-v-43b28abb],.copy-button[data-v-43b28abb]{width:100%}.calendar-grid[data-v-43b28abb]{gap:5px}.calendar-day[data-v-43b28abb]{border-width:2px!important;border-radius:12px!important;font-size:12px;min-height:46px;aspect-ratio:auto}.week-row[data-v-43b28abb]{grid-template-columns:repeat(7,minmax(0,1fr));font-size:12px}} .websocket-tester[data-v-79e5d1c5] { min-height:100vh; background:#f8f9fa; padding:20px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen,Ubuntu,Cantarell,"Open Sans","Helvetica Neue",sans-serif; } .header[data-v-79e5d1c5] { margin-bottom:20px; } .header h1[data-v-79e5d1c5] { color:#2c3e50; font-size:24px; font-weight:600; text-align:center; margin:0; padding:20px 0; } .main-content[data-v-79e5d1c5] { display:flex; flex-direction:column; gap:20px; max-width:1200px; margin:0 auto; padding:20px; background-color:white; border-radius:12px; box-shadow:0 4px 20px rgba(0,0,0,0.08); } .connection-panel[data-v-79e5d1c5] { background:white; padding:24px; border-radius:12px; box-shadow:0 2px 12px rgba(0,0,0,0.05); } .url-input[data-v-79e5d1c5] { display:flex; gap:20px; align-items:flex-start; } .input-group[data-v-79e5d1c5] { flex:1; } .input-group label[data-v-79e5d1c5] { display:block; margin-bottom:8px; color:#666; font-weight:500; } .url-input-wrapper[data-v-79e5d1c5] { position:relative; display:flex; align-items:center; } .url-input input[data-v-79e5d1c5] { width:100%; padding:12px; border:1px solid #ddd; border-radius:8px; font-size:14px; transition: 0.3s ease; background:#fff; } .url-input input[data-v-79e5d1c5]:focus { border-color:#409EFF; box-shadow:0 0 0 2px rgba(64,158,255,0.1); outline:none; } .url-actions[data-v-79e5d1c5] { position:absolute; right:10px; display:flex; gap:8px; } .url-action-btn[data-v-79e5d1c5] { background:transparent; border:none; color:#909399; cursor:pointer; padding:4px; transition:color 0.3s; } .url-action-btn[data-v-79e5d1c5]:hover { color:#409EFF; } .connect-btn-wrapper[data-v-79e5d1c5] { display:flex; gap:8px; align-items:flex-start; margin-top:24px; } .connect-btn[data-v-79e5d1c5] { display:flex; align-items:center; gap:8px; padding:12px 24px; border:none; border-radius:8px; background:#409EFF; color:white; font-weight:500; cursor:pointer; transition: 0.3s; min-width:140px; justify-content:center; } .connect-btn[data-v-79e5d1c5]:hover { background:#66b1ff; transform:translateY(-1px); } .connect-btn.connected[data-v-79e5d1c5] { background:#F56C6C; } .connect-btn.connected[data-v-79e5d1c5]:hover { background:#f78989; } .reconnect-btn[data-v-79e5d1c5] { padding:12px; border:none; border-radius:8px; background:#909399; color:white; cursor:pointer; transition: 0.3s; } .reconnect-btn[data-v-79e5d1c5]:hover { background:#a6a9ad; } .connection-info[data-v-79e5d1c5] { margin-top:20px; display:flex; justify-content:space-between; align-items:center; padding:12px; background:#f8f9fa; border-radius:8px; } .status-group[data-v-79e5d1c5] { display:flex; align-items:center; gap:10px; } .status-indicator[data-v-79e5d1c5] { width:12px; height:12px; border-radius:50%; transition: 0.3s; } .status-connected[data-v-79e5d1c5] { background:#67C23A; box-shadow:0 0 0 4px rgba(103,194,58,0.1); } .status-disconnected[data-v-79e5d1c5] { background:#F56C6C; box-shadow:0 0 0 4px rgba(245,108,108,0.1); } .status-text[data-v-79e5d1c5] { color:#606266; font-weight:500; } .connection-details[data-v-79e5d1c5] { display:flex; gap:20px; color:#909399; } .connection-time[data-v-79e5d1c5],.ping-time[data-v-79e5d1c5] { display:flex; align-items:center; gap:6px; } .connection-actions[data-v-79e5d1c5] { display:flex; gap:8px; } .action-btn[data-v-79e5d1c5] { padding:8px; border:none; border-radius:6px; background:transparent; color:#909399; cursor:pointer; transition: 0.3s; } .action-btn[data-v-79e5d1c5]:hover { background:#f2f6fc; color:#409EFF; } .action-btn.active[data-v-79e5d1c5] { background:#ecf5ff; color:#409EFF; } .error-message[data-v-79e5d1c5] { margin-top:15px; padding:12px; background:#fef0f0; border-radius:8px; color:#F56C6C; display:flex; align-items:center; gap:10px; } .retry-btn[data-v-79e5d1c5] { margin-left:auto; padding:6px 12px; border:none; border-radius:6px; background:#F56C6C; color:white; cursor:pointer; transition: 0.3s; } .retry-btn[data-v-79e5d1c5]:hover { background:#f78989; } .message-panel[data-v-79e5d1c5] { background:white; border-radius:12px; padding:24px; box-shadow:0 2px 12px rgba(0,0,0,0.05); } .panel-header[data-v-79e5d1c5] { display:flex; justify-content:space-between; align-items:center; margin-bottom:20px; } .panel-title[data-v-79e5d1c5] { display:flex; align-items:center; gap:10px; } .panel-title h2[data-v-79e5d1c5] { margin:0; font-size:18px; color:#2c3e50; } .message-count[data-v-79e5d1c5] { color:#909399; font-size:14px; } .header-controls[data-v-79e5d1c5] { display:flex; gap:10px; } .header-controls button[data-v-79e5d1c5] { padding:8px 16px; border:none; border-radius:6px; font-size:14px; cursor:pointer; transition: 0.3s; display:flex; align-items:center; gap:6px; } .filter-btn[data-v-79e5d1c5],.search-btn[data-v-79e5d1c5] { background:#ecf5ff; color:#409EFF; } .filter-btn[data-v-79e5d1c5]:hover,.search-btn[data-v-79e5d1c5]:hover { background:#409EFF; color:white; } .clear-btn[data-v-79e5d1c5] { background:#fef0f0; color:#F56C6C; } .export-btn[data-v-79e5d1c5] { background:#f0f9eb; color:#67C23A; } .clear-btn[data-v-79e5d1c5]:hover { background:#F56C6C; color:white; } .export-btn[data-v-79e5d1c5]:hover { background:#67C23A; color:white; } .message-filters[data-v-79e5d1c5] { display:flex; gap:15px; margin-bottom:15px; padding:15px; background:#f8f9fa; border-radius:8px; } .message-filters select[data-v-79e5d1c5],.message-filters input[data-v-79e5d1c5] { padding:8px 12px; border:1px solid #ddd; border-radius:6px; font-size:14px; } .message-filters input[data-v-79e5d1c5] { flex:1; } .message-history[data-v-79e5d1c5] { max-height:400px; overflow-y:auto; margin-bottom:20px; padding:10px; border:1px solid #eee; border-radius:8px; } .message[data-v-79e5d1c5] { margin-bottom:15px; animation:slideIn-79e5d1c5 0.3s ease; } .message-header[data-v-79e5d1c5] { display:flex; justify-content:space-between; color:#909399; margin-bottom:8px; } .message-body[data-v-79e5d1c5] { background:#f8f9fa; padding:15px; border-radius:8px; position:relative; } .message.sent .message-body[data-v-79e5d1c5] { background:#ecf5ff; } .message.received .message-body[data-v-79e5d1c5] { background:#f0f9eb; } .message-content[data-v-79e5d1c5] { margin:0; white-space:pre-wrap; font-family:"Monaco","Menlo","Ubuntu Mono","Consolas",monospace; font-size:14px; } .message-actions[data-v-79e5d1c5] { position:absolute; top:10px; right:10px; display:flex; gap:8px; opacity:0; transition:opacity 0.3s; } .message-body:hover .message-actions[data-v-79e5d1c5] { opacity:1; } .empty-state[data-v-79e5d1c5] { text-align:center; padding:40px; color:#909399; } .empty-state i[data-v-79e5d1c5] { font-size:40px; margin-bottom:10px; display:block; } .message-composer[data-v-79e5d1c5] { background:#f8f9fa; padding:20px; border-radius:8px; } .composer-header[data-v-79e5d1c5] { display:flex; justify-content:space-between; margin-bottom:15px; } .format-selector select[data-v-79e5d1c5] { padding:8px 12px; border:1px solid #ddd; border-radius:6px; font-size:14px; } .message-templates[data-v-79e5d1c5] { display:flex; gap:10px; } .template-btn[data-v-79e5d1c5] { padding:8px 16px; border:none; border-radius:6px; background:#67C23A; color:white; cursor:pointer; transition: 0.3s; display:flex; align-items:center; gap:6px; } .template-btn[data-v-79e5d1c5]:hover { background:#85ce61; } .composer-body textarea[data-v-79e5d1c5] { width:100%; padding:15px; font-size:14px; border:1px solid #ddd; border-radius:8px; resize:vertical; min-height:120px; margin-bottom:15px; transition:border-color 0.3s; } .composer-body textarea[data-v-79e5d1c5]:focus { border-color:#409EFF; outline:none; } .json-input[data-v-79e5d1c5] { font-family:"Monaco","Menlo","Ubuntu Mono","Consolas",monospace; } .composer-controls[data-v-79e5d1c5] { display:flex; justify-content:space-between; align-items:center; } .composer-options[data-v-79e5d1c5] { display:flex; align-items:center; gap:20px; } .auto-format[data-v-79e5d1c5] { display:flex; align-items:center; gap:6px; color:#606266; } .hint[data-v-79e5d1c5] { color:#909399; font-size:12px; } .send-controls[data-v-79e5d1c5] { display:flex; gap:10px; } .validate-btn[data-v-79e5d1c5] { padding:10px; border:none; border-radius:6px; background:#ecf5ff; color:#409EFF; cursor:pointer; transition: 0.3s; } .validate-btn[data-v-79e5d1c5]:hover { background:#409EFF; color:white; } .send-btn[data-v-79e5d1c5] { padding:10px 24px; border:none; border-radius:6px; background:#409EFF; color:white; cursor:pointer; transition: 0.3s; display:flex; align-items:center; gap:8px; } .send-btn[data-v-79e5d1c5]:hover { background:#66b1ff; transform:translateY(-1px); } .send-btn[data-v-79e5d1c5]:disabled { background:#dcdfe6; cursor:not-allowed; transform:none; } .toast[data-v-79e5d1c5] { position:fixed; bottom:30px; left:50%; transform:translateX(-50%); background-color:white; color:#2c3e50; padding:15px 30px; border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,0.15); display:flex; align-items:center; gap:10px; z-index:1000; transition: 0.3s ease; } .toast.success[data-v-79e5d1c5] { background-color:#f0f9eb; color:#67C23A; } .toast.error[data-v-79e5d1c5] { background-color:#fef0f0; color:#F56C6C; } .toast.info[data-v-79e5d1c5] { background-color:#ecf5ff; color:#409EFF; } .toast.warning[data-v-79e5d1c5] { background-color:#fdf6ec; color:#E6A23C; } @keyframes slideIn-79e5d1c5 { from { transform:translateX(100%); opacity:0; } to { transform:translateX(0); opacity:1; } } [data-v-79e5d1c5]::-webkit-scrollbar { width:8px; } [data-v-79e5d1c5]::-webkit-scrollbar-track { background:#f1f1f1; border-radius:4px; } [data-v-79e5d1c5]::-webkit-scrollbar-thumb { background:#c0c4cc; border-radius:4px; } [data-v-79e5d1c5]::-webkit-scrollbar-thumb:hover { background:#909399; } .tools-page[data-v-ee7806be] { min-height:100vh; padding:28px; color:var(--color-text ); background:linear-gradient(90deg,var(--color-focus-shadow ) 1px,transparent 1px) 0 0/44px 44px,var(--color-bg ); } .tools-hero[data-v-ee7806be],.tools-shell[data-v-ee7806be] { width:min(1760px,100%); margin:0 auto; } .tools-hero[data-v-ee7806be] { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,420px); gap:18px; align-items:stretch; } .hero-copy[data-v-ee7806be],.hero-panel[data-v-ee7806be],.tool-sidebar[data-v-ee7806be],.tool-workspace[data-v-ee7806be],.tool-panel[data-v-ee7806be] { border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 24px 70px var(--color-shadow ); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-copy[data-v-ee7806be] { padding:clamp(28px,5vw,56px); } .eyebrow[data-v-ee7806be],.hero-panel span[data-v-ee7806be],.workspace-head span[data-v-ee7806be],.tool-search span[data-v-ee7806be],.field-block label[data-v-ee7806be],.block-title label[data-v-ee7806be] { color:var(--color-text-soft ); font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .hero-copy h1[data-v-ee7806be] { margin:10px 0 10px; font-size:clamp(42px,6vw,92px); line-height:0.98; } .hero-copy p[data-v-ee7806be],.hero-panel p[data-v-ee7806be],.workspace-head p[data-v-ee7806be] { max-width:767px; margin:0; color:var(--color-text-soft ); font-size:16px; line-height:1.8; } .hero-metrics[data-v-ee7806be] { display:flex; flex-wrap:wrap; gap:10px; margin-top:28px; } .hero-metrics article[data-v-ee7806be] { min-width:132px; padding:14px 16px; border-radius:8px; background:var(--color-surface ); border:1px solid var(--color-border ); } .hero-metrics strong[data-v-ee7806be] { display:block; font-size:28px; } .hero-metrics span[data-v-ee7806be] { color:var(--color-text-soft ); } .hero-panel[data-v-ee7806be] { display:grid; align-content:center; gap:12px; padding:28px; } .hero-panel strong[data-v-ee7806be] { font-size:clamp(28px,4vw,48px); line-height:1; } .hero-tags[data-v-ee7806be] { display:flex; flex-wrap:wrap; gap:8px; } .hero-tags b[data-v-ee7806be] { padding:8px 10px; border-radius:999px; color:var(--color-text ); background:#eef6ff; } .tools-shell[data-v-ee7806be] { display:grid; grid-template-columns:330px minmax(0,1fr); gap:18px; margin-top:18px; align-items:start; } .tool-sidebar[data-v-ee7806be] { position:sticky; top:18px; display:grid; gap:14px; padding:16px; } .tool-search[data-v-ee7806be] { display:grid; gap:8px; } input[data-v-ee7806be],select[data-v-ee7806be],textarea[data-v-ee7806be] { width:100%; box-sizing:border-box; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); color:var(--color-text ); font:inherit; outline:none; } input[data-v-ee7806be],select[data-v-ee7806be] { min-height:42px; padding:0 12px; } textarea[data-v-ee7806be] { min-height:180px; padding:12px; resize:vertical; line-height:1.6; } input[data-v-ee7806be]:focus,select[data-v-ee7806be]:focus,textarea[data-v-ee7806be]:focus { border-color:var(--color-primary ); box-shadow:0 0 0 3px var(--color-focus-shadow ); } .category-tabs[data-v-ee7806be] { display:flex; flex-wrap:wrap; gap:8px; } .category-tabs button[data-v-ee7806be],.button-row button[data-v-ee7806be],.button-grid button[data-v-ee7806be],.key-actions button[data-v-ee7806be],.inline-fields button[data-v-ee7806be],.full-row button[data-v-ee7806be],.timer-controls button[data-v-ee7806be] { min-height:38px; padding:0 14px; border:0; border-radius:999px; color:var(--color-text ); background:var(--color-bg-soft ); font-weight:900; cursor:pointer; } .category-tabs button.active[data-v-ee7806be],.button-row button[data-v-ee7806be]:first-child,.key-actions button[data-v-ee7806be]:first-child,.inline-fields button[data-v-ee7806be],.full-row button[data-v-ee7806be],.timer-controls button[data-v-ee7806be]:nth-child(2) { color:var(--color-button-text ); background:var(--color-button ); } button[data-v-ee7806be]:disabled { cursor:not-allowed; opacity:0.52; } .tool-list[data-v-ee7806be] { display:grid; gap:8px; max-height:calc(100vh - 300px); overflow:auto; padding-right:2px; } .tool-list button[data-v-ee7806be] { display:grid; grid-template-columns:42px minmax(0,1fr); gap:10px; align-items:center; width:100%; min-height:68px; padding:10px; border:1px solid transparent; border-radius:8px; color:var(--color-text ); background:transparent; text-align:left; cursor:pointer; } .tool-list button.active[data-v-ee7806be] { border-color:var(--color-border ); background:var(--color-surface ); box-shadow:0 12px 28px var(--color-shadow ); } .tool-list i[data-v-ee7806be] { display:grid; place-items:center; width:42px; height:42px; border-radius:8px; color:var(--color-button-text ); font-style:normal; font-weight:900; } .tool-list span[data-v-ee7806be],.tool-list small[data-v-ee7806be],.result-list strong[data-v-ee7806be] { min-width:0; } .tool-list strong[data-v-ee7806be],.tool-list small[data-v-ee7806be] { display:block; } .tool-list small[data-v-ee7806be] { margin-top:4px; color:var(--color-text-soft ); overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .tool-workspace[data-v-ee7806be] { padding:18px; } .workspace-head[data-v-ee7806be] { position:relative; padding:22px 22px 24px; border-radius:8px; overflow:hidden; background:linear-gradient(120deg,rgba(255,255,255,0.82),rgba(255,255,255,0.42)),linear-gradient(90deg,var(--tool-accent ),transparent); } .workspace-head h2[data-v-ee7806be] { margin:8px 0; font-size:clamp(30px,4vw,54px); line-height:1; } .tool-panel[data-v-ee7806be] { margin-top:16px; padding:18px; } .two-column[data-v-ee7806be],.three-column[data-v-ee7806be] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; } .three-column[data-v-ee7806be] { grid-template-columns:repeat(3,minmax(0,1fr)); } .field-block[data-v-ee7806be],.mini-block[data-v-ee7806be] { display:grid; gap:10px; min-width:0; } .result-block[data-v-ee7806be] { border-left:1px solid var(--color-border ); padding-left:16px; } .block-title[data-v-ee7806be],.key-actions[data-v-ee7806be] { display:flex; justify-content:space-between; gap:10px; align-items:center; } .block-title button[data-v-ee7806be],.hash-list button[data-v-ee7806be],.result-list button[data-v-ee7806be] { min-height:32px; padding:0 10px; border:0; border-radius:999px; color:var(--color-text ); background:#e9f7ff; font-weight:900; cursor:pointer; } pre[data-v-ee7806be],code[data-v-ee7806be],output[data-v-ee7806be] { font-family:Consolas,Monaco,monospace; } pre[data-v-ee7806be],output[data-v-ee7806be] { display:block; min-height:180px; margin:0; padding:12px; border-radius:8px; background:var(--color-surface-strong ); color:#e5f2ff; overflow:auto; white-space:pre-wrap; word-break:break-word; line-height:1.6; } .stat-row[data-v-ee7806be] { display:flex; flex-wrap:wrap; gap:8px; } .stat-row span[data-v-ee7806be] { padding:8px 10px; border-radius:999px; color:var(--color-text-soft ); background:#f1f5f9; font-weight:800; } .button-row[data-v-ee7806be],.key-actions[data-v-ee7806be],.inline-fields[data-v-ee7806be],.timer-controls[data-v-ee7806be] { display:flex; flex-wrap:wrap; gap:10px; align-items:center; } .button-row .ghost[data-v-ee7806be],.key-actions .ghost[data-v-ee7806be],.timer-controls .ghost[data-v-ee7806be] { color:var(--color-text ); background:var(--color-bg-soft ); } .button-grid[data-v-ee7806be] { display:grid; grid-template-columns:repeat(auto-fit,minmax(118px,1fr)); gap:8px; } .hash-list[data-v-ee7806be],.result-list[data-v-ee7806be],.match-list[data-v-ee7806be] { display:grid; gap:8px; } .hash-list div[data-v-ee7806be],.match-list div[data-v-ee7806be] { display:grid; grid-template-columns:120px minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px; border-radius:8px; background:var(--color-bg-soft ); } .hash-list code[data-v-ee7806be],.match-list code[data-v-ee7806be] { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .split-stack[data-v-ee7806be] { display:grid; gap:14px; } .mini-block[data-v-ee7806be] { padding:16px; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); } .mini-block h3[data-v-ee7806be] { margin:0; font-size:20px; } .inline-fields input[data-v-ee7806be],.inline-fields select[data-v-ee7806be] { flex:1 1 150px; } .result-list button[data-v-ee7806be] { display:grid; grid-template-columns:120px minmax(0,1fr); gap:10px; align-items:center; width:100%; min-height:48px; border-radius:8px; text-align:left; background:var(--color-bg-soft ); } .result-list strong[data-v-ee7806be] { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } .error-text[data-v-ee7806be] { margin:0; color:#dc2626; font-weight:800; } .color-preview[data-v-ee7806be] { min-height:180px; border-radius:8px; border:1px solid var(--color-border ); } .palette-row[data-v-ee7806be] { display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:8px; margin-top:12px; } .palette-row button[data-v-ee7806be] { min-height:70px; border:0; border-radius:8px; color:var(--color-text ); font-weight:900; cursor:pointer; } .full-row[data-v-ee7806be] { grid-column:1/-1; } .diff-result[data-v-ee7806be] { display:grid; gap:6px; max-height:420px; overflow:auto; padding:10px; border-radius:8px; background:var(--color-surface-strong ); } .diff-result div[data-v-ee7806be] { display:grid; grid-template-columns:48px minmax(0,1fr) minmax(0,1fr); gap:8px; padding:8px; border-radius:8px; color:#dbeafe; } .diff-result .same[data-v-ee7806be] { background:rgba(255,255,255,0.04); } .diff-result .changed[data-v-ee7806be] { background:rgba(255,207,69,0.16); } .diff-result .removed[data-v-ee7806be] { background:rgba(239,111,97,0.18); } .diff-result .added[data-v-ee7806be] { background:rgba(25,201,154,0.18); } .timer-panel[data-v-ee7806be] { display:grid; grid-template-columns:minmax(240px,0.7fr) minmax(260px,1fr); gap:18px; align-items:center; } .timer-face[data-v-ee7806be] { display:grid; place-items:center; min-height:280px; border-radius:8px; color:#fff; background:linear-gradient(135deg,rgba(255,255,255,0.16),transparent),var(--color-surface-strong ); } .timer-face span[data-v-ee7806be] { color:#cbd5e1; font-weight:900; } .timer-face strong[data-v-ee7806be] { font-size:clamp(54px,9vw,120px); } .shortcuts-panel[data-v-ee7806be] { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; } .shortcuts-panel button[data-v-ee7806be] { display:grid; gap:8px; min-height:142px; padding:16px; border:1px solid var(--color-border ); border-radius:8px; color:var(--color-text ); background:var(--color-surface ); text-align:left; cursor:pointer; } .shortcuts-panel span[data-v-ee7806be] { width:-moz-max-content; width:max-content; padding:6px 8px; border-radius:999px; background:#eef6ff; color:#1976d2; font-weight:900; } .shortcuts-panel strong[data-v-ee7806be] { font-size:22px; } .shortcuts-panel small[data-v-ee7806be] { color:var(--color-text-soft ); line-height:1.6; } @media (max-width:1199px) { .tools-hero[data-v-ee7806be],.tools-shell[data-v-ee7806be] { grid-template-columns:1fr; } .tool-sidebar[data-v-ee7806be] { position:relative; top:0; } .tool-list[data-v-ee7806be] { max-height:none; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); } } @media (max-width:767px) { .tools-page[data-v-ee7806be] { padding:14px; } .hero-copy[data-v-ee7806be],.hero-panel[data-v-ee7806be],.tool-workspace[data-v-ee7806be],.tool-panel[data-v-ee7806be] { padding:14px; } .two-column[data-v-ee7806be],.three-column[data-v-ee7806be],.timer-panel[data-v-ee7806be] { grid-template-columns:1fr; } .result-block[data-v-ee7806be] { border-left:0; padding-left:0; } .hash-list div[data-v-ee7806be],.diff-result div[data-v-ee7806be] { grid-template-columns:1fr; } .tool-list[data-v-ee7806be] { grid-template-columns:1fr; } } .tools-page[data-v-ee7806be] { --ink:#1A1A1D; --muted:rgba(26,26,29,.68); --line:#1A1A1D; --accent:#E72D48; --good:#2FA84F; min-height:100vh; padding:clamp(16px,3vw,32px); color:#1A1A1D; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,0.12) 2px,transparent 2.2px) 0 0/28px 28px,linear-gradient(135deg,rgba(255,249,247,.68),transparent 44%),#F1DDDF !important; overflow-x:hidden; } .tools-hero[data-v-ee7806be],.tools-shell[data-v-ee7806be] { width:min(100%,1440px) !important; margin-left:auto; margin-right:auto; } .tools-hero[data-v-ee7806be] { grid-template-columns:minmax(0,1fr) minmax(300px,410px); gap:18px; } .tools-shell[data-v-ee7806be] { grid-template-columns:minmax(260px,340px) minmax(0,1fr); gap:18px; align-items:start; } .hero-copy[data-v-ee7806be],.hero-panel[data-v-ee7806be],.tool-sidebar[data-v-ee7806be],.tool-workspace[data-v-ee7806be],.tool-panel[data-v-ee7806be],.shortcuts-panel[data-v-ee7806be],.result-card[data-v-ee7806be],.result-block[data-v-ee7806be],.output-box[data-v-ee7806be],.preview-card[data-v-ee7806be] { border:3px solid #1A1A1D !important; border-radius:22px !important; background:#FFF9F7 !important; box-shadow:8px 8px 0 #E72D48 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } .hero-copy[data-v-ee7806be] { padding:clamp(22px,4vw,48px); } .hero-panel[data-v-ee7806be] { background:#E72D48 !important; color:#FFF9F7 !important; box-shadow:8px 8px 0 #1A1A1D !important; } .hero-panel p[data-v-ee7806be] { color:rgba(255,249,247,.88) !important; } .eyebrow[data-v-ee7806be],.hero-panel span[data-v-ee7806be],.workspace-head span[data-v-ee7806be],.tool-search span[data-v-ee7806be],.field-block label[data-v-ee7806be],.block-title label[data-v-ee7806be],.hero-tags b[data-v-ee7806be],.shortcuts-panel span[data-v-ee7806be] { display:inline-flex; width:-moz-max-content; width:max-content; max-width:100%; padding:6px 10px; border:3px solid #1A1A1D; border-radius:999px; background:#E72D48 !important; color:#FFF9F7 !important; font-weight:900; letter-spacing:0; text-transform:none; } .hero-panel span[data-v-ee7806be],.hero-panel .hero-tags b[data-v-ee7806be] { background:#FFF9F7 !important; color:#1A1A1D !important; } .hero-copy h1[data-v-ee7806be],.workspace-head h2[data-v-ee7806be] { color:#1A1A1D; letter-spacing:-0.06em; text-shadow:3px 3px 0 rgba(231,45,72,.18); } .hero-copy p[data-v-ee7806be],.workspace-head p[data-v-ee7806be],.tool-list small[data-v-ee7806be],.shortcuts-panel small[data-v-ee7806be] { color:rgba(26,26,29,.68) !important; } .hero-metrics article[data-v-ee7806be] { border:3px solid #1A1A1D !important; border-radius:18px !important; background:#FFF9F7 !important; box-shadow:4px 4px 0 #1A1A1D !important; } .hero-metrics strong[data-v-ee7806be] { color:#E72D48 !important; } .tool-sidebar[data-v-ee7806be] { position:sticky; top:18px; padding:16px; } .tool-search input[data-v-ee7806be],.field-block input[data-v-ee7806be],.field-block textarea[data-v-ee7806be],.field-block select[data-v-ee7806be],textarea[data-v-ee7806be],input[data-v-ee7806be],select[data-v-ee7806be] { min-width:0; border:3px solid #1A1A1D !important; border-radius:14px !important; background:#FFF9F7 !important; color:#1A1A1D !important; box-shadow:4px 4px 0 rgba(26,26,29,.88) !important; outline:none; } .tool-search input[data-v-ee7806be]:focus,.field-block input[data-v-ee7806be]:focus,.field-block textarea[data-v-ee7806be]:focus,.field-block select[data-v-ee7806be]:focus,textarea[data-v-ee7806be]:focus,input[data-v-ee7806be]:focus,select[data-v-ee7806be]:focus { transform:translate(-1px,-1px); box-shadow:6px 6px 0 #E72D48 !important; } .category-tabs button[data-v-ee7806be],.tool-list button[data-v-ee7806be],.tool-panel button[data-v-ee7806be],.shortcuts-panel[data-v-ee7806be],button.copy-btn[data-v-ee7806be],button.primary-btn[data-v-ee7806be],button.action-btn[data-v-ee7806be] { border:3px solid #1A1A1D !important; border-radius:16px !important; background:#FFF9F7 !important; color:#1A1A1D !important; box-shadow:4px 4px 0 #1A1A1D !important; font-weight:900; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease; } .category-tabs button[data-v-ee7806be]:hover,.tool-list button[data-v-ee7806be]:hover,.tool-panel button[data-v-ee7806be]:hover,.shortcuts-panel[data-v-ee7806be]:hover,button.copy-btn[data-v-ee7806be]:hover,button.primary-btn[data-v-ee7806be]:hover,button.action-btn[data-v-ee7806be]:hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 #1A1A1D !important; } .category-tabs button.active[data-v-ee7806be],.tool-list button.active[data-v-ee7806be],.tool-panel button.primary[data-v-ee7806be],button.primary-btn[data-v-ee7806be],button.action-btn[data-v-ee7806be] { background:#E72D48 !important; color:#FFF9F7 !important; } .tool-list button[data-v-ee7806be] { align-items:start; text-align:left; } .tool-list i[data-v-ee7806be] { border:2px solid #1A1A1D; color:#1A1A1D; box-shadow:2px 2px 0 #1A1A1D; } .tool-workspace[data-v-ee7806be] { padding:clamp(16px,2vw,24px); min-width:0; } .workspace-head[data-v-ee7806be] { border:3px solid #1A1A1D; border-radius:20px; background:#F1DDDF !important; box-shadow:5px 5px 0 #1A1A1D; } .two-column[data-v-ee7806be],.three-column[data-v-ee7806be],.timer-panel[data-v-ee7806be] { gap:16px; } .result-block[data-v-ee7806be],.output-box[data-v-ee7806be],.preview-card[data-v-ee7806be] { padding:14px; box-shadow:5px 5px 0 #1A1A1D !important; overflow-wrap:anywhere; } .hash-list div[data-v-ee7806be],.diff-result div[data-v-ee7806be] { min-width:0; } pre[data-v-ee7806be],code[data-v-ee7806be] { white-space:pre-wrap; overflow-wrap:anywhere; } @media (max-width:1199px) { .tools-hero[data-v-ee7806be],.tools-shell[data-v-ee7806be] { grid-template-columns:1fr; } .tool-sidebar[data-v-ee7806be] { position:relative; top:0; } .tool-list[data-v-ee7806be] { max-height:none; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); } } @media (max-width:767px) { .tools-page[data-v-ee7806be] { padding:16px; background-size:22px 22px,auto,auto !important; } .hero-copy[data-v-ee7806be],.hero-panel[data-v-ee7806be],.tool-sidebar[data-v-ee7806be],.tool-workspace[data-v-ee7806be],.tool-panel[data-v-ee7806be],.shortcuts-panel[data-v-ee7806be],.result-card[data-v-ee7806be],.result-block[data-v-ee7806be],.output-box[data-v-ee7806be],.preview-card[data-v-ee7806be] { border-width:2px !important; border-radius:18px !important; box-shadow:5px 5px 0 #E72D48 !important; } .hero-panel[data-v-ee7806be] { box-shadow:5px 5px 0 #1A1A1D !important; } .hero-metrics[data-v-ee7806be] { grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; } .hero-metrics article[data-v-ee7806be] { min-width:0; padding:10px; border-width:2px !important; } .category-tabs[data-v-ee7806be] { display:flex; overflow-x:auto; gap:8px; padding-bottom:8px; scrollbar-width:none; } .category-tabs[data-v-ee7806be]::-webkit-scrollbar { display:none; } .category-tabs button[data-v-ee7806be] { flex:0 0 auto; border-width:2px !important; box-shadow:3px 3px 0 #1A1A1D !important; } .tool-list[data-v-ee7806be] { grid-template-columns:1fr; } .tool-search input[data-v-ee7806be],.field-block input[data-v-ee7806be],.field-block textarea[data-v-ee7806be],.field-block select[data-v-ee7806be],textarea[data-v-ee7806be],input[data-v-ee7806be],select[data-v-ee7806be] { border-width:2px !important; box-shadow:3px 3px 0 #1A1A1D !important; } .two-column[data-v-ee7806be],.three-column[data-v-ee7806be],.timer-panel[data-v-ee7806be] { grid-template-columns:1fr !important; } .tool-panel[data-v-ee7806be] { padding:14px; } } @media (max-width:420px) { .tools-page[data-v-ee7806be] { padding:12px; } .hero-metrics[data-v-ee7806be] { grid-template-columns:1fr; } .tool-panel button[data-v-ee7806be],.category-tabs button[data-v-ee7806be] { min-height:42px; } } .device-page[data-v-785128c6] { min-height:100vh; padding:clamp(28px,5vw,72px); color:#111827; background:radial-gradient(circle at 12% 8%,rgba(42,196,255,0.16),transparent 28rem),radial-gradient(circle at 88% 0%,rgba(25,201,154,0.16),transparent 30rem),linear-gradient(180deg,#fffdf8 0%,#f8fafc 46%,#eef2f7 100%); } .device-hero[data-v-785128c6] { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,380px); gap:16px; align-items:end; width:min(1760px,100%); margin:0 auto 16px; } .eyebrow[data-v-785128c6],.section-head span[data-v-785128c6],.summary-grid span[data-v-785128c6],.info-item span[data-v-785128c6],.hero-actions span[data-v-785128c6] { color:#0f9f9a; font-size:12px; font-weight:900; text-transform:uppercase; } .device-hero h1[data-v-785128c6] { margin:8px 0 12px; font-size:clamp(38px,5vw,76px); line-height:1; } .device-hero p[data-v-785128c6] { max-width:767px; margin:0; color:#475569; font-size:clamp(15px,1.2vw,18px); line-height:1.75; } .hero-actions[data-v-785128c6],.summary-grid article[data-v-785128c6],.info-section[data-v-785128c6] { border:1px solid rgba(15,23,42,0.12); border-radius:8px; background:rgba(255,255,255,0.78); box-shadow:0 18px 54px rgba(15,23,42,0.08); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-actions[data-v-785128c6] { display:grid; gap:8px; padding:18px; } .hero-actions strong[data-v-785128c6] { font-size:30px; line-height:1.1; } .hero-actions button[data-v-785128c6] { width:-moz-fit-content; width:fit-content; min-height:40px; padding:0 16px; border:0; border-radius:999px; color:#fff; background:#111827; font-weight:900; cursor:pointer; } .summary-grid[data-v-785128c6],.info-shell[data-v-785128c6] { width:min(1760px,100%); margin:0 auto; } .summary-grid[data-v-785128c6] { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; margin-bottom:16px; } .summary-grid article[data-v-785128c6] { display:grid; gap:5px; padding:16px; } .summary-grid strong[data-v-785128c6] { font-size:24px; line-height:1.1; } .summary-grid small[data-v-785128c6] { color:#64748b; line-height:1.45; } .info-shell[data-v-785128c6] { -moz-column-count:3; column-count:3; -moz-column-gap:16px; column-gap:16px; } .info-section[data-v-785128c6] { display:inline-block; box-sizing:border-box; min-width:0; width:100%; margin:0 0 16px; padding:16px; -moz-column-break-inside:avoid; break-inside:avoid; vertical-align:top; } .section-head[data-v-785128c6] { margin-bottom:12px; } .section-head h2[data-v-785128c6] { margin:4px 0 0; font-size:22px; } .info-grid[data-v-785128c6] { display:grid; gap:8px; } .info-item[data-v-785128c6] { min-width:0; padding:11px; border-radius:8px; background:rgba(15,23,42,0.04); } .info-item span[data-v-785128c6],.info-item strong[data-v-785128c6] { display:block; } .info-item strong[data-v-785128c6] { margin-top:5px; color:#1f2937; font-size:14px; line-height:1.55; overflow-wrap:break-word; word-break:break-word; } @media (max-width:820px) { .device-page[data-v-785128c6] { padding:24px 14px; } .device-hero[data-v-785128c6] { grid-template-columns:1fr; } .info-shell[data-v-785128c6] { -moz-column-count:1; column-count:1; } } @media (min-width:1440px) { .info-shell[data-v-785128c6] { -moz-column-count:4; column-count:4; } } @media (min-width:821px) and (max-width:1199px) { .info-shell[data-v-785128c6] { -moz-column-count:2; column-count:2; } } .device-page[data-v-785128c6] { min-height:100vh; padding:clamp(22px,4vw,56px); color:#1A1A1D; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,0.12) 2px,transparent 2.2px) 0 0/28px 28px,linear-gradient(135deg,rgba(255,249,247,.68),transparent 44%),#F1DDDF !important; overflow-x:hidden; } .device-hero[data-v-785128c6],.summary-grid[data-v-785128c6],.info-shell[data-v-785128c6] { width:min(100%,1440px) !important; margin-left:auto; margin-right:auto; } .device-hero[data-v-785128c6] { grid-template-columns:minmax(0,1fr) minmax(280px,380px); gap:18px; } .eyebrow[data-v-785128c6],.section-head span[data-v-785128c6],.summary-grid span[data-v-785128c6],.info-item span[data-v-785128c6],.hero-actions span[data-v-785128c6] { display:inline-flex; width:-moz-max-content; width:max-content; max-width:100%; padding:6px 10px; border:3px solid #1A1A1D; border-radius:999px; background:#E72D48; color:#FFF9F7 !important; font-weight:900; letter-spacing:0; text-transform:none; } .device-hero h1[data-v-785128c6] { color:#1A1A1D; letter-spacing:-0.06em; text-shadow:3px 3px 0 rgba(231,45,72,.18); } .device-hero p[data-v-785128c6] { color:rgba(26,26,29,.72) !important; } .hero-actions[data-v-785128c6],.summary-grid article[data-v-785128c6],.info-section[data-v-785128c6] { border:3px solid #1A1A1D !important; border-radius:22px !important; background:#FFF9F7 !important; box-shadow:8px 8px 0 #E72D48 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } .hero-actions[data-v-785128c6] { align-content:start; } .hero-actions strong[data-v-785128c6] { color:#E72D48 !important; letter-spacing:-0.04em; } .hero-actions button[data-v-785128c6] { margin-top:12px; border:3px solid #1A1A1D !important; border-radius:999px; background:#E72D48 !important; color:#FFF9F7 !important; box-shadow:5px 5px 0 #1A1A1D !important; font-weight:900; cursor:pointer; transition:transform .18s ease,box-shadow .18s ease; } .hero-actions button[data-v-785128c6]:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 #1A1A1D !important; } .summary-grid[data-v-785128c6] { grid-template-columns:repeat(6,minmax(0,1fr)); gap:14px; } .summary-grid article[data-v-785128c6] { min-width:0; padding:16px; box-shadow:5px 5px 0 #1A1A1D !important; } .summary-grid strong[data-v-785128c6],.info-item strong[data-v-785128c6] { color:#1A1A1D !important; overflow-wrap:anywhere; } .summary-grid small[data-v-785128c6] { color:rgba(26,26,29,.68) !important; } .info-shell[data-v-785128c6] { -moz-column-count:3; column-count:3; -moz-column-gap:18px; column-gap:18px; } .info-section[data-v-785128c6] { padding:18px; -moz-column-break-inside:avoid; break-inside:avoid; } .info-item[data-v-785128c6] { border:2px solid #1A1A1D; border-radius:14px; background:#F1DDDF !important; box-shadow:3px 3px 0 rgba(26,26,29,.88); } .info-item span[data-v-785128c6] { border-width:2px; padding:4px 8px; font-size:11px; } @media (min-width:1440px) { .info-shell[data-v-785128c6] { -moz-column-count:4; column-count:4; } } @media (max-width:1280px) { .summary-grid[data-v-785128c6] { grid-template-columns:repeat(3,minmax(0,1fr)); } } @media (max-width:980px) { .device-hero[data-v-785128c6] { grid-template-columns:1fr; } .info-shell[data-v-785128c6] { -moz-column-count:2; column-count:2; } } @media (max-width:767px) { .device-page[data-v-785128c6] { padding:16px; background-size:22px 22px,auto,auto !important; } .hero-actions[data-v-785128c6],.summary-grid article[data-v-785128c6],.info-section[data-v-785128c6] { border-width:2px !important; border-radius:18px !important; box-shadow:5px 5px 0 #E72D48 !important; } .summary-grid[data-v-785128c6] { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .info-shell[data-v-785128c6] { -moz-column-count:1; column-count:1; } .device-hero h1[data-v-785128c6] { font-size:clamp(34px,11vw,52px); } } @media (max-width:480px) { .summary-grid[data-v-785128c6] { grid-template-columns:1fr; } .hero-actions button[data-v-785128c6] { width:100%; } } .mbti-page[data-v-1a5ff475] { min-height:100vh; color:#172033; background:linear-gradient(135deg,rgba(42,196,255,0.12),transparent 34%),linear-gradient(315deg,rgba(255,111,159,0.12),transparent 36%),#f6f8fb; } .mbti-shell[data-v-1a5ff475] { width:min(1560px,calc(100% - 32px)); margin:0 auto; padding:clamp(44px,5vw,72px) 0 clamp(36px,5vw,68px); } .mbti-hero[data-v-1a5ff475] { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(320px,0.75fr); gap:clamp(16px,2.4vw,32px); align-items:flex-end; margin-bottom:clamp(18px,2.6vw,30px); } .hero-copy[data-v-1a5ff475] { max-width:900px; } .eyebrow[data-v-1a5ff475],.panel-title span[data-v-1a5ff475],.question-toolbar span[data-v-1a5ff475],.result-hero > span[data-v-1a5ff475] { display:inline-flex; color:#ef6f61; font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .hero-copy h1[data-v-1a5ff475] { margin:8px 0 10px; color:#101827; font-size:clamp(36px,4.8vw,68px); line-height:1; letter-spacing:0; } .hero-copy p[data-v-1a5ff475] { margin:0; max-width:820px; color:#526174; font-size:clamp(15px,1.25vw,18px); line-height:1.68; } .hero-summary[data-v-1a5ff475] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; } .hero-summary div[data-v-1a5ff475] { min-width:0; padding:14px 16px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:rgba(255,255,255,0.72); box-shadow:0 18px 50px rgba(15,23,42,0.08); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); } .hero-summary span[data-v-1a5ff475],.hero-summary small[data-v-1a5ff475],.overall-progress span[data-v-1a5ff475],.overall-progress small[data-v-1a5ff475],.result-meta span[data-v-1a5ff475] { display:block; color:#64748b; font-size:12px; font-weight:800; } .hero-summary strong[data-v-1a5ff475] { display:block; margin:6px 0 2px; color:#111827; font-size:clamp(24px,2.4vw,34px); line-height:1; } .test-layout[data-v-1a5ff475] { max-width:1320px; margin:0 auto; } .question-panel[data-v-1a5ff475],.result-panel[data-v-1a5ff475],.result-hero[data-v-1a5ff475] { border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:rgba(255,255,255,0.82); box-shadow:0 24px 70px rgba(15,23,42,0.1); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .overall-progress[data-v-1a5ff475] { margin-bottom:clamp(16px,2vw,24px); } .overall-progress > div[data-v-1a5ff475]:first-child { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; } .overall-progress strong[data-v-1a5ff475] { color:#111827; font-size:30px; line-height:1; } .progress-track[data-v-1a5ff475] { height:10px; margin-top:14px; overflow:hidden; border-radius:999px; background:#e6edf5; } .progress-fill[data-v-1a5ff475] { height:100%; border-radius:inherit; background:linear-gradient(90deg,#2ac4ff,#19c99a,#ffcf45); transition:width 0.28s ease; } .ghost-button[data-v-1a5ff475],.light-button[data-v-1a5ff475],.dark-button[data-v-1a5ff475] { min-height:42px; border:none; border-radius:8px; font-weight:900; cursor:pointer; transition:transform 0.2s ease,box-shadow 0.2s ease,background 0.2s ease; } .ghost-button[data-v-1a5ff475]:hover:not(:disabled),.light-button[data-v-1a5ff475]:hover,.dark-button[data-v-1a5ff475]:hover { transform:translateY(-2px); } .question-panel[data-v-1a5ff475] { min-height:430px; padding:clamp(20px,2.4vw,30px); } .question-toolbar[data-v-1a5ff475] { display:flex; justify-content:space-between; gap:16px; align-items:center; } .question-toolbar strong[data-v-1a5ff475] { display:block; margin-top:4px; color:#526174; font-size:14px; } .question-count[data-v-1a5ff475] { flex:0 0 auto; padding:8px 12px; border-radius:999px; background:#edf6ff; color:#2563eb; font-size:13px; font-weight:900; } .question-panel h2[data-v-1a5ff475] { margin:clamp(16px,2.2vw,24px) 0; max-width:1199px; color:#101827; font-size:clamp(24px,2.8vw,40px); line-height:1.18; letter-spacing:0; } .scale-row[data-v-1a5ff475] { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-top:18px; } .scale-row button[data-v-1a5ff475] { min-height:76px; padding:12px 10px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:#ffffff; color:#334155; cursor:pointer; transition:transform 0.2s ease,border-color 0.2s ease,box-shadow 0.2s ease,background 0.2s ease; } .scale-row button[data-v-1a5ff475]:hover,.scale-row button.selected[data-v-1a5ff475] { transform:translateY(-2px); border-color:rgba(25,201,154,0.5); background:#f0fdfa; box-shadow:0 16px 36px rgba(15,118,110,0.12); } .scale-row strong[data-v-1a5ff475],.scale-row span[data-v-1a5ff475] { display:block; } .scale-row strong[data-v-1a5ff475] { color:#0f766e; font-size:18px; } .scale-row span[data-v-1a5ff475] { margin-top:6px; color:#526174; font-size:13px; font-weight:800; line-height:1.35; } .question-footer[data-v-1a5ff475] { display:flex; justify-content:flex-start; gap:10px; margin-top:18px; flex-wrap:wrap; } .ghost-button[data-v-1a5ff475] { padding:0 18px; border:1px solid rgba(15,23,42,0.12); background:#ffffff; color:#334155; } .ghost-button[data-v-1a5ff475]:disabled { cursor:not-allowed; color:#94a3b8; background:#edf2f7; } .dark-button[data-v-1a5ff475] { padding:0 22px; background:#111827; color:#ffffff; box-shadow:0 16px 36px rgba(17,24,39,0.18); } .result-layout[data-v-1a5ff475] { display:grid; gap:clamp(18px,3vw,30px); } .result-hero[data-v-1a5ff475] { position:relative; overflow:hidden; padding:clamp(24px,4vw,46px); color:#ffffff; background:linear-gradient(135deg,#111827,#2b364f); } .result-hero[data-v-1a5ff475]:before { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(255,255,255,0.1) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,0.08) 1px,transparent 1px); background-size:48px 48px; opacity:0.36; pointer-events:none; } .result-hero > *[data-v-1a5ff475] { position:relative; } .result-hero h2[data-v-1a5ff475] { margin:8px 0 0; font-size:clamp(72px,12vw,156px); line-height:1.05; letter-spacing:0; } .result-hero h3[data-v-1a5ff475] { margin:14px 0 10px; font-size:clamp(24px,3vw,42px); letter-spacing:0; } .result-hero p[data-v-1a5ff475] { max-width:880px; margin:0; color:rgba(255,255,255,0.78); font-size:clamp(16px,1.5vw,20px); line-height:1.8; } .tone-dream[data-v-1a5ff475] { background:linear-gradient(135deg,#22305f,#8d4f8f); } .tone-strategy[data-v-1a5ff475] { background:linear-gradient(135deg,#102a43,#116466); } .tone-warm[data-v-1a5ff475] { background:linear-gradient(135deg,#57321f,#b95f48); } .tone-ground[data-v-1a5ff475] { background:linear-gradient(135deg,#18392b,#536d3f); } .tone-balanced[data-v-1a5ff475] { background:linear-gradient(135deg,#334155,#64748b); } .result-meta[data-v-1a5ff475] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; max-width:767px; margin-top:24px; } .result-meta div[data-v-1a5ff475] { padding:14px; border:1px solid rgba(255,255,255,0.18); border-radius:8px; background:rgba(255,255,255,0.1); } .result-meta span[data-v-1a5ff475] { color:rgba(255,255,255,0.7); } .result-meta strong[data-v-1a5ff475] { display:block; margin-top:4px; color:#ffffff; font-size:24px; } .result-actions[data-v-1a5ff475] { display:flex; gap:10px; margin-top:24px; flex-wrap:wrap; } .light-button[data-v-1a5ff475] { padding:0 18px; background:rgba(255,255,255,0.14); color:#ffffff; border:1px solid rgba(255,255,255,0.24); } .dark-button[data-v-1a5ff475] { background:#ffffff; color:#111827; box-shadow:none; } .result-grid[data-v-1a5ff475] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(14px,2vw,22px); } .result-panel[data-v-1a5ff475] { padding:clamp(20px,2.5vw,28px); } .panel-title h3[data-v-1a5ff475] { margin:6px 0 0; color:#111827; font-size:24px; letter-spacing:0; } .dimension-panel[data-v-1a5ff475] { grid-row:span 2; } .dimension-row[data-v-1a5ff475] { margin-top:20px; } .dimension-head[data-v-1a5ff475],.dimension-foot[data-v-1a5ff475] { display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr); gap:10px; align-items:center; } .dimension-head span[data-v-1a5ff475],.dimension-foot span[data-v-1a5ff475] { color:#64748b; font-size:13px; font-weight:800; } .dimension-head span[data-v-1a5ff475]:last-child,.dimension-foot span[data-v-1a5ff475]:last-child { text-align:right; } .dimension-head strong[data-v-1a5ff475],.dimension-foot strong[data-v-1a5ff475] { color:#26334b; font-size:14px; } .balance-track[data-v-1a5ff475] { position:relative; height:14px; margin:10px 0; border-radius:999px; background:#e9eef5; overflow:hidden; } .balance-mid[data-v-1a5ff475] { position:absolute; top:0; bottom:0; left:50%; width:2px; background:rgba(15,23,42,0.24); z-index:2; } .balance-fill[data-v-1a5ff475] { position:absolute; top:0; bottom:0; border-radius:inherit; background:linear-gradient(90deg,#2ac4ff,#19c99a); transition:width 0.35s ease; } .balance-fill.right[data-v-1a5ff475] { background:linear-gradient(90deg,#ffcf45,#ff6f9f); } .balance-fill.neutral[data-v-1a5ff475] { left:calc(50% - 2px); width:4px; background:#94a3b8; } .profile-panel p[data-v-1a5ff475],.wide-panel p[data-v-1a5ff475] { margin:16px 0 0; color:#526174; font-size:16px; line-height:1.85; } .tag-row[data-v-1a5ff475] { display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; } .tag-row span[data-v-1a5ff475] { padding:8px 10px; border-radius:999px; background:#eef6ff; color:#2563eb; font-size:13px; font-weight:900; } .clean-list[data-v-1a5ff475] { display:grid; gap:12px; margin:18px 0 0; padding:0; list-style:none; } .clean-list li[data-v-1a5ff475] { position:relative; padding-left:18px; color:#526174; line-height:1.75; } .clean-list li[data-v-1a5ff475]:before { content:""; position:absolute; left:0; top:0.72em; width:7px; height:7px; border-radius:999px; background:#19c99a; } .wide-panel[data-v-1a5ff475] { grid-column:span 1; } .result-note[data-v-1a5ff475] { margin:0; color:#64748b; font-size:13px; line-height:1.7; text-align:center; } .toast[data-v-1a5ff475] { position:fixed; left:50%; bottom:28px; z-index:1200; transform:translateX(-50%); padding:12px 16px; border-radius:999px; background:#111827; color:#ffffff; font-size:14px; font-weight:900; box-shadow:0 20px 50px rgba(15,23,42,0.2); } .fade-slide-enter-active[data-v-1a5ff475],.fade-slide-leave-active[data-v-1a5ff475],.toast-pop-enter-active[data-v-1a5ff475],.toast-pop-leave-active[data-v-1a5ff475] { transition:opacity 0.24s ease,transform 0.24s ease; } .fade-slide-enter[data-v-1a5ff475],.fade-slide-leave-to[data-v-1a5ff475] { opacity:0; transform:translateY(12px); } .toast-pop-enter[data-v-1a5ff475],.toast-pop-leave-to[data-v-1a5ff475] { opacity:0; transform:translate(-50%,10px); } @media (max-width:991px) { .mbti-hero[data-v-1a5ff475],.result-grid[data-v-1a5ff475] { grid-template-columns:1fr; } .dimension-panel[data-v-1a5ff475] { grid-row:auto; } } @media (max-width:720px) { .mbti-shell[data-v-1a5ff475] { width:min(100% - 20px,1480px); padding-top:34px; padding-bottom:34px; } .mbti-hero[data-v-1a5ff475] { gap:10px; margin-bottom:14px; } .eyebrow[data-v-1a5ff475],.panel-title span[data-v-1a5ff475],.question-toolbar span[data-v-1a5ff475],.result-hero > span[data-v-1a5ff475] { font-size:11px; } .hero-copy h1[data-v-1a5ff475] { margin:4px 0 6px; font-size:clamp(28px,9vw,36px); line-height:1.06; } .hero-copy p[data-v-1a5ff475] { font-size:13px; line-height:1.5; } .hero-summary[data-v-1a5ff475] { gap:6px; } .hero-summary[data-v-1a5ff475],.result-meta[data-v-1a5ff475],.scale-row[data-v-1a5ff475] { grid-template-columns:1fr; } .hero-summary div[data-v-1a5ff475] { padding:9px 11px; display:grid; grid-template-columns:auto 1fr auto; gap:8px; align-items:center; } .hero-summary strong[data-v-1a5ff475] { margin:0; font-size:22px; } .hero-summary small[data-v-1a5ff475] { text-align:right; } .question-panel[data-v-1a5ff475] { min-height:auto; padding:16px; } .overall-progress[data-v-1a5ff475] { margin-bottom:14px; } .overall-progress strong[data-v-1a5ff475] { font-size:24px; } .progress-track[data-v-1a5ff475] { height:8px; margin-top:10px; } .question-toolbar[data-v-1a5ff475] { gap:10px; } .question-count[data-v-1a5ff475] { padding:7px 10px; font-size:12px; } .question-footer[data-v-1a5ff475],.result-actions[data-v-1a5ff475] { display:grid; grid-template-columns:1fr; } .question-footer button[data-v-1a5ff475],.result-actions button[data-v-1a5ff475] { width:100%; } .question-panel h2[data-v-1a5ff475] { margin:14px 0; font-size:22px; line-height:1.28; } .scale-row[data-v-1a5ff475] { gap:8px; margin-top:12px; } .scale-row button[data-v-1a5ff475] { min-height:58px; padding:10px 12px; display:flex; justify-content:space-between; gap:12px; align-items:center; text-align:left; } .scale-row strong[data-v-1a5ff475] { font-size:16px; } .scale-row span[data-v-1a5ff475] { margin-top:0; font-size:12px; } .question-footer[data-v-1a5ff475] { margin-top:12px; } } .map-page[data-v-03283571] { min-height:100vh; color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); } .map-shell[data-v-03283571] { padding:clamp(54px,6vw,86px) 0 clamp(28px,4vw,52px); } .map-header[data-v-03283571] { display:grid; grid-template-columns:minmax(0,1fr) minmax(270px,380px); gap:18px; align-items:end; margin-bottom:14px; } .eyebrow[data-v-03283571] { display:block; color:var(--color-primary ); font-size:12px; font-weight:900; text-transform:uppercase; } .map-header h1[data-v-03283571] { margin:8px 0 10px; color:var(--color-text ); font-size:clamp(38px,5vw,76px); line-height:0.98; letter-spacing:0; } .map-header p[data-v-03283571] { max-width:850px; margin:0; color:var(--color-text-soft ); font-size:clamp(15px,1.2vw,18px); line-height:1.75; } .status-card[data-v-03283571],.control-panel[data-v-03283571],.map-canvas-card[data-v-03283571] { border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 22px 60px var(--color-shadow ); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .status-card[data-v-03283571] { padding:18px; } .status-card span[data-v-03283571] { display:block; color:var(--color-primary ); font-size:12px; font-weight:900; } .status-card strong[data-v-03283571] { display:block; margin-top:8px; color:var(--color-text ); font-size:20px; line-height:1.35; } .status-card.warning span[data-v-03283571],.status-card.warning strong[data-v-03283571] { color:#dc2626; } .map-workbench[data-v-03283571] { display:grid; grid-template-columns:minmax(320px,390px) minmax(0,1fr); gap:14px; min-height:min(760px,calc(100vh - 190px)); } .control-panel[data-v-03283571] { display:flex; min-height:0; max-height:calc(100vh - 140px); padding:12px; flex-direction:column; overflow:hidden; } .panel-tabs[data-v-03283571],.route-mode[data-v-03283571],.style-row[data-v-03283571],.layer-row[data-v-03283571],.action-row[data-v-03283571],.quick-pois[data-v-03283571],.tool-grid[data-v-03283571] { display:flex; flex-wrap:wrap; gap:8px; } .panel-tabs[data-v-03283571] { margin-bottom:12px; } .panel-tabs button[data-v-03283571],.route-mode button[data-v-03283571],.style-row button[data-v-03283571],.layer-row button[data-v-03283571],.quick-pois button[data-v-03283571],.tool-grid button[data-v-03283571],.input-action button[data-v-03283571],.result-actions button[data-v-03283571],.marker-item button[data-v-03283571],.primary-button[data-v-03283571],.ghost-button[data-v-03283571],.danger-button[data-v-03283571],.toggle-card button[data-v-03283571] { min-height:38px; border:1px solid var(--color-border ); border-radius:8px; color:#334155; background:#ffffff; font-weight:900; cursor:pointer; transition:transform 0.2s ease,background 0.2s ease,color 0.2s ease,border-color 0.2s ease; } .panel-tabs button[data-v-03283571],.route-mode button[data-v-03283571],.style-row button[data-v-03283571],.layer-row button[data-v-03283571],.quick-pois button[data-v-03283571],.tool-grid button[data-v-03283571],.primary-button[data-v-03283571],.ghost-button[data-v-03283571],.danger-button[data-v-03283571],.toggle-card button[data-v-03283571] { padding:0 12px; } .panel-tabs button[data-v-03283571]:hover,.panel-tabs button.active[data-v-03283571],.route-mode button.active[data-v-03283571],.style-row button.active[data-v-03283571],.layer-row button.active[data-v-03283571],.primary-button[data-v-03283571] { border-color:var(--color-button ); color:#ffffff; background:var(--color-button ); } .ghost-button[data-v-03283571]:hover,.quick-pois button[data-v-03283571]:hover,.tool-grid button[data-v-03283571]:hover,.toggle-card button[data-v-03283571]:hover { border-color:rgba(15,159,154,0.4); color:#0f766e; background:rgba(15,159,154,0.1); } .danger-button[data-v-03283571] { width:100%; color:#dc2626; background:rgba(220,38,38,0.08); } .panel-section[data-v-03283571] { min-height:0; overflow-y:auto; padding-right:4px; } .field[data-v-03283571] { display:grid; gap:7px; margin-bottom:12px; } .field span[data-v-03283571],.layer-box > span[data-v-03283571],.route-summary span[data-v-03283571] { color:var(--color-text-soft ); font-size:12px; font-weight:900; text-transform:uppercase; } .field input[data-v-03283571],.field select[data-v-03283571] { width:100%; min-height:42px; border:1px solid var(--color-border ); border-radius:8px; padding:0 12px; color:var(--color-text ); background:#ffffff; font-size:14px; outline:none; } .field input[data-v-03283571]:focus,.field select[data-v-03283571]:focus { border-color:rgba(15,159,154,0.58); box-shadow:0 0 0 3px rgba(15,159,154,0.12); } .input-action[data-v-03283571] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; } .input-action button[data-v-03283571] { padding:0 14px; } .suggestion-list[data-v-03283571],.result-list[data-v-03283571],.marker-list[data-v-03283571] { display:grid; gap:8px; margin-top:10px; } .suggestion-list button[data-v-03283571],.result-item[data-v-03283571],.marker-item[data-v-03283571],.toggle-card[data-v-03283571],.route-summary[data-v-03283571],.layer-box[data-v-03283571] { border:1px solid var(--color-border ); border-radius:8px; background:rgba(248,250,252,0.9); } .suggestion-list button[data-v-03283571] { display:grid; gap:3px; padding:10px; text-align:left; cursor:pointer; } .suggestion-list strong[data-v-03283571],.result-item strong[data-v-03283571],.marker-item strong[data-v-03283571] { color:var(--color-text ); font-size:14px; } .suggestion-list span[data-v-03283571],.result-item span[data-v-03283571],.marker-item span[data-v-03283571],.toggle-card span[data-v-03283571] { color:var(--color-text-soft ); font-size:12px; line-height:1.5; } .quick-pois[data-v-03283571] { margin:6px 0 12px; } .result-item[data-v-03283571],.marker-item[data-v-03283571],.toggle-card[data-v-03283571] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px; cursor:pointer; } .result-item.active[data-v-03283571] { border-color:rgba(15,159,154,0.46); background:rgba(15,159,154,0.1); } .marker-item[data-v-03283571] { grid-template-columns:1fr; align-items:stretch; } .marker-main[data-v-03283571] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; align-items:start; } .marker-main small[data-v-03283571] { display:block; margin-top:3px; color:#94a3b8; font-size:11px; font-weight:800; } .marker-main em[data-v-03283571] { border-radius:999px; background:rgba(15,23,42,0.07); color:#64748b; font-size:11px; font-style:normal; font-weight:900; padding:4px 8px; } .result-item strong[data-v-03283571],.result-item span[data-v-03283571],.marker-item strong[data-v-03283571],.marker-item span[data-v-03283571] { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .result-actions[data-v-03283571] { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:5px; } .result-actions button[data-v-03283571],.marker-item button[data-v-03283571] { min-height:30px; padding:0 8px; font-size:12px; } .route-mode[data-v-03283571] { margin-bottom:12px; } .action-row[data-v-03283571] { display:grid; grid-template-columns:1fr 1fr; margin-bottom:12px; } .route-summary[data-v-03283571] { display:grid; gap:6px; padding:12px; margin-bottom:12px; } .route-summary strong[data-v-03283571] { color:var(--color-text ); line-height:1.45; } .route-result-panel[data-v-03283571] { max-height:320px; overflow-y:auto; border-radius:8px; background:#ffffff; } .tool-grid[data-v-03283571] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:12px; } .location-card[data-v-03283571] { display:grid; gap:10px; margin-bottom:12px; padding:12px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:rgba(255,255,255,0.82); } .location-card.accent[data-v-03283571] { border-color:rgba(230,57,124,0.24); background:rgba(255,247,250,0.9); } .location-card-head[data-v-03283571] { display:flex; align-items:center; justify-content:space-between; gap:10px; } .location-card-head strong[data-v-03283571] { min-width:0; color:var(--color-text ); font-size:15px; } .location-card-head span[data-v-03283571] { flex:0 0 auto; border-radius:999px; background:rgba(15,23,42,0.06); color:var(--color-text-soft ); font-size:12px; font-weight:900; padding:4px 8px; } .location-detail[data-v-03283571] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0; } .location-detail div[data-v-03283571] { min-width:0; } .location-detail .full[data-v-03283571] { grid-column:1/-1; } .location-detail dt[data-v-03283571] { margin:0 0 4px; color:var(--color-text-soft ); font-size:11px; font-weight:900; text-transform:uppercase; } .location-detail dd[data-v-03283571] { margin:0; color:var(--color-text ); font-size:13px; font-weight:800; line-height:1.5; overflow-wrap:break-word; } .location-empty[data-v-03283571] { border:1px dashed rgba(15,23,42,0.12); border-radius:8px; color:var(--color-text-soft ); font-size:13px; line-height:1.5; padding:10px; } .location-actions[data-v-03283571],.marker-actions[data-v-03283571] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; } .location-actions button[data-v-03283571],.marker-actions button[data-v-03283571] { min-height:34px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:#ffffff; color:#334155; cursor:pointer; font-size:12px; font-weight:900; } .location-actions button[data-v-03283571]:hover,.marker-actions button[data-v-03283571]:hover { border-color:var(--color-button ); color:#ffffff; background:var(--color-button ); } .layer-box[data-v-03283571] { display:grid; gap:9px; padding:12px; margin-bottom:12px; } .style-row[data-v-03283571],.layer-row[data-v-03283571] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } .empty-state[data-v-03283571] { min-height:92px; display:grid; place-items:center; padding:14px; border:1px dashed var(--color-border ); border-radius:8px; color:var(--color-text-soft ); text-align:center; line-height:1.5; } .map-canvas-card[data-v-03283571] { position:relative; min-height:640px; overflow:hidden; } #map-container[data-v-03283571] { width:100%; height:100%; min-height:640px; } .map-loading[data-v-03283571] { position:absolute; inset:0; display:grid; place-items:center; align-content:center; gap:8px; color:var(--color-text ); background:var(--gradient-soft ),#eef2f7; text-align:center; } .map-loading strong[data-v-03283571],.map-loading span[data-v-03283571] { display:block; } .map-floating-status[data-v-03283571] { position:absolute; left:14px; right:14px; bottom:14px; width:-moz-fit-content; width:fit-content; max-width:min(580px,calc(100% - 28px)); min-height:40px; display:flex; align-items:center; padding:0 14px; border:1px solid var(--color-border ); border-radius:999px; color:#334155; background:rgba(255,255,255,0.9); font-size:13px; font-weight:900; box-shadow:0 16px 40px var(--color-shadow ); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); } @media (max-width:1199px) { .map-header[data-v-03283571],.map-workbench[data-v-03283571] { grid-template-columns:1fr; } .control-panel[data-v-03283571] { max-height:none; } .map-canvas-card[data-v-03283571],#map-container[data-v-03283571] { min-height:560px; } } @media (max-width:767px) { .map-shell[data-v-03283571] { width:min(100% - 20px,1760px); padding-top:42px; } .map-header h1[data-v-03283571] { font-size:36px; } .panel-tabs[data-v-03283571],.quick-pois[data-v-03283571] { flex-wrap:nowrap; overflow-x:auto; padding-bottom:2px; } .panel-tabs button[data-v-03283571],.quick-pois button[data-v-03283571] { flex:0 0 auto; } .input-action[data-v-03283571],.action-row[data-v-03283571],.result-item[data-v-03283571],.marker-item[data-v-03283571],.toggle-card[data-v-03283571],.tool-grid[data-v-03283571],.style-row[data-v-03283571],.layer-row[data-v-03283571] { grid-template-columns:1fr; } .result-actions[data-v-03283571] { width:100%; justify-content:stretch; } .result-actions button[data-v-03283571] { flex:1; } .map-canvas-card[data-v-03283571],#map-container[data-v-03283571] { min-height:480px; } } .map-info-window { display:grid; gap:7px; width:min(280px,calc(100vw - 48px)); color:#172033; line-height:1.45; } .map-info-window > strong { color:#111827; font-size:15px; font-weight:900; } .map-info-window p { display:grid; gap:2px; margin:0; } .map-info-window span { color:#64748b; font-size:11px; font-weight:900; } .map-info-window em { color:#253044; font-size:12px; font-style:normal; font-weight:800; overflow-wrap:break-word; } .map-info-actions { display:flex; flex-wrap:wrap; gap:6px; margin-top:3px; } .map-info-actions button { min-height:30px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:#111827; color:#ffffff; cursor:pointer; font-size:12px; font-weight:900; padding:0 9px; } .map-page{--pink-bg:#F1DDDF;--cream:#FFF9F7;--ink:#1A1A1D;--red:#E72D48;--green:#2FA84F;background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.13) 2px,transparent 2.5px) 0 0/26px 26px,var(--pink-bg )!important;color:var(--ink );overflow-x:hidden}.map-page*,.map-page*::before,.map-page*::after{box-sizing:border-box}.map-shell{width:min(100%,1420px);margin:0 auto}.map-header,.control-panel,.map-canvas-card,.status-card,.panel-section,.location-card,.toggle-card,.route-result-panel{background:var(--cream )!important;color:var(--ink )!important;border:3px solid var(--ink )!important;border-radius:24px!important;box-shadow:8px 8px 0 var(--red )!important}.map-header{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,360px);gap:20px;align-items:end}.eyebrow{display:inline-flex;width:-moz-fit-content;width:fit-content;padding:6px 12px;border:3px solid var(--ink );border-radius:999px;background:var(--red );color:var(--cream );box-shadow:4px 4px 0 var(--ink );font-weight:900}.map-header h1{color:var(--ink );line-height:1.05;letter-spacing:-1.5px}.map-header p{color:rgba(26,26,29,.76);line-height:1.75}.status-card{box-shadow:8px 8px 0 var(--ink )!important}.status-card strong{color:var(--red )!important}.status-card.warning{box-shadow:8px 8px 0 var(--red )!important}.map-workbench{display:grid;grid-template-columns:minmax(300px,390px) minmax(0,1fr);gap:22px;align-items:start}.control-panel{position:sticky;top:20px;min-width:0;padding:clamp(14px,2vw,20px)}.map-canvas-card{min-width:0;overflow:hidden;padding:12px}.panel-tabs,.quick-pois,.route-mode,.action-row,.result-actions,.marker-actions{display:flex;flex-wrap:wrap;gap:10px}.panel-tabs button,.quick-pois button,.route-mode button,.primary-button,.ghost-button,.danger-button,.input-action button,.result-actions button,.marker-actions button,.toggle-card button{border:3px solid var(--ink )!important;border-radius:14px!important;background:var(--cream )!important;color:var(--ink )!important;font-weight:900;box-shadow:4px 4px 0 var(--ink )!important;transition:transform .15s ease,box-shadow .15s ease}.panel-tabs button.active,.route-mode button.active,.primary-button,.input-action button{background:var(--red )!important;color:var(--cream )!important}.danger-button{color:var(--red )!important;background:#fff!important}.panel-tabs button:hover,.quick-pois button:hover,.route-mode button:hover,.primary-button:hover,.ghost-button:hover,.danger-button:hover,.input-action button:hover,.result-actions button:hover,.marker-actions button:hover,.toggle-card button:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink )!important}.panel-tabs button:active,.quick-pois button:active,.route-mode button:active,.primary-button:active,.ghost-button:active,.danger-button:active,.input-action button:active,.result-actions button:active,.marker-actions button:active,.toggle-card button:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink )!important}.field input,.field select,input,select,textarea{max-width:100%;min-width:0;border:3px solid var(--ink )!important;border-radius:14px!important;background:#fff!important;color:var(--ink )!important;font-weight:800}.field input:focus,.field select:focus,input:focus,select:focus,textarea:focus{outline:none;box-shadow:0 0 0 4px rgba(231,45,72,.18)!important}.input-action{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px}.result-item,.marker-item,.suggestion-list button,.layer-row{border:3px solid var(--ink )!important;border-radius:16px!important;background:#fff!important;color:var(--ink )!important;box-shadow:4px 4px 0 rgba(26,26,29,.18)!important}.result-item.active,.location-card.accent{background:var(--red )!important;color:var(--cream )!important;box-shadow:5px 5px 0 var(--ink )!important}.marker-list,.result-list,.suggestion-list{display:grid;gap:10px;max-height:360px;overflow:auto;padding-right:4px}.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.location-detail{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.location-detail .full{grid-column:1/-1}#map-container{width:100%!important;min-height:620px;border:3px solid var(--ink )!important;border-radius:18px!important;overflow:hidden}.map-floating-status,.map-loading{border:3px solid var(--ink )!important;background:var(--cream )!important;color:var(--ink )!important;box-shadow:5px 5px 0 var(--red )!important}.layer-box{border:3px dashed var(--ink )!important;border-radius:18px!important;background:rgba(255,249,247,.75)!important}.empty-state{border:3px dashed var(--ink );border-radius:16px;background:#fff;color:var(--ink )} @media(max-width:1199px){.map-workbench,.map-header{grid-template-columns:1fr}.control-panel{position:static}#map-container{min-height:560px}} @media(max-width:767px){.map-page{padding:14px!important}.map-header,.control-panel,.map-canvas-card,.status-card,.panel-section,.location-card,.toggle-card{border-radius:18px!important;box-shadow:5px 5px 0 var(--red )!important}.panel-tabs,.quick-pois,.route-mode,.action-row,.result-actions,.marker-actions{display:grid;grid-template-columns:1fr}.panel-tabs button,.quick-pois button,.route-mode button,.action-row button,.result-actions button,.marker-actions button,.primary-button,.ghost-button,.danger-button{width:100%}.input-action{grid-template-columns:1fr}.tool-grid,.location-detail{grid-template-columns:1fr}.location-detail .full{grid-column:auto}#map-container{min-height:68vh}.marker-item,.result-item{grid-template-columns:1fr!important}.map-floating-status{max-width:calc(100% - 28px);left:14px;right:14px}} .weight-page[data-v-6d3570bd],.weight-page *[data-v-6d3570bd] { box-sizing:border-box; } .weight-page[data-v-6d3570bd] { --wa-red:#E72D48; --wa-red-dark:#B81F36; --wa-pink:#F1DDDF; --wa-cream:#FFF9F7; --wa-paper:#FFF4F5; --wa-ink:#1A1A1D; --wa-soft:rgba(26,26,29,.66); --wa-muted:rgba(26,26,29,.46); --wa-green:#2FA84F; position:relative; min-height:100vh; overflow-x:hidden; color:var(--wa-ink ); background:radial-gradient(circle at 82% 12%,rgba(231,45,72,.18),transparent 25%),radial-gradient(circle at 12% 82%,rgba(231,45,72,.10),transparent 28%),linear-gradient(180deg,var(--wa-pink ) 0%,#fff2f3 52%,var(--wa-cream ) 100%); font-family:"PingFang SC","Microsoft YaHei",sans-serif; } .weight-page[data-v-6d3570bd]::before,.weight-page[data-v-6d3570bd]::after { content:""; position:fixed; z-index:0; pointer-events:none; } .weight-page[data-v-6d3570bd]::before { inset:0; opacity:.17; background:radial-gradient(circle,rgba(231,45,72,.6) 0 1.5px,transparent 2.5px) 0 0/22px 22px,repeating-linear-gradient(0deg,rgba(231,45,72,.10) 0 1px,transparent 1px 18px),repeating-linear-gradient(90deg,rgba(231,45,72,.08) 0 1px,transparent 1px 18px); -webkit-mask-image:linear-gradient(135deg,#000 0 18%,transparent 38% 70%,#000 88% 100%); mask-image:linear-gradient(135deg,#000 0 18%,transparent 38% 70%,#000 88% 100%); } .weight-page[data-v-6d3570bd]::after { top:18px; right:38px; width:12px; height:12px; background:var(--wa-red ); box-shadow:18px 0 0 rgba(231,45,72,.55),36px 0 0 rgba(231,45,72,.35),18px 18px 0 rgba(231,45,72,.28),-18px 36px 0 rgba(231,45,72,.24),42px 42px 0 rgba(26,26,29,.16); } .pixel-back[data-v-6d3570bd],.weight-shell[data-v-6d3570bd] { position:relative; z-index:1; } .pixel-back[data-v-6d3570bd] { display:inline-flex; align-items:center; min-height:38px; margin:18px 0 0 max(18px,calc((100vw - 1480px) / 2)); padding:0 14px; border:3px solid var(--wa-red ); background:var(--wa-cream ); color:var(--wa-red ); box-shadow:4px 4px 0 var(--wa-ink ); cursor:pointer; font-size:16px; font-weight:950; transition:transform .16s ease,box-shadow .16s ease; } .pixel-back[data-v-6d3570bd]:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--wa-ink ); } .pixel-back[data-v-6d3570bd]::before { content:""; width:0; height:0; margin-right:8px; border-top:7px solid transparent; border-right:12px solid var(--wa-red ); border-bottom:7px solid transparent; } .weight-shell[data-v-6d3570bd] { width:min(100% - 56px,1480px); margin:0 auto; padding:26px 0 clamp(42px,6vw,78px); } .pixel-panel[data-v-6d3570bd] { position:relative; border:3px solid var(--wa-red ); border-radius:0; background:var(--wa-cream ); box-shadow:8px 8px 0 var(--wa-ink ); } .pixel-panel[data-v-6d3570bd]::before { content:""; position:absolute; top:-3px; left:28px; width:58px; height:6px; background:var(--wa-red ); } .pixel-tag[data-v-6d3570bd],.pixel-chip[data-v-6d3570bd] { display:inline-flex; width:-moz-fit-content; width:fit-content; min-height:26px; align-items:center; border:2px solid var(--wa-red ); background:var(--wa-red ); color:var(--wa-cream ); font-size:13px; font-weight:950; padding:0 12px; box-shadow:3px 3px 0 var(--wa-ink ); white-space:nowrap; } .pixel-tag.light[data-v-6d3570bd] { background:var(--wa-cream ); color:var(--wa-red ); border-color:var(--wa-cream ); } .pixel-chip[data-v-6d3570bd] { background:var(--wa-cream ); color:var(--wa-red ); } .tag-row[data-v-6d3570bd] { display:flex; flex-wrap:wrap; gap:10px; align-items:center; } .hero-grid[data-v-6d3570bd] { display:grid; grid-template-columns:minmax(0,1.08fr) minmax(420px,.92fr); gap:26px; align-items:stretch; } .hero-panel[data-v-6d3570bd] { min-width:0; overflow:hidden; padding:clamp(26px,3.5vw,48px); background:radial-gradient(circle at 78% 62%,rgba(231,45,72,.16),transparent 25%),linear-gradient(135deg,var(--wa-cream ),#ffecef); } .hero-panel[data-v-6d3570bd]::after { content:""; position:absolute; right:-54px; bottom:-70px; width:210px; height:210px; border:34px solid rgba(231,45,72,.13); background:rgba(255,255,255,.28); border-radius:50%; } .hero-panel h1[data-v-6d3570bd] { position:relative; z-index:1; max-width:7.5ch; margin:22px 0 0; color:var(--wa-red ); font-size:clamp(74px,8.4vw,132px); font-weight:950; letter-spacing:-0.06em; line-height:.9; text-shadow:4px 4px 0 var(--wa-cream ),8px 8px 0 rgba(26,26,29,.18); } .hero-desc[data-v-6d3570bd] { position:relative; z-index:1; max-width:560px; margin:18px 0 0; color:var(--wa-ink ); font-size:clamp(17px,1.35vw,22px); font-weight:900; line-height:1.65; } .weight-form[data-v-6d3570bd] { position:relative; z-index:1; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; max-width:690px; margin-top:clamp(30px,4vw,48px); } .weight-field[data-v-6d3570bd] { display:grid; min-width:0; gap:10px; } .weight-field > span[data-v-6d3570bd] { color:var(--wa-ink ); font-size:14px; font-weight:950; } .input-frame[data-v-6d3570bd] { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; min-width:0; border:3px solid var(--wa-ink ); background:var(--wa-cream ); box-shadow:4px 4px 0 rgba(26,26,29,.18); } .input-frame input[data-v-6d3570bd] { width:100%; min-width:0; min-height:58px; border:0; outline:0; background:transparent; color:var(--wa-ink ); font-size:18px; font-weight:900; padding:0 18px; } .input-frame input[data-v-6d3570bd]::-moz-placeholder { color:rgba(26,26,29,.44); } .input-frame input[data-v-6d3570bd]::placeholder { color:rgba(26,26,29,.44); } .input-frame input[data-v-6d3570bd]:focus { box-shadow:inset 0 0 0 3px rgba(231,45,72,.35); } .input-frame em[data-v-6d3570bd] { padding:0 16px; color:var(--wa-ink ); font-style:normal; font-weight:950; } .weight-form button[data-v-6d3570bd],.tip-panel button[data-v-6d3570bd] { min-height:58px; border:3px solid var(--wa-ink ); border-radius:0; background:var(--wa-red ); color:var(--wa-cream ); box-shadow:5px 5px 0 var(--wa-ink ); cursor:pointer; font-size:16px; font-weight:950; padding:0 30px; transition:transform .16s ease,box-shadow .16s ease,background .16s ease; } .weight-form button[data-v-6d3570bd]:hover,.tip-panel button[data-v-6d3570bd]:hover,.record-item button[data-v-6d3570bd]:hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 var(--wa-ink ); background:var(--wa-red-dark ); } .hero-foot[data-v-6d3570bd] { position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:10px 20px; align-items:center; margin-top:15px; color:var(--wa-soft ); font-size:14px; font-weight:950; } .hero-foot span[data-v-6d3570bd]::before { content:"■"; color:var(--wa-red ); margin-right:8px; } .form-message.success[data-v-6d3570bd] { color:var(--wa-green ); } .form-message.error[data-v-6d3570bd] { color:var(--wa-red ); } .current-panel[data-v-6d3570bd] { display:grid; grid-template-columns:minmax(0,1fr) 142px; gap:20px; align-items:center; min-width:0; overflow:hidden; padding:clamp(26px,3.5vw,44px); border-color:var(--wa-ink ); background:var(--wa-red ); color:var(--wa-cream ); } .current-panel[data-v-6d3570bd]::before { background:var(--wa-cream ); left:30px; } .current-text[data-v-6d3570bd] { position:relative; z-index:2; } .current-text h2[data-v-6d3570bd] { margin:22px 0 0; color:var(--wa-ink ); font-size:20px; font-weight:950; } .current-number[data-v-6d3570bd] { display:flex; min-width:0; align-items:baseline; gap:12px; margin-top:12px; } .current-number strong[data-v-6d3570bd],.stat-card strong[data-v-6d3570bd],.record-item strong[data-v-6d3570bd],.summary-grid strong[data-v-6d3570bd] { font-family:"DIN Alternate","Arial Black",Consolas,monospace; } .current-number strong[data-v-6d3570bd] { color:var(--wa-cream ); font-size:clamp(78px,7.6vw,126px); font-weight:950; line-height:.9; text-shadow:5px 5px 0 rgba(26,26,29,.18); } .current-number small[data-v-6d3570bd] { color:var(--wa-cream ); font-size:clamp(25px,2.8vw,36px); font-weight:950; } .current-text p[data-v-6d3570bd] { margin:20px 0 48px; color:var(--wa-ink ); font-size:16px; font-weight:950; } .heart-line[data-v-6d3570bd] { position:absolute; left:34px; right:170px; bottom:38px; height:44px; opacity:.96; background:var(--wa-cream ); -webkit-clip-path:polygon(0 58%,8% 58%,10% 46%,14% 68%,18% 54%,22% 58%,26% 58%,29% 30%,34% 76%,38% 58%,46% 58%,49% 44%,53% 58%,59% 58%,62% 66%,66% 54%,71% 58%,80% 58%,83% 35%,89% 70%,94% 56%,100% 56%,100% 100%,0 100%); clip-path:polygon(0 58%,8% 58%,10% 46%,14% 68%,18% 54%,22% 58%,26% 58%,29% 30%,34% 76%,38% 58%,46% 58%,49% 44%,53% 58%,59% 58%,62% 66%,66% 54%,71% 58%,80% 58%,83% 35%,89% 70%,94% 56%,100% 56%,100% 100%,0 100%); } .pixel-heart[data-v-6d3570bd] { position:absolute; right:118px; top:58px; width:58px; height:46px; background:linear-gradient(var(--wa-cream ) 0 0) 16px 0/26px 13px no-repeat,linear-gradient(var(--wa-cream ) 0 0) 3px 13px/52px 13px no-repeat,linear-gradient(var(--wa-cream ) 0 0) 15px 26px/28px 13px no-repeat,linear-gradient(var(--wa-cream ) 0 0) 25px 39px/8px 8px no-repeat; opacity:.9; } .pixel-bot[data-v-6d3570bd] { position:relative; z-index:2; width:126px; height:168px; align-self:end; justify-self:end; filter:drop-shadow(5px 5px 0 rgba(26,26,29,.18)); } .pixel-bot i[data-v-6d3570bd] { position:absolute; display:block; } .bot-head[data-v-6d3570bd] { top:16px; left:31px; width:60px; height:48px; border:4px solid var(--wa-ink ); background:var(--wa-cream ); box-shadow:18px 17px 0 -11px var(--wa-ink ),40px 17px 0 -11px var(--wa-ink ); } .bot-body[data-v-6d3570bd] { top:76px; left:22px; width:78px; height:64px; border:4px solid var(--wa-ink ); background:#ffd4dc; } .bot-heart[data-v-6d3570bd] { top:98px; left:52px; width:18px; height:18px; background:var(--wa-red ); transform:rotate(45deg); } .bot-heart[data-v-6d3570bd]::before,.bot-heart[data-v-6d3570bd]::after { content:""; position:absolute; width:18px; height:18px; background:var(--wa-red ); } .bot-heart[data-v-6d3570bd]::before { left:-9px; } .bot-heart[data-v-6d3570bd]::after { top:-9px; } .bot-arm[data-v-6d3570bd] { top:88px; width:18px; height:34px; border:4px solid var(--wa-ink ); background:var(--wa-cream ); } .bot-arm.left[data-v-6d3570bd] { left:0; } .bot-arm.right[data-v-6d3570bd] { right:3px; } .bot-leg[data-v-6d3570bd] { top:144px; width:21px; height:22px; border:4px solid var(--wa-ink ); background:var(--wa-cream ); } .bot-leg.left[data-v-6d3570bd] { left:35px; } .bot-leg.right[data-v-6d3570bd] { left:70px; } .stat-grid[data-v-6d3570bd] { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:18px; margin-top:32px; } .stat-card[data-v-6d3570bd] { min-width:0; min-height:154px; overflow:hidden; padding:22px; border-color:var(--wa-red ); background:var(--wa-cream ); box-shadow:6px 6px 0 var(--wa-ink ); } .stat-card[data-v-6d3570bd]::before { left:auto; right:16px; width:12px; height:12px; background:var(--wa-cream ); border:3px solid var(--wa-red ); } .stat-icon[data-v-6d3570bd] { width:22px; height:22px; border:3px solid var(--wa-red ); background:var(--wa-cream ); margin-bottom:18px; } .stat-card span[data-v-6d3570bd] { color:var(--wa-ink ); font-size:16px; font-weight:950; } .stat-card strong[data-v-6d3570bd] { display:block; margin-top:18px; color:var(--wa-ink ); font-size:clamp(32px,2.8vw,50px); font-weight:950; line-height:.95; } .stat-card small[data-v-6d3570bd] { color:var(--wa-ink ); font-size:16px; font-weight:950; } .stat-card p[data-v-6d3570bd] { margin:14px 0 0; color:var(--wa-soft ); font-size:14px; font-weight:950; } .stat-card.is-primary[data-v-6d3570bd] { border-color:var(--wa-ink ); background:var(--wa-red ); box-shadow:8px 8px 0 var(--wa-ink ); } .stat-card.is-primary span[data-v-6d3570bd],.stat-card.is-primary strong[data-v-6d3570bd],.stat-card.is-primary small[data-v-6d3570bd],.stat-card.is-primary p[data-v-6d3570bd] { color:var(--wa-cream ); } .stat-card.is-primary .stat-icon[data-v-6d3570bd] { border-color:var(--wa-ink ); } .stat-card.is-down[data-v-6d3570bd] { border-color:var(--wa-green ); } .stat-card.is-down strong[data-v-6d3570bd],.stat-card.is-down p[data-v-6d3570bd] { color:var(--wa-green ); } .stat-card.is-up[data-v-6d3570bd] { border-color:var(--wa-red ); } .stat-card.is-up strong[data-v-6d3570bd],.stat-card.is-up p[data-v-6d3570bd] { color:var(--wa-red ); } .stat-card.is-missing strong[data-v-6d3570bd] { font-size:clamp(24px,2vw,30px); line-height:1.15; } .pixel-bars[data-v-6d3570bd] { position:absolute; right:14px; bottom:12px; width:7px; height:10px; background:var(--wa-red ); box-shadow:11px -8px 0 var(--wa-red ),22px -18px 0 rgba(231,45,72,.78),33px -28px 0 var(--wa-green ); } .analysis-grid[data-v-6d3570bd] { display:grid; grid-template-columns:minmax(0,1fr) minmax(310px,380px); gap:28px; align-items:stretch; margin-top:36px; } .chart-panel[data-v-6d3570bd] { min-width:0; padding:clamp(20px,2.6vw,34px); border-color:var(--wa-ink ); box-shadow:8px 8px 0 var(--wa-red ); } .section-head[data-v-6d3570bd] { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; margin-bottom:22px; } .title-block[data-v-6d3570bd] { display:flex; min-width:0; align-items:flex-start; gap:16px; } .square-icon[data-v-6d3570bd] { flex:0 0 auto; width:48px; height:48px; border:3px solid var(--wa-red ); background:linear-gradient(var(--wa-red ) 0 0) 13px 12px/22px 9px no-repeat,linear-gradient(var(--wa-red ) 0 0) 9px 21px/30px 13px no-repeat,var(--wa-cream ); box-shadow:4px 4px 0 var(--wa-ink ); } .section-head h2[data-v-6d3570bd],.compact-head h2[data-v-6d3570bd],.summary-panel h2[data-v-6d3570bd],.tip-panel h2[data-v-6d3570bd] { margin:8px 0 0; color:var(--wa-ink ); font-size:clamp(28px,3vw,48px); font-weight:950; letter-spacing:-0.035em; line-height:1.02; } .section-head p[data-v-6d3570bd],.summary-panel p[data-v-6d3570bd],.tip-panel p[data-v-6d3570bd] { margin:10px 0 0; color:var(--wa-soft ); font-size:15px; font-weight:900; line-height:1.75; } .range-chip[data-v-6d3570bd] { flex:0 0 auto; min-height:44px; border:3px solid var(--wa-ink ); background:var(--wa-red ); color:var(--wa-cream ); cursor:default; font-size:14px; font-weight:950; padding:0 16px; box-shadow:4px 4px 0 var(--wa-ink ); } .chart-wrap[data-v-6d3570bd] { min-width:0; overflow:hidden; border:3px solid var(--wa-ink ); background:repeating-linear-gradient(0deg,rgba(231,45,72,.13) 0 1px,transparent 1px 22px),repeating-linear-gradient(90deg,rgba(231,45,72,.1) 0 1px,transparent 1px 22px),#fff4f5; padding:12px; } .weight-chart[data-v-6d3570bd] { display:block; width:100%; height:clamp(310px,33vw,430px); } .trend-area[data-v-6d3570bd] { fill:rgba(231,45,72,.12); } .grid-line[data-v-6d3570bd] { stroke:rgba(231,45,72,.26); stroke-dasharray:4 6; stroke-width:1; } .axis-title[data-v-6d3570bd],.axis-label[data-v-6d3570bd],.date-label[data-v-6d3570bd] { fill:rgba(26,26,29,.76); font-size:12px; font-weight:950; } .trend-line[data-v-6d3570bd] { fill:none; stroke:var(--wa-red ); stroke-linecap:square; stroke-linejoin:miter; stroke-width:5; } .point-hit[data-v-6d3570bd] { fill:transparent; cursor:pointer; } .point-dot[data-v-6d3570bd] { fill:var(--wa-cream ); stroke:var(--wa-red ); stroke-width:4; transition:fill .16s ease; } .point-group:hover .point-dot[data-v-6d3570bd],.point-group:focus .point-dot[data-v-6d3570bd] { fill:var(--wa-red ); } .chart-tooltip rect[data-v-6d3570bd],.chart-tooltip path[data-v-6d3570bd] { fill:var(--wa-cream ); stroke:var(--wa-red ); stroke-width:3; } .chart-tooltip text[data-v-6d3570bd] { fill:var(--wa-ink ); font-size:14px; font-weight:950; } .chart-tooltip text + text[data-v-6d3570bd] { fill:var(--wa-red ); } .empty-state[data-v-6d3570bd] { display:grid; min-height:170px; place-items:center; align-content:center; gap:8px; border:3px dashed rgba(231,45,72,.58); background:#fff4f5; color:var(--wa-soft ); text-align:center; padding:18px; } .empty-state strong[data-v-6d3570bd] { color:var(--wa-ink ); font-size:20px; font-weight:950; } .empty-state.small[data-v-6d3570bd] { min-height:112px; } .side-stack[data-v-6d3570bd] { display:grid; grid-template-rows:auto auto 1fr; gap:22px; min-width:0; } .summary-panel[data-v-6d3570bd],.recent-panel[data-v-6d3570bd],.tip-panel[data-v-6d3570bd] { padding:22px; } .summary-grid[data-v-6d3570bd] { display:grid; grid-template-columns:1fr auto; gap:10px 18px; margin-top:18px; padding-top:16px; border-top:3px dashed rgba(231,45,72,.35); } .summary-grid span[data-v-6d3570bd] { color:var(--wa-soft ); font-size:14px; font-weight:900; } .summary-grid strong[data-v-6d3570bd] { color:var(--wa-red ); font-size:20px; font-weight:950; } .compact-head[data-v-6d3570bd] { display:flex; align-items:flex-start; justify-content:space-between; gap:14px; margin-bottom:18px; } .compact-head > strong[data-v-6d3570bd] { flex:0 0 auto; min-height:32px; display:inline-flex; align-items:center; border:2px solid var(--wa-red ); background:var(--wa-red ); color:var(--wa-cream ); padding:0 10px; box-shadow:3px 3px 0 var(--wa-ink ); font-size:13px; font-weight:950; } .record-list[data-v-6d3570bd] { display:grid; gap:10px; } .record-item[data-v-6d3570bd] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; border:3px solid rgba(26,26,29,.88); background:#fff4f5; padding:12px; box-shadow:4px 4px 0 rgba(231,45,72,.26); } .record-item div[data-v-6d3570bd] { min-width:0; } .record-item strong[data-v-6d3570bd] { display:block; color:var(--wa-ink ); font-size:22px; font-weight:950; line-height:1; } .record-item span[data-v-6d3570bd] { display:block; margin-top:6px; color:var(--wa-soft ); font-size:13px; font-weight:900; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .record-item button[data-v-6d3570bd] { min-height:34px; border:3px solid var(--wa-red ); background:var(--wa-cream ); color:var(--wa-red ); box-shadow:3px 3px 0 var(--wa-ink ); cursor:pointer; font-size:13px; font-weight:950; } .tip-panel[data-v-6d3570bd] { display:grid; align-content:start; gap:16px; border-color:var(--wa-ink ); background:var(--wa-red ); color:var(--wa-cream ); overflow:hidden; } .tip-panel[data-v-6d3570bd]::before { background:var(--wa-cream ); } .tip-panel .pixel-tag[data-v-6d3570bd] { background:var(--wa-cream ); color:var(--wa-red ); border-color:var(--wa-cream ); } .tip-panel h2[data-v-6d3570bd],.tip-panel p[data-v-6d3570bd] { color:var(--wa-cream ); } .tip-panel p[data-v-6d3570bd] { font-size:17px; font-weight:900; } .tip-panel button[data-v-6d3570bd] { width:100%; margin-top:2px; background:var(--wa-cream ); color:var(--wa-red ); } .tip-heart[data-v-6d3570bd] { width:62px; height:56px; background:linear-gradient(var(--wa-cream ) 0 0) 19px 6px/24px 12px no-repeat,linear-gradient(var(--wa-cream ) 0 0) 7px 18px/48px 12px no-repeat,linear-gradient(var(--wa-cream ) 0 0) 18px 30px/26px 12px no-repeat,linear-gradient(var(--wa-cream ) 0 0) 28px 42px/8px 8px no-repeat; border:3px solid var(--wa-cream ); box-shadow:5px 5px 0 var(--wa-ink ); } .tip-bot[data-v-6d3570bd] { position:absolute; right:18px; bottom:76px; width:70px; height:82px; opacity:.9; } .tip-bot i[data-v-6d3570bd]:nth-child(1) { position:absolute; top:0; left:20px; width:36px; height:28px; border:3px solid var(--wa-ink ); background:var(--wa-cream ); } .tip-bot i[data-v-6d3570bd]:nth-child(2) { position:absolute; top:34px; left:14px; width:48px; height:38px; border:3px solid var(--wa-ink ); background:#ffd6dd; } .tip-bot i[data-v-6d3570bd]:nth-child(3) { position:absolute; top:48px; left:31px; width:12px; height:12px; background:var(--wa-red ); transform:rotate(45deg); } @media (min-width:1800px) { .weight-shell[data-v-6d3570bd] { width:min(100% - 88px,1560px); } .hero-panel h1[data-v-6d3570bd] { font-size:clamp(90px,7vw,150px); } .weight-chart[data-v-6d3570bd] { height:470px; } } @media (max-width:1199px) { .hero-grid[data-v-6d3570bd] { grid-template-columns:minmax(0,1fr) minmax(340px,.82fr); } .stat-grid[data-v-6d3570bd] { grid-template-columns:repeat(3,minmax(0,1fr)); } .analysis-grid[data-v-6d3570bd] { grid-template-columns:1fr; } .side-stack[data-v-6d3570bd] { grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:none; } } @media (max-width:991px) { .hero-grid[data-v-6d3570bd] { grid-template-columns:1fr; } .current-panel[data-v-6d3570bd] { grid-template-columns:minmax(0,1fr) 126px; } .stat-grid[data-v-6d3570bd] { grid-template-columns:repeat(2,minmax(0,1fr)); } .side-stack[data-v-6d3570bd] { grid-template-columns:1fr; } } @media (max-width:767px) { .pixel-back[data-v-6d3570bd] { margin-left:16px; } .weight-shell[data-v-6d3570bd] { width:min(100% - 32px,560px); padding-top:22px; } .hero-panel[data-v-6d3570bd],.current-panel[data-v-6d3570bd],.chart-panel[data-v-6d3570bd],.summary-panel[data-v-6d3570bd],.recent-panel[data-v-6d3570bd],.tip-panel[data-v-6d3570bd] { padding:18px; } .hero-panel h1[data-v-6d3570bd] { max-width:100%; font-size:clamp(52px,17vw,80px); line-height:.96; } .weight-form[data-v-6d3570bd] { grid-template-columns:1fr; } .weight-form button[data-v-6d3570bd] { width:100%; } .current-panel[data-v-6d3570bd] { grid-template-columns:1fr; } .pixel-bot[data-v-6d3570bd] { width:96px; height:128px; justify-self:start; } .bot-head[data-v-6d3570bd],.bot-body[data-v-6d3570bd],.bot-heart[data-v-6d3570bd],.bot-arm[data-v-6d3570bd],.bot-leg[data-v-6d3570bd] { transform:scale(.82); transform-origin:top left; } .current-number strong[data-v-6d3570bd] { font-size:clamp(60px,18vw,92px); } .heart-line[data-v-6d3570bd] { right:36px; } .stat-grid[data-v-6d3570bd] { grid-template-columns:1fr; gap:14px; } .stat-card[data-v-6d3570bd] { min-height:132px; } .section-head[data-v-6d3570bd] { display:grid; align-items:stretch; } .range-chip[data-v-6d3570bd] { width:-moz-fit-content; width:fit-content; } .weight-chart[data-v-6d3570bd] { height:300px; } .record-item[data-v-6d3570bd] { grid-template-columns:1fr; } .record-item button[data-v-6d3570bd] { width:100%; } .tip-bot[data-v-6d3570bd] { display:none; } } @media (max-width:430px) { .weight-shell[data-v-6d3570bd] { width:min(100% - 24px,430px); } .hero-desc[data-v-6d3570bd],.tip-panel p[data-v-6d3570bd] { font-size:15px; } .square-icon[data-v-6d3570bd] { width:40px; height:40px; } } .lunar-container[data-v-08bf8956] { display:flex; flex-direction:column; align-items:center; background-color:#fff; color:#333; padding:20px; border-radius:10px; box-shadow:0 0 10px rgba(0,0,0,0.1); } .lunar-header[data-v-08bf8956],.lunar-festival[data-v-08bf8956],.lunar-details[data-v-08bf8956] { margin-bottom:20px; padding:20px; border-radius:8px; background-color:#f9e7e7; box-shadow:0 2px 5px rgba(0,0,0,0.2); transition:background-color 0.3s,color 0.3s; } .lunar-header[data-v-08bf8956]:hover,.lunar-festival[data-v-08bf8956]:hover,.lunar-details[data-v-08bf8956]:hover { background-color:#f0d0d0; } .lunar-date[data-v-08bf8956],.lunar-sign[data-v-08bf8956] { display:flex; justify-content:space-between; margin-bottom:10px; } .lunar-festival h3[data-v-08bf8956],.lunar-details h3[data-v-08bf8956] { color:#8b0000; font-weight:bold; margin-bottom:15px; } .detail-grid[data-v-08bf8956] { display:grid; grid-template-columns:repeat(2,1fr); gap:15px; } .detail-item p[data-v-08bf8956] { margin:5px 0; font-size:1em; color:#555; } .lunar-image[data-v-08bf8956] { margin-top:25px; text-align:center; } .lunar-image img[data-v-08bf8956] { max-width:100%; height:auto; border-radius:15px; border:4px solid #d50000; cursor:pointer; transition:transform 0.3s,box-shadow 0.3s; } .lunar-image img[data-v-08bf8956]:hover { transform:scale(1.05); box-shadow:0 0 20px rgba(213,0,0,0.5); } .loading-container[data-v-08bf8956] { display:flex; justify-content:center; align-items:center; height:200px; background-color:#e0e0e0; border-radius:10px; animation:fadeIn-08bf8956 2s ease-in-out; } .loading-text[data-v-08bf8956] { text-align:center; font-size:1.2em; color:#616161; } @keyframes fadeIn-08bf8956 { from { opacity:0; } to { opacity:1; } } .scrapped-page[data-v-8f901b54] { --ink:#111827; --muted:#64748b; --line:rgba(15,23,42,0.12); --accent:#ef6f61; --accent-2:#0f9f9a; min-height:100vh; color:var(--ink ); background:radial-gradient(circle at 10% 4%,rgba(239,111,97,0.16),transparent 28rem),radial-gradient(circle at 90% 8%,rgba(15,159,154,0.18),transparent 30rem),linear-gradient(180deg,#fffdf8 0%,#f8fafc 44%,#eef2f7 100%); overflow-x:hidden; } .scrapped-topbar[data-v-8f901b54] { position:relative; z-index:20; display:flex; align-items:center; gap:1rem; width:min(100% - 48px,1760px); min-height:clamp(4.4rem,6vw,5.8rem); margin:0 auto; } .back-button[data-v-8f901b54] { display:inline-flex; align-items:center; justify-content:center; width:clamp(2.45rem,3.2vw,3rem); height:clamp(2.45rem,3.2vw,3rem); border:1px solid rgba(15,23,42,0.12); border-radius:999px; background:rgba(255,255,255,0.72); cursor:pointer; box-shadow:0 16px 46px rgba(15,23,42,0.08); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); transition:transform 0.22s ease,background 0.22s ease,box-shadow 0.22s ease; } .back-button span[data-v-8f901b54] { width:0.72rem; height:0.72rem; border-left:2px solid #111827; border-bottom:2px solid #111827; transform:rotate(45deg); margin-left:0.25rem; } .back-button[data-v-8f901b54]:hover { transform:translateY(-2px); background:rgba(255,255,255,0.94); box-shadow:0 22px 58px rgba(15,23,42,0.12); } .logo-mark[data-v-8f901b54] { display:block; width:clamp(10rem,12vw,13rem); height:auto; aspect-ratio:304/51; -o-object-fit:contain; object-fit:contain; } .scrapped-hero[data-v-8f901b54] { display:grid; grid-template-columns:minmax(0,1fr) minmax(22rem,0.68fr); gap:clamp(1rem,3vw,3rem); width:min(100% - 48px,1760px); min-height:clamp(360px,50vh,600px); margin:0 auto; padding:clamp(1rem,3.5vw,3.6rem) 0 clamp(1.8rem,4vw,3rem); align-items:end; } .hero-copy[data-v-8f901b54] { min-width:0; text-align:left; padding-bottom:clamp(1rem,2.4vw,2.4rem); } .eyebrow[data-v-8f901b54] { margin:0 0 1rem; color:var(--accent-2 ); font-size:clamp(0.78rem,0.8vw,0.95rem); font-weight:800; text-transform:uppercase; } .hero-copy h1[data-v-8f901b54] { max-width:24ch; margin:0; color:#111827; font-size:clamp(2.8rem,7vw,7.2rem); line-height:0.98; font-weight:900; letter-spacing:0; overflow-wrap:break-word; } .hero-copy h1 span[data-v-8f901b54] { display:block; } .hero-text[data-v-8f901b54] { max-width:46rem; margin:clamp(1.2rem,3vw,2rem) 0 0; color:#475569; font-size:clamp(1rem,1.35vw,1.3rem); line-height:1.8; overflow-wrap:break-word; } .hero-card[data-v-8f901b54] { position:relative; min-height:clamp(300px,38vw,520px); border-radius:8px; overflow:hidden; background-position:center; background-size:cover; cursor:pointer; isolation:isolate; box-shadow:0 28px 80px rgba(15,23,42,0.2); } .hero-card[data-v-8f901b54]::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,23,42,0.04) 0%,rgba(15,23,42,0.3) 42%,rgba(15,23,42,0.84) 100%),linear-gradient(120deg,rgba(239,111,97,0.24),rgba(15,159,154,0.08)); z-index:-1; } .hero-card-content[data-v-8f901b54] { position:absolute; left:clamp(1rem,3vw,2rem); right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem); text-align:left; color:#fff; } .status-pill[data-v-8f901b54],.feature-tile span[data-v-8f901b54],.card-meta span[data-v-8f901b54] { display:inline-flex; align-items:center; width:-moz-fit-content; width:fit-content; min-height:1.7rem; padding:0 0.7rem; border-radius:999px; background:rgba(255,255,255,0.18); color:rgba(255,255,255,0.88); font-size:0.78rem; font-weight:800; } .hero-card h2[data-v-8f901b54] { margin:0.7rem 0 0.4rem; font-size:clamp(2rem,4vw,4.4rem); line-height:1; letter-spacing:0; } .hero-card p[data-v-8f901b54] { max-width:28rem; margin:0; color:rgba(255,255,255,0.78); font-size:clamp(0.95rem,1vw,1.1rem); line-height:1.7; } .scrapped-shell[data-v-8f901b54] { width:min(100% - 48px,1760px); margin:0 auto; padding:0 0 clamp(3rem,5vw,5.6rem); } .toolbar[data-v-8f901b54] { position:sticky; top:0; z-index:30; display:grid; grid-template-columns:minmax(16rem,25rem) minmax(0,1fr); gap:1rem; align-items:center; padding:0.85rem 0; background:rgba(248,250,252,0.76); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .search-box[data-v-8f901b54] { display:flex; align-items:center; gap:0.65rem; height:3.1rem; padding:0 1rem; border:1px solid rgba(15,23,42,0.12); border-radius:999px; background:rgba(255,255,255,0.78); box-shadow:0 14px 40px rgba(15,23,42,0.06); } .search-icon[data-v-8f901b54] { width:0.88rem; height:0.88rem; border:2px solid #334155; border-radius:50%; position:relative; flex:0 0 auto; } .search-icon[data-v-8f901b54]::after { content:""; position:absolute; right:-0.42rem; bottom:-0.34rem; width:0.48rem; height:2px; border-radius:999px; background:#334155; transform:rotate(45deg); } .search-box input[data-v-8f901b54] { width:100%; min-width:0; border:0; outline:none; background:transparent; color:var(--ink ); font-size:1rem; } .category-tabs[data-v-8f901b54] { display:flex; gap:0.55rem; justify-content:flex-end; overflow-x:auto; padding:0.2rem; scrollbar-width:none; } .category-tabs[data-v-8f901b54]::-webkit-scrollbar { display:none; } .category-tab[data-v-8f901b54] { flex:0 0 auto; min-height:2.6rem; padding:0 1rem; border:1px solid transparent; border-radius:999px; background:transparent; color:#475569; font-size:0.95rem; font-weight:800; cursor:pointer; transition:color 0.2s ease,background 0.2s ease,border-color 0.2s ease; } .category-tab[data-v-8f901b54]:hover,.category-tab.active[data-v-8f901b54] { border-color:rgba(15,23,42,0.12); background:#111827; color:#fff; } .featured-row[data-v-8f901b54] { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:1rem; margin:1rem 0 clamp(1.5rem,3vw,2.5rem); } .feature-tile[data-v-8f901b54] { position:relative; display:flex; min-height:12rem; padding:1rem; border-radius:8px; overflow:hidden; flex-direction:column; justify-content:space-between; text-align:left; background-position:center; background-size:cover; cursor:pointer; isolation:isolate; box-shadow:0 18px 48px rgba(15,23,42,0.12); transition:transform 0.24s ease,box-shadow 0.24s ease; } .feature-tile[data-v-8f901b54]::before { content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(15,23,42,0.08) 0%,rgba(15,23,42,0.72) 100%); z-index:-1; } .feature-tile[data-v-8f901b54]:hover,.scrap-card[data-v-8f901b54]:hover { transform:translateY(-5px); box-shadow:0 28px 70px rgba(15,23,42,0.18); } .feature-tile strong[data-v-8f901b54] { color:#fff; font-size:clamp(1.25rem,1.6vw,1.85rem); line-height:1.18; } .scrap-grid[data-v-8f901b54] { display:grid; grid-template-columns:repeat(auto-fit,minmax(17rem,1fr)); gap:clamp(0.9rem,1.5vw,1.35rem); } .scrap-card[data-v-8f901b54] { display:grid; grid-template-rows:minmax(10.5rem,0.82fr) auto; min-height:22rem; border:1px solid rgba(15,23,42,0.1); border-radius:8px; overflow:hidden; background:rgba(255,255,255,0.74); text-align:left; cursor:pointer; box-shadow:0 14px 40px rgba(15,23,42,0.08); transition:transform 0.24s ease,box-shadow 0.24s ease,border-color 0.24s ease; } .scrap-card[data-v-8f901b54]:hover { border-color:rgba(239,111,97,0.34); } .card-cover[data-v-8f901b54] { min-height:10.5rem; background-position:center; background-size:cover; } .card-body[data-v-8f901b54] { display:flex; min-height:10rem; padding:1rem; flex-direction:column; justify-content:flex-start; } .card-meta[data-v-8f901b54] { display:flex; flex-wrap:wrap; gap:0.45rem; } .card-meta span[data-v-8f901b54] { background:rgba(15,159,154,0.1); color:#0f766e; } .card-meta span[data-v-8f901b54]:last-child { background:rgba(239,111,97,0.11); color:#c2410c; } .card-body h2[data-v-8f901b54] { margin:0.9rem 0 0.45rem; color:var(--ink ); font-size:clamp(1.18rem,1.15vw,1.55rem); line-height:1.22; letter-spacing:0; } .card-body p[data-v-8f901b54] { margin:0; color:var(--muted ); font-size:0.95rem; line-height:1.7; } .empty-state[data-v-8f901b54] { min-height:16rem; border:1px dashed rgba(15,23,42,0.22); border-radius:8px; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:0.5rem; color:var(--muted ); background:rgba(255,255,255,0.55); } .empty-state strong[data-v-8f901b54] { color:var(--ink ); font-size:1.25rem; } @media (min-width:1440px) { .scrap-grid[data-v-8f901b54] { grid-template-columns:repeat(auto-fit,minmax(20rem,1fr)); } .feature-tile[data-v-8f901b54] { min-height:15rem; } .scrap-card[data-v-8f901b54] { min-height:25rem; } } @media (max-width:1199px) { .scrapped-hero[data-v-8f901b54] { grid-template-columns:1fr; min-height:auto; align-items:stretch; } .hero-copy h1[data-v-8f901b54] { max-width:24ch; } .hero-card[data-v-8f901b54] { min-height:23rem; } .featured-row[data-v-8f901b54] { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:767px) { .scrapped-page[data-v-8f901b54] { background:radial-gradient(circle at 18% 4%,rgba(239,111,97,0.16),transparent 18rem),linear-gradient(180deg,#fffdf8 0%,#f8fafc 46%,#edf2f7 100%); } .scrapped-topbar[data-v-8f901b54],.scrapped-hero[data-v-8f901b54],.scrapped-shell[data-v-8f901b54] { width:min(100% - 28px,1760px); max-width:calc(100vw - 28px); } .scrapped-topbar[data-v-8f901b54] { min-height:4.2rem; } .logo-mark[data-v-8f901b54] { width:9.2rem; } .scrapped-hero[data-v-8f901b54] { padding-top:1.2rem; gap:1.2rem; } .hero-copy h1[data-v-8f901b54] { max-width:100%; width:100%; font-size:clamp(2rem,9.5vw,2.8rem); line-height:1.08; overflow-wrap:break-word; } .hero-text[data-v-8f901b54] { max-width:calc(100vw - 28px); font-size:1rem; line-height:1.7; overflow-wrap:break-word; } .hero-card[data-v-8f901b54] { min-height:19rem; } .toolbar[data-v-8f901b54] { grid-template-columns:1fr; gap:0.65rem; padding:0.7rem 0; } .category-tabs[data-v-8f901b54] { justify-content:flex-start; margin:0 -14px; padding:0 14px 0.2rem; } .featured-row[data-v-8f901b54] { grid-template-columns:1fr; } .feature-tile[data-v-8f901b54] { min-height:11rem; } .scrap-grid[data-v-8f901b54] { grid-template-columns:1fr; } .scrap-card[data-v-8f901b54] { min-height:auto; grid-template-columns:8rem minmax(0,1fr); grid-template-rows:auto; } .card-cover[data-v-8f901b54] { min-height:100%; } .card-body[data-v-8f901b54] { min-height:9.2rem; padding:0.9rem; } } @media (max-width:575px) { .scrapped-topbar[data-v-8f901b54],.scrapped-hero[data-v-8f901b54],.scrapped-shell[data-v-8f901b54] { width:min(100% - 20px,1760px); } .hero-card[data-v-8f901b54] { min-height:18rem; } .scrap-card[data-v-8f901b54] { grid-template-columns:6.8rem minmax(0,1fr); } .card-body h2[data-v-8f901b54] { font-size:1.05rem; } .card-body p[data-v-8f901b54] { font-size:0.86rem; line-height:1.55; } } .scrapped-page[data-v-8f901b54] { --ink:#1A1A1D; --muted:rgba(26,26,29,.68); --line:#1A1A1D; --accent:#E72D48; --accent-2:#2FA84F; color:#1A1A1D; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,0.12) 2px,transparent 2.2px) 0 0/28px 28px,linear-gradient(135deg,rgba(255,249,247,.66),transparent 42%),#F1DDDF; } .scrapped-topbar[data-v-8f901b54],.scrapped-hero[data-v-8f901b54],.scrapped-shell[data-v-8f901b54] { width:min(100% - 48px,1440px); } .back-button[data-v-8f901b54],.category-tab[data-v-8f901b54] { border:3px solid #1A1A1D !important; background:#FFF9F7 !important; color:#1A1A1D !important; box-shadow:5px 5px 0 #1A1A1D !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; font-weight:900; } .back-button[data-v-8f901b54]:hover,.category-tab[data-v-8f901b54]:hover,.feature-tile[data-v-8f901b54]:hover,.scrap-card[data-v-8f901b54]:hover { transform:translate(-2px,-2px); box-shadow:8px 8px 0 #1A1A1D !important; } .category-tab.active[data-v-8f901b54] { background:#E72D48 !important; color:#FFF9F7 !important; } .logo-mark[data-v-8f901b54] { padding:8px 12px; border:3px solid #1A1A1D; border-radius:18px; background:#FFF9F7; box-shadow:6px 6px 0 #E72D48; } .hero-copy[data-v-8f901b54],.hero-card[data-v-8f901b54],.search-box[data-v-8f901b54],.feature-tile[data-v-8f901b54],.scrap-card[data-v-8f901b54],.empty-state[data-v-8f901b54] { border:3px solid #1A1A1D !important; border-radius:22px !important; background-color:#FFF9F7 !important; box-shadow:8px 8px 0 #E72D48 !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important; } .hero-copy[data-v-8f901b54] { padding:clamp(24px,4vw,52px); } .eyebrow[data-v-8f901b54],.status-pill[data-v-8f901b54],.feature-tile span[data-v-8f901b54],.card-meta span[data-v-8f901b54] { display:inline-flex; width:-moz-max-content; width:max-content; max-width:100%; padding:6px 10px; border:3px solid #1A1A1D; border-radius:999px; background:#E72D48 !important; color:#FFF9F7 !important; font-weight:900; letter-spacing:0; text-transform:none; } .hero-copy h1[data-v-8f901b54],.hero-card h2[data-v-8f901b54],.card-body h2[data-v-8f901b54] { color:#1A1A1D; letter-spacing:-0.05em; } .hero-text[data-v-8f901b54],.hero-card p[data-v-8f901b54],.card-body p[data-v-8f901b54] { color:rgba(26,26,29,.72) !important; } .hero-card[data-v-8f901b54] { overflow:hidden; box-shadow:8px 8px 0 #1A1A1D !important; } .hero-card[data-v-8f901b54]::before,.feature-tile[data-v-8f901b54]::before { background:linear-gradient(180deg,rgba(255,249,247,.15),rgba(26,26,29,.34)) !important; } .search-box[data-v-8f901b54] { display:flex; align-items:center; gap:10px; padding:0 14px; box-shadow:5px 5px 0 #1A1A1D !important; } .search-box input[data-v-8f901b54] { min-width:0; color:#1A1A1D !important; background:transparent !important; font-weight:800; } .search-box[data-v-8f901b54]:focus-within { transform:translate(-2px,-2px); box-shadow:8px 8px 0 #E72D48 !important; } .featured-row[data-v-8f901b54] { gap:18px; } .feature-tile[data-v-8f901b54] { color:#FFF9F7; background-size:cover; transition:transform .18s ease,box-shadow .18s ease; } .feature-tile strong[data-v-8f901b54] { text-shadow:2px 2px 0 #1A1A1D; } .scrap-grid[data-v-8f901b54] { grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; } .scrap-card[data-v-8f901b54] { overflow:hidden; transition:transform .18s ease,box-shadow .18s ease; } .card-cover[data-v-8f901b54] { filter:saturate(1.08) contrast(1.02); } @media (max-width:1199px) { .scrapped-hero[data-v-8f901b54] { grid-template-columns:1fr; } } @media (max-width:767px) { .scrapped-topbar[data-v-8f901b54],.scrapped-hero[data-v-8f901b54],.scrapped-shell[data-v-8f901b54] { width:min(100% - 28px,1440px); } .hero-copy[data-v-8f901b54],.hero-card[data-v-8f901b54],.search-box[data-v-8f901b54],.feature-tile[data-v-8f901b54],.scrap-card[data-v-8f901b54] { border-width:2px !important; border-radius:18px !important; box-shadow:5px 5px 0 #E72D48 !important; } .toolbar[data-v-8f901b54] { grid-template-columns:1fr; align-items:stretch; gap:12px; } .category-tabs[data-v-8f901b54] { display:flex; overflow-x:auto; padding-bottom:8px; scrollbar-width:none; } .category-tabs[data-v-8f901b54]::-webkit-scrollbar { display:none; } .category-tab[data-v-8f901b54] { flex:0 0 auto; border-width:2px !important; box-shadow:3px 3px 0 #1A1A1D !important; } .scrap-card[data-v-8f901b54] { grid-template-columns:92px minmax(0,1fr); box-shadow:4px 4px 0 #1A1A1D !important; } .card-body[data-v-8f901b54] { min-width:0; } .card-body p[data-v-8f901b54] { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; } } @media (max-width:480px) { .scrapped-topbar[data-v-8f901b54],.scrapped-hero[data-v-8f901b54],.scrapped-shell[data-v-8f901b54] { width:min(100% - 20px,1440px); } .scrap-card[data-v-8f901b54] { grid-template-columns:1fr; } .card-cover[data-v-8f901b54] { min-height:120px; } } .container[data-v-637c625f] { font-family:"Arial",sans-serif; padding:20px; margin:0 auto; } .title[data-v-637c625f] { text-align:center; font-size:28px; color:#333; margin-bottom:20px; } .table-container[data-v-637c625f] { width:100%; overflow-x:auto; margin-bottom:20px; border-radius:8px; box-shadow:0 4px 10px rgba(0,0,0,0.1); padding:10px; background-color:#fff; } table[data-v-637c625f] { width:100%; border-collapse:collapse; margin-bottom:10px; } th[data-v-637c625f],td[data-v-637c625f] { padding:5px; text-align:center; border:1px solid #ddd; background-color:#fafafa; word-wrap:break-word; } th[data-v-637c625f] { background-color:#f2f2f2; color:#555; } .table-container td[data-v-637c625f]:last-child { width:100px; text-align:center; } textarea[data-v-637c625f],.column-input[data-v-637c625f] { width:95%; padding:8px; height:40px; border:1px solid #ddd; border-radius:4px; box-sizing:border-box; font-size:14px; transition:border-color 0.3s ease; resize:none; } textarea[data-v-637c625f]:focus,.column-input[data-v-637c625f]:focus { border-color:#4CAF50; outline:none; } .column-buttons[data-v-637c625f] { display:flex; justify-content:center; gap:12px; margin-top:10px; } button.column-remove-button[data-v-637c625f] { padding:8px 16px; background-color:#f44336; color:white; border:none; border-radius:10px; font-size:16px; cursor:pointer; transition: 0.3s ease-in-out; box-shadow:0 4px 8px rgba(0,0,0,0.2); } button.column-remove-button[data-v-637c625f]:hover { background-color:#d32f2f; transform:translateY(-2px); box-shadow:0 6px 12px rgba(0,0,0,0.3); } button.column-remove-button[data-v-637c625f]:active { background-color:#f44336; transform:translateY(0); box-shadow:0 4px 8px rgba(0,0,0,0.2); } button.column-insert-button[data-v-637c625f] { padding:8px 16px; background-color:#35b461; color:white; border:none; border-radius:10px; font-size:16px; cursor:pointer; transition: 0.3s ease-in-out; box-shadow:0 4px 8px rgba(0,0,0,0.2); } button.column-insert-button[data-v-637c625f]:hover { background-color:#2a9e4f; transform:translateY(-2px); box-shadow:0 6px 12px rgba(0,0,0,0.3); } button.column-insert-button[data-v-637c625f]:active { background-color:#35b461; transform:translateY(0); box-shadow:0 4px 8px rgba(0,0,0,0.2); } button.action-button[data-v-637c625f] { padding:12px 20px; background-color:#4CAF50; color:white; border:none; border-radius:10px; font-size:16px; cursor:pointer; box-shadow:0 4px 8px rgba(0,0,0,0.1); transition: 0.3s ease-in-out; } button.action-button[data-v-637c625f]:hover { background-color:#2ab40b; transform:translateY(-2px); box-shadow:0 6px 12px rgba(0,0,0,0.2); } button.action-button[data-v-637c625f]:active { background-color:#2ab40b; transform:translateY(0); box-shadow:0 4px 8px rgba(0,0,0,0.2); } .actions[data-v-637c625f] { text-align:center; margin-top:20px; display:flex; flex-direction:column; align-items:center; } .preview-container[data-v-637c625f] { text-align:left; font-family:"Arial",sans-serif; padding:20px; border:1px solid #ccc; border-radius:8px; box-shadow:0 2px 10px rgba(0,0,0,0.1); background-color:#fff; overflow-x:auto; } .preview-row[data-v-637c625f] { min-height:30px; height:auto; display:table-row; border-bottom:1px solid #ddd; } .preview-cell[data-v-637c625f] { height:30px; display:table-cell; padding:8px 12px; border-bottom:1px solid rgba(134,134,134,0.5); border-right:1px solid rgba(134,134,134,0.5); font-size:14px; color:#333; text-align:center; min-width:120px; word-wrap:break-word; box-sizing:border-box; width:auto; white-space:pre-wrap; word-break:break-word; } .preview-row.header .preview-cell[data-v-637c625f] { font-weight:bold; background-color:#f4f4f4; color:#000; border-top:2px solid #aaa; } .preview-cell[data-v-637c625f]:first-child { border-left:1px solid rgba(134,134,134,0.5); } .preview-row[data-v-637c625f]:hover { background-color:#f9f9f9; } .preview-cell.empty[data-v-637c625f] { color:#888; } .preview-cell[data-v-637c625f]:nth-child(even) { background-color:#f9f9f9; } .preview-cell[data-v-637c625f]:nth-child(odd) { background-color:#fff; } .preview-row.header .preview-cell[data-v-637c625f]:nth-child(odd) { background-color:#e9e9e9; } .glass-redirect-v3[data-v-3ff9d7ec] { min-height:100vh; width:100%; background:#ffffff; display:flex; align-items:center; justify-content:center; overflow-x:hidden; overflow-y:auto; position:relative; font-family:"Inter",-apple-system,"BlinkMacSystemFont","PingFang SC",sans-serif; } .mesh-gradient[data-v-3ff9d7ec] { position:absolute; inset:-10%; z-index:1; } .noise-overlay[data-v-3ff9d7ec] { position:absolute; inset:0; background-image:url("data:image/svg+xml,%3Csvg viewBox=%270 0 200 200%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cfilter id=%27noiseFilter%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%270.65%27 numOctaves=%273%27 stitchTiles=%27stitch%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url%28%23noiseFilter%29%27/%3E%3C/svg%3E"); opacity:0.04; pointer-events:none; } .color-blob[data-v-3ff9d7ec] { position:absolute; border-radius:50%; filter:blur(80px); animation:floatAround-3ff9d7ec 15s infinite alternate ease-in-out; mix-blend-mode:multiply; } .blob-blue[data-v-3ff9d7ec] { width:60vw; height:60vw; background:#e0e7ff; top:-10%; left:-5%; } .blob-purple[data-v-3ff9d7ec] { width:50vw; height:50vw; background:#f5f3ff; bottom:-10%; right:-5%; animation-delay:-3s; } .blob-pink[data-v-3ff9d7ec] { width:45vw; height:45vw; background:#fff1f2; top:20%; left:20%; animation-delay:-6s; } .card-container[data-v-3ff9d7ec] { position:relative; z-index:10; width:90%; max-width:575px; animation:floatCard-3ff9d7ec 6s ease-in-out infinite; } .glass-card[data-v-3ff9d7ec] { position:relative; background:rgba(255,255,255,0.5); backdrop-filter:blur(40px) saturate(200%); -webkit-backdrop-filter:blur(40px) saturate(200%); border-radius:40px; padding:60px 45px; border:1px solid rgba(255,255,255,0.7); box-shadow:0 4px 24px -1px rgba(0,0,0,0.02),0 40px 64px -12px rgba(0,0,0,0.06); text-align:center; overflow:hidden; } .border-beam[data-v-3ff9d7ec] { position:absolute; inset:0; border-radius:inherit; padding:1px; background:linear-gradient(135deg,transparent 40%,rgba(255,255,255,0.8) 50%,transparent 60%); background-size:300% 300%; -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0); -webkit-mask-composite:xor; mask-composite:exclude; animation:beamMove-3ff9d7ec 8s linear infinite; } .brand-area[data-v-3ff9d7ec] { position:relative; margin-bottom:40px; display:inline-block; } .logo-img[data-v-3ff9d7ec] { width:304px; height:auto; opacity:0.9; filter:drop-shadow(0 8px 16px rgba(0,0,0,0.05)); } .text-area[data-v-3ff9d7ec] { margin-bottom:45px; } .primary-text[data-v-3ff9d7ec] { font-size:26px; font-weight:700; color:#121212; letter-spacing:0; margin-bottom:16px; } .text-divider[data-v-3ff9d7ec] { width:40px; height:2px; background:#eee; margin:0 auto 16px; border-radius:1px; } .secondary-text[data-v-3ff9d7ec] { font-size:15px; color:#666; line-height:1.7; font-weight:400; max-width:320px; margin:0 auto; } .prime-btn[data-v-3ff9d7ec] { position:relative; width:100%; padding:18px; background:#111; border:none; border-radius:20px; color:#fff; font-size:16px; font-weight:600; cursor:pointer; transition: 0.4s cubic-bezier(0.16,1,0.3,1); box-shadow:0 10px 20px rgba(0,0,0,0.1); } .prime-btn[data-v-3ff9d7ec]:hover { transform:translateY(-4px) scale(1.01); background:#000; box-shadow:0 20px 40px rgba(0,0,0,0.15); } .status-indicator[data-v-3ff9d7ec] { margin-top:30px; font-size:12px; color:#999; letter-spacing:0.5px; display:flex; align-items:center; justify-content:center; gap:10px; } .live-dot[data-v-3ff9d7ec] { position:relative; width:8px; height:8px; } .dot-core[data-v-3ff9d7ec] { display:block; width:100%; height:100%; background:#34c759; border-radius:50%; } .dot-halo[data-v-3ff9d7ec] { position:absolute; inset:0; background:#34c759; border-radius:50%; animation:pulse-3ff9d7ec 2s infinite; } @keyframes beamMove-3ff9d7ec { 0% { background-position:0% 0%; } 100% { background-position:100% 100%; } } @keyframes floatAround-3ff9d7ec { 0% { transform:translate(0,0) scale(1); } 100% { transform:translate(50px,40px) scale(1.05); } } @keyframes floatCard-3ff9d7ec { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-12px); } } @keyframes pulse-3ff9d7ec { 0% { transform:scale(1); opacity:0.6; } 100% { transform:scale(3); opacity:0; } } @keyframes shimmer-3ff9d7ec { 0% { left:-150%; } 25%,100% { left:150%; } } @media (max-width:575px) { .glass-card[data-v-3ff9d7ec] { padding:45px 25px; border-radius:32px; } .logo-img[data-v-3ff9d7ec] { width:260px; } .primary-text[data-v-3ff9d7ec] { font-size:21px; } } .color-picker-container[data-v-3e9b8454] { min-height:100vh; display:flex; overflow-x:hidden; overflow-y:auto; } .main-content[data-v-3e9b8454] { flex:1; display:flex; align-items:center; justify-content:center; transition:background-color 0.6s ease,padding 0.5s cubic-bezier(0.4,0,0.2,1); } .main-content.sidebar-active[data-v-3e9b8454] { padding-right:320px; } .color-info[data-v-3e9b8454] { text-align:center; mix-blend-mode:difference; color:white; } .chinese-title[data-v-3e9b8454] { display:block; font-size:clamp(3rem,10vw,6rem); font-weight:900; letter-spacing:0.5em; margin-left:0.5em; } .hex-subtitle[data-v-3e9b8454] { font-size:1.5rem; font-family:monospace; opacity:0.7; } .color-sidebar[data-v-3e9b8454] { position:fixed; right:0; top:0; width:320px; height:100%; background:rgba(255,255,255,0.85); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); box-shadow:-5px 0 25px rgba(0,0,0,0.1); z-index:100; transition:transform 0.5s cubic-bezier(0.4,0,0.2,1); } .color-sidebar[data-v-3e9b8454]:not(.expanded) { transform:translateX(100%); } .hinge-button[data-v-3e9b8454] { position:absolute; left:-32px; top:50%; transform:translateY(-50%); width:32px; height:80px; background:inherit; -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); border-radius:12px 0 0 12px; border:1px solid rgba(0,0,0,0.05); border-right:none; cursor:pointer; display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:-4px 0 10px rgba(0,0,0,0.05); } .hinge-line[data-v-3e9b8454] { width:2px; height:30px; background:rgba(0,0,0,0.1); border-radius:1px; } .hinge-icon[data-v-3e9b8454] { font-size:20px; color:#666; margin-top:4px; } .sidebar-content[data-v-3e9b8454] { height:100%; display:flex; flex-direction:column; padding:20px; } .sidebar-header h4[data-v-3e9b8454] { margin:0 0 15px 0; font-size:1.1rem; color:#333; } .color-dense-grid[data-v-3e9b8454] { flex:1; overflow-y:auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(50px,1fr)); gap:6px; padding-right:5px; } .color-item[data-v-3e9b8454] { aspect-ratio:1; border-radius:6px; cursor:pointer; position:relative; transition:transform 0.2s,box-shadow 0.2s; } .color-item[data-v-3e9b8454]:hover { transform:scale(1.15); z-index:2; box-shadow:0 4px 12px rgba(0,0,0,0.15); } .color-item.active[data-v-3e9b8454] { box-shadow:inset 0 0 0 2px #333,0 0 0 2px white; z-index:1; } .item-overlay[data-v-3e9b8454] { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity 0.2s; } .color-item:hover .item-overlay[data-v-3e9b8454] { opacity:1; } .item-name[data-v-3e9b8454] { font-size:10px; color:var(--text-color ); text-align:center; line-height:1.1; font-weight:bold; padding:2px; } @media (max-width:768px) { .main-content.sidebar-active[data-v-3e9b8454] { padding-right:0; } .color-sidebar[data-v-3e9b8454] { width:85%; } .chinese-title[data-v-3e9b8454] { font-size:3rem; writing-mode:vertical-rl; letter-spacing:0.2em; } .hinge-button[data-v-3e9b8454] { width:40px; height:100px; left:-40px; } .color-dense-grid[data-v-3e9b8454] { grid-template-columns:repeat(5,1fr); } } @media (max-width:767px) { .color-sidebar[data-v-3e9b8454] { overflow-y:auto; max-height:90vh; } } .color-dense-grid[data-v-3e9b8454]::-webkit-scrollbar { width:4px; } .color-dense-grid[data-v-3e9b8454]::-webkit-scrollbar-thumb { background:rgba(0,0,0,0.1); border-radius:10px; } .cert_container[data-v-7e9def62] { background-color:#f4f4f9; padding:40px; margin-left:1%; display:flex; height:90vh; flex-direction:column; align-items:center; border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,0.15); } .title[data-v-7e9def62] { text-align:center; font-size:40px; font-weight:700; color:#333; margin-bottom:50px; font-family:"Georgia",serif; } .certificate-info[data-v-7e9def62] { display:flex; flex-direction:row; align-items:flex-start; justify-content:flex-start; max-width:1000px; margin:0 auto; background:linear-gradient(to bottom right,#fff,#f0f8ff); padding:30px; border-radius:12px; box-shadow:0 6px 18px rgba(0,0,0,0.15); } .image-container[data-v-7e9def62] { margin-right:30px; } .certificate-image[data-v-7e9def62] { height:240px; border-radius:8px; -o-object-fit:cover; object-fit:cover; } .info-table[data-v-7e9def62] { width:100%; border-collapse:collapse; margin-left:20px; font-family:"Arial",sans-serif; } .info-table td[data-v-7e9def62] { padding:18px; font-size:20px; line-height:1.8; } .info-table td[data-v-7e9def62]:first-child { width:120px; font-weight:600; color:#555; } .info-content[data-v-7e9def62] { font-weight:500; color:#333; } .table-wrap[data-v-7e9def62] { overflow-x:auto; -webkit-overflow-scrolling:touch; } @media screen and (max-width:768px) { .certificate-info[data-v-7e9def62] { flex-direction:column; align-items:center; text-align:center; max-width:100%; padding:20px; } .image-container[data-v-7e9def62] { margin-right:0; margin-bottom:20px; } .info-table td[data-v-7e9def62] { font-size:18px; } .info-table td[data-v-7e9def62]:first-child { width:auto; } } .err-log-page[data-v-2a2c8cc3] { min-height:100vh; color:var(--color-text ); background:var(--color-bg ); } .err-log-shell[data-v-2a2c8cc3] { padding:clamp(64px,8vw,96px) 0 56px; } .err-log-hero[data-v-2a2c8cc3] { margin-bottom:18px; } .eyebrow[data-v-2a2c8cc3] { display:inline-flex; margin-bottom:10px; padding:6px 10px; border:1px solid var(--color-border ); border-radius:999px; background:var(--gradient-soft ); color:var(--color-primary ); font-size:12px; font-weight:900; } .err-log-hero h1[data-v-2a2c8cc3] { margin:0 0 8px; color:var(--color-text ); font-size:clamp(34px,5vw,64px); line-height:1.08; } .err-log-hero p[data-v-2a2c8cc3] { max-width:680px; margin:0; color:var(--color-text-soft ); line-height:1.75; } .log-table-card[data-v-2a2c8cc3] { padding:14px; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); box-shadow:0 18px 48px var(--color-shadow ); } table[data-v-2a2c8cc3] { width:100%; min-width:960px; border-collapse:collapse; } th[data-v-2a2c8cc3],td[data-v-2a2c8cc3] { padding:10px 12px; border-bottom:1px solid var(--color-border ); color:var(--color-text ); text-align:left; vertical-align:top; } th[data-v-2a2c8cc3] { background:var(--color-bg-soft ); color:var(--color-primary ); font-size:12px; white-space:nowrap; } td[data-v-2a2c8cc3] { max-width:220px; overflow-wrap:break-word; } .btn-expand[data-v-2a2c8cc3],.btn-load-more[data-v-2a2c8cc3] { min-height:38px; padding:0 14px; border:0; border-radius:8px; background:var(--color-button ); color:var(--color-button-text ); font-weight:900; } .load-more-container[data-v-2a2c8cc3] { margin-top:18px; text-align:center; } .btn-load-more[data-v-2a2c8cc3]:disabled { cursor:not-allowed; opacity:0.55; } .modal[data-v-2a2c8cc3] { position:fixed; inset:0; z-index:1000; display:grid; place-items:center; padding:20px; background:rgba(0,0,0,0.5); } .modal-content[data-v-2a2c8cc3] { position:relative; width:min(100%,1200px); max-height:80vh; padding:20px; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); box-shadow:0 24px 70px var(--color-shadow ); overflow-y:auto; } .modal-content pre[data-v-2a2c8cc3] { margin:0; color:var(--color-text ); white-space:pre-wrap; word-break:normal; overflow-wrap:break-word; } .close-btn[data-v-2a2c8cc3] { position:sticky; top:0; float:right; width:34px; min-height:34px; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-bg-soft ); color:var(--color-text ); font-size:22px; line-height:1; } @media (max-width:767px) { .err-log-shell[data-v-2a2c8cc3] { padding-top:58px; } table[data-v-2a2c8cc3] { min-width:760px; font-size:12px; } td[data-v-2a2c8cc3]:nth-child(5),td[data-v-2a2c8cc3]:nth-child(6),td[data-v-2a2c8cc3]:nth-child(8) { display:none; } } @media (max-width:575px) { .log-table-card[data-v-2a2c8cc3] { padding:10px; } table[data-v-2a2c8cc3] { font-size:11px; } } .feedback-container[data-v-2970edbb] { padding:20px; background:linear-gradient(135deg,#f5f7fa,#e0eaf2); border-radius:8px; } h2[data-v-2970edbb] { font-size:28px; margin-bottom:20px; color:#2a2a2a; text-align:center; font-family:"Arial",sans-serif; text-transform:uppercase; letter-spacing:2px; } .feedback-list[data-v-2970edbb] { display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px; } .feedback-item[data-v-2970edbb] { background:#ffffff; padding:16px; border-radius:12px; box-shadow:0 6px 12px rgba(0,0,0,0.1); transition:transform 0.2s ease-in-out,box-shadow 0.3s ease; cursor:pointer; border-left:5px solid #00aaff; } .feedback-item[data-v-2970edbb]:hover { transform:translateY(-5px); box-shadow:0 12px 24px rgba(0,0,0,0.2); } .feedback-header[data-v-2970edbb] { font-size:16px; font-weight:bold; color:#333; margin-bottom:10px; } .feedback-date[data-v-2970edbb] { font-size:14px; color:#888; } .feedback-body[data-v-2970edbb] { margin-bottom:15px; } .feedback-text[data-v-2970edbb] { color:#555; font-size:14px; line-height:1.4; } .feedback-footer[data-v-2970edbb] { font-size:14px; color:#888; display:flex; align-items:center; } .status-circle[data-v-2970edbb] { width:10px; height:10px; margin-right:5px; border-radius:50%; background-color:#6c757d; } .status-gray[data-v-2970edbb] { background-color:#6c757d; } .status-blue[data-v-2970edbb] { background-color:#007bff; } .status-green[data-v-2970edbb] { background-color:#28a745; } .status-unknown[data-v-2970edbb] { background-color:#ffc107; } .modal-overlay[data-v-2970edbb] { position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.5); display:flex; justify-content:center; align-items:center; z-index:9999; } .modal-content[data-v-2970edbb] { background:#fff; border-radius:12px; padding:30px; width:90%; max-width:575px; position:relative; box-shadow:0 12px 30px rgba(0,0,0,0.2); transition: 0.3s ease; } .modal-content[data-v-2970edbb]:hover { box-shadow:0 16px 50px rgba(0,0,0,0.3); } .modal-close-btn[data-v-2970edbb] { position:absolute; top:10px; right:10px; font-size:24px; background:none; border:none; color:#999; cursor:pointer; } .modal-close-btn[data-v-2970edbb]:hover { color:#ff4081; } .modal-title[data-v-2970edbb] { font-size:24px; font-weight:600; color:#333; margin-bottom:20px; text-align:center; letter-spacing:1px; } .modal-body[data-v-2970edbb] { font-size:16px; color:#555; } .form-group[data-v-2970edbb] { margin-bottom:20px; } .form-row[data-v-2970edbb] { display:flex; justify-content:space-between; align-items:center; margin-bottom:15px; } .form-field[data-v-2970edbb] { width:48%; } .form-label[data-v-2970edbb] { font-size:16px; color:#444; width:30%; text-align:right; } .form-input[data-v-2970edbb] { width:100%; padding:10px; border:1px solid #ddd; border-radius:8px; font-size:14px; transition:border-color 0.3s ease; } .form-input[data-v-2970edbb]:focus { border-color:#ff4081; outline:none; } .form-textarea[data-v-2970edbb] { width:100%; padding:12px; border:1px solid #ddd; border-radius:8px; font-size:14px; resize:vertical; min-height:120px; transition:border-color 0.3s ease; } .form-textarea[data-v-2970edbb]:focus { border-color:#ff4081; outline:none; } .upload-section[data-v-2970edbb] { display:flex; justify-content:flex-start; align-items:center; gap:12px; } .upload-btn[data-v-2970edbb] { background:#007bff; color:white; padding:8px 14px; border:none; border-radius:5px; font-size:14px; cursor:pointer; } .upload-btn[data-v-2970edbb]:hover { background:#0056b3; } .upload-btn[data-v-2970edbb]:focus { outline:none; } .submit-btn[data-v-2970edbb] { width:100%; padding:12px; background-color:#28a745; color:white; border:none; border-radius:8px; cursor:pointer; font-size:16px; transition:background-color 0.3s ease; } .submit-btn[data-v-2970edbb]:hover { background-color:#218838; } .floating-btn[data-v-2970edbb] { position:fixed; bottom:30px; right:30px; width:60px; height:60px; background-color:#ff4081; color:white; border-radius:50%; font-size:30px; box-shadow:0 6px 15px rgba(0,0,0,0.1); border:none; cursor:pointer; z-index:10000; transition:background-color 0.3s ease; } .floating-btn[data-v-2970edbb]:hover { background-color:#ff2a68; } .load-more[data-v-2970edbb] { text-align:center; margin-top:20px; } .btn-load-more[data-v-2970edbb] { padding:10px 20px; background-color:#ff5722; color:white; border:none; border-radius:8px; cursor:pointer; } .btn-load-more[data-v-2970edbb]:hover { background-color:#e64a19; } .feedback-container[data-v-2970edbb] { --pink-bg:#F1DDDF; --cream:#FFF9F7; --ink:#1A1A1D; --red:#E72D48; --green:#2FA84F; min-height:100vh; padding:clamp(16px,3vw,42px) !important; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.14) 2px,transparent 2.5px) 0 0/26px 26px,var(--pink-bg ) !important; border-radius:0 !important; color:var(--ink ); overflow-x:hidden; } .feedback-container *[data-v-2970edbb],.feedback-container *[data-v-2970edbb]::before,.feedback-container *[data-v-2970edbb]::after { box-sizing:border-box; } h2[data-v-2970edbb] { width:min(100%,1180px); margin:0 auto 24px !important; padding:clamp(18px,3vw,32px); background:var(--cream ); color:var(--ink ) !important; border:3px solid var(--ink ); border-radius:24px; box-shadow:8px 8px 0 var(--red ); text-align:left !important; font-size:clamp(28px,4vw,54px) !important; line-height:1.05; letter-spacing:-1.5px !important; text-transform:none !important; font-weight:900; } .feedback-list[data-v-2970edbb] { width:min(100%,1180px); margin:0 auto; display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:18px; } .feedback-item[data-v-2970edbb] { min-width:0; background:var(--cream ) !important; color:var(--ink ) !important; padding:18px !important; border:3px solid var(--ink ) !important; border-left:12px solid var(--red ) !important; border-radius:22px !important; box-shadow:6px 6px 0 var(--ink ) !important; transition:transform .15s ease,box-shadow .15s ease; } .feedback-item[data-v-2970edbb]:hover { transform:translate(-3px,-3px) !important; box-shadow:9px 9px 0 var(--red ) !important; } .feedback-header[data-v-2970edbb] { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; color:var(--ink ) !important; } .feedback-date[data-v-2970edbb] { color:rgba(26,26,29,.62) !important; font-weight:800; font-size:12px !important; text-align:right; } .feedback-text[data-v-2970edbb] { color:rgba(26,26,29,.82) !important; line-height:1.7 !important; overflow-wrap:anywhere; } .feedback-footer[data-v-2970edbb] { color:var(--ink ) !important; font-weight:900; } .status-circle[data-v-2970edbb] { width:12px !important; height:12px !important; border:2px solid var(--ink ); box-shadow:2px 2px 0 var(--ink ); } .status-blue[data-v-2970edbb] { background:var(--red ) !important; } .status-green[data-v-2970edbb] { background:var(--green ) !important; } .status-gray[data-v-2970edbb],.status-unknown[data-v-2970edbb] { background:var(--cream ) !important; } .modal-overlay[data-v-2970edbb] { background:rgba(26,26,29,.58) !important; padding:16px; } .modal-content[data-v-2970edbb] { background:var(--cream ) !important; color:var(--ink ) !important; width:min(100%,620px) !important; max-height:min(86vh,760px); overflow:auto; border:3px solid var(--ink ); border-radius:24px !important; box-shadow:8px 8px 0 var(--red ) !important; padding:clamp(18px,3vw,30px) !important; } .modal-content[data-v-2970edbb]:hover { box-shadow:8px 8px 0 var(--red ) !important; } .modal-close-btn[data-v-2970edbb] { top:12px !important; right:12px !important; width:40px; height:40px; border:3px solid var(--ink ) !important; border-radius:50%; background:var(--red ) !important; color:var(--cream ) !important; box-shadow:3px 3px 0 var(--ink ); font-weight:900; line-height:1; } .modal-title[data-v-2970edbb] { color:var(--ink ) !important; text-align:left !important; font-weight:900 !important; } .form-row[data-v-2970edbb] { display:grid !important; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:start; } .form-field[data-v-2970edbb] { width:100% !important; } .form-label[data-v-2970edbb] { display:block; width:auto !important; text-align:left !important; color:var(--ink ) !important; font-weight:900; margin-bottom:8px; } .form-input[data-v-2970edbb],.form-textarea[data-v-2970edbb] { border:3px solid var(--ink ) !important; border-radius:14px !important; background:#fff !important; color:var(--ink ) !important; font-weight:800; } .form-input[data-v-2970edbb]:focus,.form-textarea[data-v-2970edbb]:focus { outline:none; border-color:var(--ink ) !important; box-shadow:0 0 0 4px rgba(231,45,72,.18) !important; } .upload-btn[data-v-2970edbb],.submit-btn[data-v-2970edbb],.floating-btn[data-v-2970edbb],.btn-load-more[data-v-2970edbb] { border:3px solid var(--ink ) !important; background:var(--red ) !important; color:var(--cream ) !important; border-radius:14px !important; font-weight:900; box-shadow:5px 5px 0 var(--ink ) !important; transition:transform .15s ease,box-shadow .15s ease; } .upload-btn[data-v-2970edbb]:hover,.submit-btn[data-v-2970edbb]:hover,.floating-btn[data-v-2970edbb]:hover,.btn-load-more[data-v-2970edbb]:hover { transform:translate(-2px,-2px); box-shadow:7px 7px 0 var(--ink ) !important; } .upload-btn[data-v-2970edbb]:active,.submit-btn[data-v-2970edbb]:active,.floating-btn[data-v-2970edbb]:active,.btn-load-more[data-v-2970edbb]:active { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink ) !important; } .load-more[data-v-2970edbb] { width:min(100%,1180px); margin:24px auto 0 !important; } .floating-btn[data-v-2970edbb] { bottom:24px !important; right:24px !important; } @media (max-width:767px) { .feedback-container[data-v-2970edbb] { padding:14px !important; } h2[data-v-2970edbb],.feedback-item[data-v-2970edbb],.modal-content[data-v-2970edbb] { border-radius:18px !important; box-shadow:5px 5px 0 var(--red ) !important; } .feedback-list[data-v-2970edbb] { grid-template-columns:1fr; } .form-row[data-v-2970edbb] { grid-template-columns:1fr; } .upload-section[data-v-2970edbb] { display:grid !important; grid-template-columns:1fr; } .floating-btn[data-v-2970edbb] { width:54px !important; height:54px !important; right:16px !important; bottom:16px !important; } } .sheet-page[data-v-47543ffa] { --shell-width:1320px; min-height:100vh; color:#eef5ff; background:radial-gradient(circle at 12% 10%,rgba(56,189,248,0.24),transparent 30%),radial-gradient(circle at 88% 8%,rgba(34,197,94,0.18),transparent 28%),linear-gradient(135deg,#06111f 0%,#0c1424 46%,#07131f 100%); overflow-x:hidden; } .sheet-page[data-v-47543ffa]::before { content:""; position:fixed; inset:0; pointer-events:none; background-image:linear-gradient(rgba(255,255,255,0.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,0.035) 1px,transparent 1px); background-size:34px 34px; -webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,0.8),transparent 75%); mask-image:linear-gradient(180deg,rgba(0,0,0,0.8),transparent 75%); } .sheet-shell[data-v-47543ffa] { width:min(var(--shell-width ),calc(100% - 32px)); margin:0 auto; padding:64px 0 56px; position:relative; z-index:1; } .sheet-hero[data-v-47543ffa] { min-height:220px; display:grid; grid-template-columns:minmax(0,1fr) 380px; gap:24px; align-items:end; padding:36px 0 22px; border-bottom:1px solid rgba(255,255,255,0.12); } .eyebrow[data-v-47543ffa],.sheet-toolbar span[data-v-47543ffa],.panel-head span[data-v-47543ffa] { color:#7dd3fc; font-size:12px; font-weight:900; letter-spacing:0; } .sheet-hero h1[data-v-47543ffa] { margin:8px 0 10px; color:#ffffff; font-size:clamp(38px,5vw,72px); line-height:1.05; letter-spacing:0; } .sheet-hero p[data-v-47543ffa] { max-width:620px; margin:0; color:#afbed3; line-height:1.8; } .hero-stats[data-v-47543ffa] { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:12px; border:1px solid rgba(255,255,255,0.12); border-radius:8px; background:rgba(255,255,255,0.06); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); } .hero-stats div[data-v-47543ffa] { padding:13px 8px; border-radius:7px; background:rgba(255,255,255,0.06); text-align:center; } .hero-stats strong[data-v-47543ffa] { display:block; color:#ffffff; font-size:24px; } .hero-stats span[data-v-47543ffa] { display:block; margin-top:4px; color:#91a3bb; font-size:12px; font-weight:800; } .sheet-toolbar[data-v-47543ffa] { display:flex; justify-content:space-between; gap:16px; align-items:center; margin:18px 0; padding:14px; border:1px solid rgba(255,255,255,0.12); border-radius:8px; background:rgba(7,16,31,0.72); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); } .sheet-toolbar strong[data-v-47543ffa] { display:block; margin-top:4px; color:#ffffff; } .toolbar-actions[data-v-47543ffa] { display:flex; flex-wrap:wrap; gap:8px; } button[data-v-47543ffa] { border:0; cursor:pointer; font-weight:900; transition:transform 0.18s ease,border-color 0.18s ease,background 0.18s ease; } button[data-v-47543ffa]:hover { transform:translateY(-2px); } .ghost-button[data-v-47543ffa],.mini-button[data-v-47543ffa],.cell-tool-button[data-v-47543ffa],.column-insert-button[data-v-47543ffa],.column-remove-button[data-v-47543ffa],.row-remove-button[data-v-47543ffa] { min-height:36px; padding:0 12px; border:1px solid rgba(255,255,255,0.12); border-radius:7px; color:#dce8f8; background:rgba(255,255,255,0.06); } .primary-button[data-v-47543ffa] { min-height:38px; padding:0 16px; border-radius:7px; color:#04111f; background:linear-gradient(135deg,#7dd3fc,#86efac); box-shadow:0 14px 34px rgba(34,211,238,0.2); } .sheet-layout[data-v-47543ffa] { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(360px,0.65fr); gap:18px; align-items:start; } .editor-panel[data-v-47543ffa],.preview-panel[data-v-47543ffa] { border:1px solid rgba(255,255,255,0.12); border-radius:8px; background:rgba(10,20,36,0.78); box-shadow:0 22px 60px rgba(0,0,0,0.28); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); overflow:hidden; } .panel-head[data-v-47543ffa] { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:18px 18px 14px; border-bottom:1px solid rgba(255,255,255,0.08); } .panel-head h2[data-v-47543ffa] { margin:4px 0 0; color:#ffffff; font-size:20px; } .table-container[data-v-47543ffa] { width:100%; overflow-x:auto; } table[data-v-47543ffa] { width:100%; min-width:0; border-collapse:separate; border-spacing:0; } th[data-v-47543ffa],td[data-v-47543ffa] { min-width:180px; padding:10px; border-right:1px solid rgba(255,255,255,0.08); border-bottom:1px solid rgba(255,255,255,0.08); background:rgba(255,255,255,0.035); vertical-align:top; } th[data-v-47543ffa] { background:rgba(56,189,248,0.08); } .tool-cell[data-v-47543ffa] { min-width:94px; width:94px; text-align:center; } textarea[data-v-47543ffa] { width:100%; min-height:48px; padding:10px; border:1px solid rgba(255,255,255,0.12); border-radius:7px; box-sizing:border-box; color:#f8fbff; background:rgba(255,255,255,0.07); resize:vertical; outline:none; } textarea[data-v-47543ffa]:focus { border-color:rgba(125,211,252,0.78); box-shadow:0 0 0 3px rgba(125,211,252,0.12); } textarea[data-v-47543ffa]::-moz-placeholder { color:#72839c; } textarea[data-v-47543ffa]::placeholder { color:#72839c; } .column-buttons[data-v-47543ffa] { display:flex; gap:8px; margin-top:8px; } .column-insert-button[data-v-47543ffa] { color:#bbf7d0; } .column-remove-button[data-v-47543ffa],.row-remove-button[data-v-47543ffa] { color:#fecaca; } .preview-container[data-v-47543ffa] { overflow-x:auto; padding:14px; } .preview-row[data-v-47543ffa] { display:table-row; } .preview-cell[data-v-47543ffa] { display:table-cell; min-width:140px; max-width:280px; padding:11px 13px; border-right:1px solid rgba(255,255,255,0.08); border-bottom:1px solid rgba(255,255,255,0.08); color:#dce8f8; background:rgba(255,255,255,0.045); white-space:pre-wrap; word-break:break-word; } .preview-row.header .preview-cell[data-v-47543ffa] { color:#04111f; background:linear-gradient(135deg,#7dd3fc,#86efac); font-weight:900; } .preview-row:hover .preview-cell[data-v-47543ffa] { background:rgba(125,211,252,0.08); } @media (min-width:1440px) { .sheet-page[data-v-47543ffa] { --shell-width:1680px; } .sheet-layout[data-v-47543ffa] { grid-template-columns:minmax(0,1.5fr) minmax(460px,0.5fr); } } @media (max-width:1199px) { .sheet-shell[data-v-47543ffa] { width:min(100% - 24px,var(--shell-width )); } .sheet-hero[data-v-47543ffa],.sheet-layout[data-v-47543ffa] { grid-template-columns:1fr; } .sheet-hero > *[data-v-47543ffa],.sheet-layout > *[data-v-47543ffa],.sheet-toolbar > *[data-v-47543ffa] { min-width:0; } .sheet-toolbar[data-v-47543ffa] { align-items:stretch; flex-direction:column; } } @media (max-width:767px) { .sheet-shell[data-v-47543ffa] { width:min(100% - 16px,var(--shell-width )); padding-top:42px; } .sheet-hero[data-v-47543ffa] { min-height:auto; padding:22px 0 14px; } .sheet-hero p[data-v-47543ffa] { display:none; } .hero-stats[data-v-47543ffa] { gap:6px; padding:8px; } .hero-stats div[data-v-47543ffa] { padding:9px 6px; } .toolbar-actions[data-v-47543ffa] { display:grid; grid-template-columns:1fr 1fr; } .primary-button[data-v-47543ffa] { grid-column:1/-1; } th[data-v-47543ffa],td[data-v-47543ffa] { min-width:150px; } .table-wrap[data-v-47543ffa] { overflow-x:auto; } } .sheet-page[data-v-47543ffa] { color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.34),transparent 30%),var(--color-bg ); } .sheet-page[data-v-47543ffa]::before { background-image:linear-gradient(var(--color-focus-shadow ) 1px,transparent 1px),linear-gradient(90deg,var(--color-focus-shadow ) 1px,transparent 1px); background-size:28px 28px; -webkit-mask-image:none; mask-image:none; } .sheet-hero[data-v-47543ffa] { border-bottom-color:var(--color-border ); } .eyebrow[data-v-47543ffa],.sheet-toolbar span[data-v-47543ffa],.panel-head span[data-v-47543ffa] { color:var(--color-primary ); } .sheet-hero h1[data-v-47543ffa],.panel-head h2[data-v-47543ffa],.sheet-toolbar strong[data-v-47543ffa],.hero-stats strong[data-v-47543ffa] { color:var(--color-text ); } .sheet-hero p[data-v-47543ffa],.hero-stats span[data-v-47543ffa] { color:var(--color-text-soft ); } .hero-stats[data-v-47543ffa],.sheet-toolbar[data-v-47543ffa],.editor-panel[data-v-47543ffa],.preview-panel[data-v-47543ffa] { border-color:var(--color-border ); background:rgba(255,255,255,0.86); box-shadow:0 22px 54px var(--color-shadow ); } .hero-stats div[data-v-47543ffa] { background:var(--color-bg-soft ); } .panel-head[data-v-47543ffa] { border-bottom-color:var(--color-border ); } .ghost-button[data-v-47543ffa],.mini-button[data-v-47543ffa],.cell-tool-button[data-v-47543ffa],.column-insert-button[data-v-47543ffa],.column-remove-button[data-v-47543ffa],.row-remove-button[data-v-47543ffa] { border-color:var(--color-border ); color:var(--color-text ); background:var(--color-surface ); box-shadow:0 8px 18px var(--color-shadow ); } .primary-button[data-v-47543ffa] { color:var(--color-button-text ); background:var(--color-button ); box-shadow:0 16px 32px var(--color-shadow ); } th[data-v-47543ffa],td[data-v-47543ffa] { border-color:var(--color-border ); background:var(--color-surface ); } th[data-v-47543ffa] { background:var(--color-bg-soft ); } textarea[data-v-47543ffa] { border-color:var(--color-border ); color:var(--color-text ); background:var(--color-surface ); } textarea[data-v-47543ffa]:focus { border-color:var(--color-primary ); box-shadow:0 0 0 3px var(--color-focus-shadow ); } textarea[data-v-47543ffa]::-moz-placeholder { color:#94a3b8; } textarea[data-v-47543ffa]::placeholder { color:#94a3b8; } .column-insert-button[data-v-47543ffa] { color:#047857; } .column-remove-button[data-v-47543ffa],.row-remove-button[data-v-47543ffa] { color:#e11d48; } .preview-cell[data-v-47543ffa] { border-color:var(--color-border ); color:var(--color-text ); background:var(--color-surface ); } .preview-row.header .preview-cell[data-v-47543ffa] { color:var(--color-button-text ); background:var(--color-button ); } .preview-row:hover .preview-cell[data-v-47543ffa] { background:var(--color-bg-soft ); } .sheet-page[data-v-47543ffa] { --pink-bg:#F1DDDF; --cream:#FFF9F7; --ink:#1A1A1D; --red:#E72D48; --green:#2FA84F; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.15) 2px,transparent 2.5px) 0 0/26px 26px,var(--pink-bg ) !important; color:var(--ink ); overflow-x:hidden; } .sheet-page *[data-v-47543ffa],.sheet-page *[data-v-47543ffa]::before,.sheet-page *[data-v-47543ffa]::after { box-sizing:border-box; } .sheet-shell[data-v-47543ffa] { width:min(100%,1380px); margin:0 auto; } .sheet-hero[data-v-47543ffa],.sheet-toolbar[data-v-47543ffa],.editor-panel[data-v-47543ffa],.preview-panel[data-v-47543ffa] { background:var(--cream ) !important; color:var(--ink ) !important; border:3px solid var(--ink ) !important; border-radius:24px !important; box-shadow:8px 8px 0 var(--red ) !important; } .sheet-hero[data-v-47543ffa] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:20px; align-items:end; } .sheet-hero h1[data-v-47543ffa] { color:var(--ink ); letter-spacing:-1.5px; line-height:1.05; } .sheet-hero p[data-v-47543ffa] { color:rgba(26,26,29,.78); line-height:1.7; } .eyebrow[data-v-47543ffa] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:6px 12px; border:3px solid var(--ink ); border-radius:999px; background:var(--red ); color:var(--cream ); box-shadow:4px 4px 0 var(--ink ); font-weight:900; } .hero-stats[data-v-47543ffa] { display:grid; grid-template-columns:repeat(3,minmax(84px,1fr)); gap:10px; } .hero-stats div[data-v-47543ffa] { min-width:0; border:3px solid var(--ink ) !important; border-radius:18px !important; box-shadow:5px 5px 0 var(--ink ) !important; background:var(--cream ) !important; } .hero-stats strong[data-v-47543ffa] { color:var(--red ) !important; } .sheet-layout[data-v-47543ffa] { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr); gap:24px; align-items:start; } .editor-panel[data-v-47543ffa],.preview-panel[data-v-47543ffa] { min-width:0; } .preview-panel[data-v-47543ffa] { position:sticky; top:20px; } .sheet-toolbar[data-v-47543ffa] { display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; } .toolbar-actions[data-v-47543ffa] { display:flex; flex-wrap:wrap; gap:10px; } .ghost-button[data-v-47543ffa],.primary-button[data-v-47543ffa],.mini-button[data-v-47543ffa],.column-insert-button[data-v-47543ffa],.column-remove-button[data-v-47543ffa],.row-remove-button[data-v-47543ffa],.cell-tool-button[data-v-47543ffa],.btn-load-more[data-v-47543ffa] { border:3px solid var(--ink ) !important; border-radius:14px !important; background:var(--cream ) !important; color:var(--ink ) !important; font-weight:900; box-shadow:4px 4px 0 var(--ink ) !important; min-height:38px; transition:transform .15s ease,box-shadow .15s ease; } .primary-button[data-v-47543ffa],.cell-tool-button[data-v-47543ffa] { background:var(--red ) !important; color:var(--cream ) !important; } .ghost-button[data-v-47543ffa]:hover,.primary-button[data-v-47543ffa]:hover,.mini-button[data-v-47543ffa]:hover,.column-insert-button[data-v-47543ffa]:hover,.column-remove-button[data-v-47543ffa]:hover,.row-remove-button[data-v-47543ffa]:hover,.cell-tool-button[data-v-47543ffa]:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--ink ) !important; } .ghost-button[data-v-47543ffa]:active,.primary-button[data-v-47543ffa]:active,.mini-button[data-v-47543ffa]:active,.column-insert-button[data-v-47543ffa]:active,.column-remove-button[data-v-47543ffa]:active,.row-remove-button[data-v-47543ffa]:active,.cell-tool-button[data-v-47543ffa]:active { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink ) !important; } .table-container[data-v-47543ffa] { border:3px solid var(--ink ) !important; border-radius:18px !important; background:var(--cream ) !important; overflow:auto; max-width:100%; } .table-container table[data-v-47543ffa] { min-width:720px; border-collapse:separate; border-spacing:0; } .column-input[data-v-47543ffa],.cell-input[data-v-47543ffa],.form-input[data-v-47543ffa],input[data-v-47543ffa],textarea[data-v-47543ffa],select[data-v-47543ffa] { max-width:100%; min-width:0; border:3px solid var(--ink ) !important; border-radius:12px !important; background:var(--cream ) !important; color:var(--ink ) !important; font-weight:800; } .column-input[data-v-47543ffa]:focus,.cell-input[data-v-47543ffa]:focus,input[data-v-47543ffa]:focus,textarea[data-v-47543ffa]:focus,select[data-v-47543ffa]:focus { outline:none; box-shadow:0 0 0 4px rgba(231,45,72,.2) !important; } .preview-container[data-v-47543ffa] { max-width:100%; overflow:auto; border:3px solid var(--ink ); border-radius:18px; background:#fff; } .preview-row[data-v-47543ffa] { min-width:520px; } .preview-cell[data-v-47543ffa] { border-color:var(--ink ) !important; color:var(--ink ) !important; } .preview-row.header .preview-cell[data-v-47543ffa] { background:var(--red ) !important; color:var(--cream ) !important; font-weight:900; } @media (max-width:1199px) { .sheet-layout[data-v-47543ffa],.sheet-hero[data-v-47543ffa] { grid-template-columns:1fr; } .preview-panel[data-v-47543ffa] { position:static; } } @media (max-width:767px) { .sheet-page[data-v-47543ffa] { padding:14px !important; } .sheet-hero[data-v-47543ffa],.sheet-toolbar[data-v-47543ffa],.editor-panel[data-v-47543ffa],.preview-panel[data-v-47543ffa] { border-radius:18px !important; box-shadow:5px 5px 0 var(--red ) !important; } .hero-stats[data-v-47543ffa] { grid-template-columns:1fr; } .toolbar-actions[data-v-47543ffa],.toolbar-actions button[data-v-47543ffa],.primary-button[data-v-47543ffa],.ghost-button[data-v-47543ffa] { width:100%; } .panel-head[data-v-47543ffa] { align-items:flex-start; flex-direction:column; } .table-container table[data-v-47543ffa] { min-width:640px; } } .quote-book[data-v-604fccc6] { width:300px; margin:0 auto; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,0.1); } .quote-page[data-v-604fccc6] { padding:20px; font-family:"Times New Roman",Times,serif; position:relative; } .quote-number[data-v-604fccc6] { position:absolute; top:10px; left:10px; font-size:24px; font-weight:bold; } .quote-text p[data-v-604fccc6] { font-size:16px; line-height:1.6; margin:20px 0; } .quote-author[data-v-604fccc6] { font-size:14px; margin-top:10px; } .quote-hashtag[data-v-604fccc6] { font-size:14px; margin-top:5px; color:#008000; } .hidden[data-v-604fccc6] { opacity:0; position:absolute; left:0; top:0; z-index:-1; width:100%; height:100%; padding:20px; resize:none; } .folders-page[data-v-1c8c7662] { min-height:100vh; background:radial-gradient(circle at 10% 6%,rgba(255,218,77,0.46),transparent 24rem),radial-gradient(circle at 92% 3%,rgba(42,196,255,0.34),transparent 26rem),linear-gradient(135deg,#fff9e6 0%,#eefbff 48%,#fff0f6 100%); color:var(--color-text ); overflow-x:hidden; } .folders-shell[data-v-1c8c7662] { width:min(1360px,calc(100% - 40px)); margin:0 auto; padding:46px 0 78px; } .folders-hero[data-v-1c8c7662] { display:grid; grid-template-columns:minmax(0,1fr) minmax(240px,360px); gap:18px; margin-bottom:18px; } .folders-hero > div[data-v-1c8c7662]:first-child,.folder-stats[data-v-1c8c7662],.path-container[data-v-1c8c7662],.folder-item[data-v-1c8c7662] { border:1px solid var(--color-border ); border-radius:8px; box-shadow:0 20px 52px var(--color-shadow ); } .folders-hero > div[data-v-1c8c7662]:first-child { padding:clamp(30px,5vw,58px); background:linear-gradient(125deg,rgba(255,255,255,0.9),rgba(255,255,255,0.7)),linear-gradient(135deg,rgba(255,116,165,0.16),rgba(42,196,255,0.16)); } .eyebrow[data-v-1c8c7662] { display:inline-flex; padding:8px 12px; border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .folders-hero h1[data-v-1c8c7662] { margin:18px 0 12px; color:var(--color-text ); font-size:clamp(42px,6vw,80px); line-height:1.05; letter-spacing:0; } .folders-hero p[data-v-1c8c7662] { max-width:100%; margin:0; overflow-wrap:break-word; color:var(--color-text-soft ); font-size:clamp(16px,2vw,20px); font-weight:800; line-height:1.6; } .folder-stats[data-v-1c8c7662] { display:grid; gap:12px; padding:14px; background:rgba(255,255,255,0.76); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .folder-stats div[data-v-1c8c7662] { display:flex; flex-direction:column; justify-content:center; gap:6px; border-radius:8px; background:var(--gradient-soft ); padding:20px; } .folder-stats strong[data-v-1c8c7662] { color:var(--color-text ); font-size:clamp(28px,4vw,44px); font-weight:900; } .folder-stats span[data-v-1c8c7662] { color:var(--color-text-soft ); font-size:13px; font-weight:800; } .path-container[data-v-1c8c7662] { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:18px; padding:14px; background:rgba(255,255,255,0.8); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .path-item[data-v-1c8c7662] { display:inline-flex; min-width:0; align-items:center; border:0; border-radius:999px; background:var(--color-surface ); color:#1d2a44; cursor:pointer; font-size:14px; font-weight:900; padding:10px 14px; transition:transform 0.2s ease,background 0.2s ease,color 0.2s ease; } .path-item[data-v-1c8c7662]::after { content:"/"; margin-left:10px; color:rgba(29,42,68,0.38); } .path-item[data-v-1c8c7662]:last-child::after { display:none; } .path-item[data-v-1c8c7662]:hover { background:var(--color-button ); color:var(--color-button-text ); transform:translateY(-2px); } .folder-list[data-v-1c8c7662] { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:14px; } .folder-item[data-v-1c8c7662] { display:grid; grid-template-columns:64px minmax(0,1fr) auto; gap:14px; align-items:center; min-height:118px; background:rgba(255,255,255,0.88); cursor:pointer; padding:16px; transition:transform 0.22s ease,box-shadow 0.22s ease,border-color 0.22s ease; } .folder-item[data-v-1c8c7662]:hover { border-color:rgba(0,128,255,0.28); box-shadow:0 24px 58px rgba(0,128,255,0.15); transform:translateY(-5px); } .item-icon[data-v-1c8c7662] { display:grid; width:64px; height:64px; place-items:center; border-radius:8px; color:var(--color-text ); font-size:13px; font-weight:900; } .folder .item-icon[data-v-1c8c7662] { background:linear-gradient(135deg,#ffcf45,#ff7ab3); } .file .item-icon[data-v-1c8c7662] { background:linear-gradient(135deg,#4ee0be,#51b8ff); } .item-copy[data-v-1c8c7662] { min-width:0; } .item-copy h2[data-v-1c8c7662] { margin:0; overflow:hidden; color:var(--color-text ); font-size:17px; font-weight:900; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; } .item-copy p[data-v-1c8c7662] { margin:7px 0 0; color:#66748c; font-size:13px; font-weight:800; } .item-action[data-v-1c8c7662] { border-radius:999px; background:var(--color-button ); color:var(--color-button-text ); font-size:12px; font-weight:900; padding:8px 11px; } .back-btn[data-v-1c8c7662] { position:fixed; left:18px; top:18px; z-index:10; display:inline-flex; align-items:center; gap:8px; border-radius:999px; background:rgba(17,24,39,0.9); color:var(--color-button-text ); cursor:pointer; font-size:14px; font-weight:900; padding:11px 16px; box-shadow:0 14px 36px rgba(17,24,39,0.16); } .back-mark[data-v-1c8c7662] { font-size:24px; line-height:1; } @media (min-width:1440px) { .folders-shell[data-v-1c8c7662] { width:min(1680px,calc(100% - 96px)); } .folder-list[data-v-1c8c7662] { grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); } } @media (max-width:820px) { .folders-shell[data-v-1c8c7662] { width:min(100% - 28px,720px); padding-top:74px; } .folders-hero[data-v-1c8c7662] { grid-template-columns:1fr; } .folder-stats[data-v-1c8c7662] { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:520px) { .folders-shell[data-v-1c8c7662] { width:min(100% - 20px,480px); } .folders-hero > div[data-v-1c8c7662]:first-child,.folder-stats[data-v-1c8c7662],.path-container[data-v-1c8c7662] { padding:12px; } .folders-hero > div[data-v-1c8c7662]:first-child { padding:24px; } .folder-stats[data-v-1c8c7662],.folder-list[data-v-1c8c7662] { grid-template-columns:1fr; } .folder-item[data-v-1c8c7662] { grid-template-columns:52px minmax(0,1fr); } .item-icon[data-v-1c8c7662] { width:52px; height:52px; font-size:12px; } .item-action[data-v-1c8c7662] { grid-column:1/-1; width:-moz-fit-content; width:fit-content; } } .quest-page[data-v-e3d06770] { min-height:100vh; color:#f8fafc; background:linear-gradient(135deg,rgba(255,255,255,0.08),transparent 34%),var(--color-surface-strong ); } .quest-shell[data-v-e3d06770] { width:min(1500px,calc(100% - 32px)); margin:0 auto; padding:clamp(54px,6vw,88px) 0 clamp(42px,6vw,80px); } .quest-hero[data-v-e3d06770] { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,430px); gap:clamp(18px,3vw,34px); align-items:end; margin-bottom:22px; } .eyebrow[data-v-e3d06770],.panel-head span[data-v-e3d06770],.board-head span[data-v-e3d06770] { display:inline-flex; color:var(--color-primary ); font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .hero-copy h1[data-v-e3d06770] { margin:8px 0 12px; color:var(--color-button-text ); font-size:clamp(44px,6vw,88px); line-height:1.05; letter-spacing:0; } .hero-copy p[data-v-e3d06770] { max-width:767px; margin:0; color:var(--color-text-soft ); font-size:clamp(15px,1.35vw,19px); line-height:1.75; } .hero-card[data-v-e3d06770],.quest-panel[data-v-e3d06770],.board-panel[data-v-e3d06770],.quest-card[data-v-e3d06770],.quest-toolbar[data-v-e3d06770] { border:1px solid rgba(255,255,255,0.12); border-radius:8px; background:rgba(15,23,42,0.78); box-shadow:0 24px 70px rgba(0,0,0,0.28); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-card[data-v-e3d06770] { padding:22px; } .rank-badge[data-v-e3d06770] { display:inline-flex; align-items:center; justify-content:center; width:58px; height:58px; border-radius:8px; color:var(--color-text ); background:linear-gradient(135deg,#ffcf45,#19c99a); font-size:30px; font-weight:1000; } .hero-stats[data-v-e3d06770] { margin-top:16px; } .hero-stats span[data-v-e3d06770],.currency-row span[data-v-e3d06770],.board-summary span[data-v-e3d06770] { display:block; color:var(--color-muted ); font-size:12px; font-weight:900; } .hero-stats strong[data-v-e3d06770] { display:block; margin:5px 0 10px; color:var(--color-button-text ); font-size:34px; } .xp-track[data-v-e3d06770],.progress-track[data-v-e3d06770] { overflow:hidden; height:10px; border-radius:999px; background:rgba(148,163,184,0.22); } .xp-fill[data-v-e3d06770],.progress-fill[data-v-e3d06770] { height:100%; border-radius:inherit; background:linear-gradient(90deg,#2ac4ff,#19c99a,#ffcf45); transition:width 0.3s ease; } .hero-stats small[data-v-e3d06770] { display:block; margin-top:8px; color:var(--color-text-soft ); font-weight:900; } .currency-row[data-v-e3d06770] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-top:16px; } .currency-row div[data-v-e3d06770] { padding:12px; border-radius:8px; background:rgba(255,255,255,0.08); } .currency-row strong[data-v-e3d06770] { display:block; margin-top:4px; color:var(--color-button-text ); font-size:24px; } .quest-toolbar[data-v-e3d06770] { display:flex; justify-content:space-between; gap:14px; align-items:center; padding:12px; margin-bottom:18px; } .filter-tabs[data-v-e3d06770] { display:flex; gap:8px; flex-wrap:wrap; } .filter-tabs button[data-v-e3d06770],.template-row button[data-v-e3d06770] { min-height:38px; padding:0 14px; border:1px solid rgba(255,255,255,0.12); border-radius:8px; color:#cbd5e1; background:rgba(255,255,255,0.06); font-weight:900; cursor:pointer; } .filter-tabs button.active[data-v-e3d06770],.filter-tabs button[data-v-e3d06770]:hover,.template-row button[data-v-e3d06770]:hover { color:var(--color-text ); background:#ffcf45; } .toolbar-actions[data-v-e3d06770] { display:flex; gap:10px; } input[data-v-e3d06770],textarea[data-v-e3d06770],select[data-v-e3d06770] { width:100%; min-height:42px; padding:0 12px; border:1px solid rgba(255,255,255,0.14); border-radius:8px; color:#f8fafc; background:rgba(2,6,23,0.58); box-sizing:border-box; outline:none; } textarea[data-v-e3d06770] { min-height:94px; padding-top:10px; resize:vertical; } input[data-v-e3d06770]:focus,textarea[data-v-e3d06770]:focus,select[data-v-e3d06770]:focus { border-color:#2ac4ff; box-shadow:0 0 0 4px rgba(42,196,255,0.12); } .quest-layout[data-v-e3d06770] { display:grid; grid-template-columns:minmax(320px,420px) minmax(0,1fr); gap:18px; align-items:start; } .quest-panel[data-v-e3d06770],.board-panel[data-v-e3d06770] { padding:18px; } .editor-panel[data-v-e3d06770] { position:sticky; top:16px; } .panel-head[data-v-e3d06770],.board-head[data-v-e3d06770],.quest-card-head[data-v-e3d06770] { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; } .panel-head h2[data-v-e3d06770],.board-head h2[data-v-e3d06770] { margin:5px 0 0; color:var(--color-button-text ); font-size:24px; } .template-row[data-v-e3d06770] { display:flex; flex-wrap:wrap; gap:8px; margin-top:16px; } .field[data-v-e3d06770],.field-grid[data-v-e3d06770] { margin-top:14px; } .field span[data-v-e3d06770] { display:block; margin-bottom:7px; color:var(--color-muted ); font-size:12px; font-weight:900; } .field-grid[data-v-e3d06770] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .reward-inputs[data-v-e3d06770] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; } .ghost-button[data-v-e3d06770],.primary-button[data-v-e3d06770],.submit-button[data-v-e3d06770],.danger-button[data-v-e3d06770],.icon-button[data-v-e3d06770] { min-height:40px; border:none; border-radius:8px; font-weight:900; cursor:pointer; transition:transform 0.2s ease,box-shadow 0.2s ease,background 0.2s ease; } .ghost-button[data-v-e3d06770] { padding:0 14px; color:#cbd5e1; background:rgba(255,255,255,0.08); } .primary-button[data-v-e3d06770],.submit-button[data-v-e3d06770] { padding:0 16px; color:var(--color-text ); background:#ffcf45; } .submit-button[data-v-e3d06770] { width:100%; margin-top:16px; } .danger-button[data-v-e3d06770] { padding:0 14px; color:#fecdd3; background:rgba(244,63,94,0.18); } .icon-button[data-v-e3d06770] { width:40px; color:#cbd5e1; background:rgba(255,255,255,0.08); } .ghost-button[data-v-e3d06770]:hover,.primary-button[data-v-e3d06770]:hover,.submit-button[data-v-e3d06770]:hover,.danger-button[data-v-e3d06770]:hover,.icon-button[data-v-e3d06770]:hover { transform:translateY(-2px); } .board-summary[data-v-e3d06770] { text-align:right; } .board-summary strong[data-v-e3d06770] { display:block; color:var(--color-button-text ); font-size:28px; line-height:1; } .quest-lanes[data-v-e3d06770] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:18px; } .quest-card[data-v-e3d06770] { position:relative; overflow:hidden; padding:16px; } .quest-card[data-v-e3d06770]:before { content:""; position:absolute; inset:0; border-left:5px solid #2ac4ff; pointer-events:none; } .quest-card.type-main[data-v-e3d06770]:before { border-left-color:var(--color-primary ); } .quest-card.type-daily[data-v-e3d06770]:before { border-left-color:#19c99a; } .quest-card.type-side[data-v-e3d06770]:before { border-left-color:#2ac4ff; } .quest-card.type-challenge[data-v-e3d06770]:before { border-left-color:#ff6f9f; } .quest-card.status-completed[data-v-e3d06770] { opacity:0.78; } .quest-rank[data-v-e3d06770] { display:inline-flex; align-items:center; justify-content:center; width:42px; height:42px; border-radius:8px; color:var(--color-text ); background:#ffcf45; font-weight:1000; font-size:22px; } .quest-card-head > div[data-v-e3d06770]:nth-child(2) { min-width:0; flex:1; } .quest-card-head span[data-v-e3d06770] { color:var(--color-muted ); font-size:12px; font-weight:900; } .quest-card h3[data-v-e3d06770] { margin:4px 0 0; color:var(--color-button-text ); font-size:20px; line-height:1.25; } .quest-card p[data-v-e3d06770] { margin:12px 0; color:var(--color-text-soft ); line-height:1.65; } .quest-meta[data-v-e3d06770],.reward-row[data-v-e3d06770],.card-actions[data-v-e3d06770] { display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap; } .quest-meta span[data-v-e3d06770],.reward-row span[data-v-e3d06770] { color:#cbd5e1; font-size:12px; font-weight:900; } .quest-meta .is-warning[data-v-e3d06770] { color:var(--color-primary ); } .quest-meta .is-danger[data-v-e3d06770] { color:#fb7185; } .progress-track[data-v-e3d06770] { margin:10px 0 12px; } .step-list[data-v-e3d06770] { display:grid; gap:8px; } .step-list label[data-v-e3d06770] { display:flex; gap:10px; align-items:center; padding:10px; border-radius:8px; background:rgba(255,255,255,0.06); color:#dbe4ef; font-weight:800; } .step-list label.done[data-v-e3d06770] { color:var(--color-muted ); text-decoration:line-through; } .step-list input[data-v-e3d06770] { width:auto; min-height:auto; } .reward-row[data-v-e3d06770] { margin-top:12px; padding-top:12px; border-top:1px solid rgba(255,255,255,0.1); } .reward-row span[data-v-e3d06770] { color:var(--color-primary ); } .card-actions[data-v-e3d06770] { margin-top:12px; } .empty-board[data-v-e3d06770] { grid-column:1/-1; padding:42px 20px; border:1px dashed rgba(255,255,255,0.22); border-radius:8px; text-align:center; color:var(--color-muted ); } .empty-board strong[data-v-e3d06770] { display:block; color:var(--color-button-text ); font-size:22px; } .quest-toast[data-v-e3d06770] { position:fixed; left:50%; bottom:28px; z-index:1200; transform:translateX(-50%); padding:12px 16px; border-radius:999px; background:#ffcf45; color:var(--color-text ); font-size:14px; font-weight:900; box-shadow:0 20px 50px rgba(0,0,0,0.26); } .toast-pop-enter-active[data-v-e3d06770],.toast-pop-leave-active[data-v-e3d06770] { transition:opacity 0.24s ease,transform 0.24s ease; } .toast-pop-enter[data-v-e3d06770],.toast-pop-leave-to[data-v-e3d06770] { opacity:0; transform:translate(-50%,10px); } @media (max-width:1100px) { .quest-hero[data-v-e3d06770],.quest-layout[data-v-e3d06770],.quest-lanes[data-v-e3d06770] { grid-template-columns:1fr; } .editor-panel[data-v-e3d06770] { position:static; } } @media (max-width:720px) { .quest-shell[data-v-e3d06770] { width:min(100% - 20px,1500px); padding-top:42px; } .hero-copy h1[data-v-e3d06770] { font-size:38px; } .quest-toolbar[data-v-e3d06770],.toolbar-actions[data-v-e3d06770],.field-grid[data-v-e3d06770],.reward-inputs[data-v-e3d06770],.currency-row[data-v-e3d06770] { display:grid; grid-template-columns:1fr; } .quest-toolbar[data-v-e3d06770],.toolbar-actions[data-v-e3d06770] { align-items:stretch; } .hero-card[data-v-e3d06770],.quest-panel[data-v-e3d06770],.board-panel[data-v-e3d06770],.quest-card[data-v-e3d06770] { padding:14px; } } .quest-page[data-v-e3d06770]{--pink-bg:#F1DDDF;--cream:#FFF9F7;--ink:#1A1A1D;--red:#E72D48;--green:#2FA84F;background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.13) 2px,transparent 2.5px) 0 0/26px 26px,var(--pink-bg )!important;color:var(--ink );overflow-x:hidden}.quest-page*[data-v-e3d06770],.quest-page*[data-v-e3d06770]::before,.quest-page*[data-v-e3d06770]::after{box-sizing:border-box}.quest-shell[data-v-e3d06770]{width:min(100%,1380px);margin:0 auto}.quest-hero[data-v-e3d06770],.quest-toolbar[data-v-e3d06770],.quest-panel[data-v-e3d06770],.board-panel[data-v-e3d06770],.hero-card[data-v-e3d06770],.quest-card[data-v-e3d06770],.empty-board[data-v-e3d06770]{background:var(--cream )!important;color:var(--ink )!important;border:3px solid var(--ink )!important;border-radius:24px!important;box-shadow:8px 8px 0 var(--red )!important}.quest-hero[data-v-e3d06770]{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,380px);gap:20px;align-items:end}.hero-copy h1[data-v-e3d06770]{color:var(--ink );line-height:1.05;letter-spacing:-1.5px}.hero-copy p[data-v-e3d06770]{color:rgba(26,26,29,.76);line-height:1.75}.eyebrow[data-v-e3d06770],.board-head span[data-v-e3d06770]{display:inline-flex;width:-moz-fit-content;width:fit-content;padding:6px 12px;border:3px solid var(--ink );border-radius:999px;background:var(--red );color:var(--cream );box-shadow:4px 4px 0 var(--ink );font-weight:900}.rank-badge[data-v-e3d06770]{border:3px solid var(--ink )!important;background:var(--red )!important;color:var(--cream )!important;box-shadow:4px 4px 0 var(--ink )!important}.hero-card[data-v-e3d06770]{box-shadow:8px 8px 0 var(--ink )!important}.quest-toolbar[data-v-e3d06770]{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}.filter-tabs[data-v-e3d06770],.toolbar-actions[data-v-e3d06770],.template-row[data-v-e3d06770],.card-actions[data-v-e3d06770]{display:flex;flex-wrap:wrap;gap:10px}.quest-layout[data-v-e3d06770]{display:grid;grid-template-columns:minmax(280px,390px) minmax(0,1fr);gap:22px;align-items:start}.editor-panel[data-v-e3d06770]{position:sticky;top:20px;min-width:0}.board-panel[data-v-e3d06770]{min-width:0}.filter-tabs button[data-v-e3d06770],.template-row button[data-v-e3d06770],.primary-button[data-v-e3d06770],.ghost-button[data-v-e3d06770],.submit-button[data-v-e3d06770],.danger-button[data-v-e3d06770],.icon-button[data-v-e3d06770],.card-actions button[data-v-e3d06770]{border:3px solid var(--ink )!important;border-radius:14px!important;background:var(--cream )!important;color:var(--ink )!important;font-weight:900;box-shadow:4px 4px 0 var(--ink )!important;transition:transform .15s ease,box-shadow .15s ease}.filter-tabs button.active[data-v-e3d06770],.primary-button[data-v-e3d06770],.submit-button[data-v-e3d06770]{background:var(--red )!important;color:var(--cream )!important}.danger-button[data-v-e3d06770]{background:#fff!important;color:var(--red )!important}.filter-tabs button[data-v-e3d06770]:hover,.template-row button[data-v-e3d06770]:hover,.primary-button[data-v-e3d06770]:hover,.ghost-button[data-v-e3d06770]:hover,.submit-button[data-v-e3d06770]:hover,.danger-button[data-v-e3d06770]:hover,.icon-button[data-v-e3d06770]:hover,.card-actions button[data-v-e3d06770]:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink )!important}.filter-tabs button[data-v-e3d06770]:active,.template-row button[data-v-e3d06770]:active,.primary-button[data-v-e3d06770]:active,.ghost-button[data-v-e3d06770]:active,.submit-button[data-v-e3d06770]:active,.danger-button[data-v-e3d06770]:active,.icon-button[data-v-e3d06770]:active,.card-actions button[data-v-e3d06770]:active{transform:translate(2px,2px);box-shadow:2px 2px 0 var(--ink )!important}.field input[data-v-e3d06770],.field textarea[data-v-e3d06770],.field select[data-v-e3d06770],input[data-v-e3d06770],textarea[data-v-e3d06770],select[data-v-e3d06770]{max-width:100%;min-width:0;border:3px solid var(--ink )!important;border-radius:14px!important;background:#fff!important;color:var(--ink )!important;font-weight:800}.field input[data-v-e3d06770]:focus,.field textarea[data-v-e3d06770]:focus,.field select[data-v-e3d06770]:focus,input[data-v-e3d06770]:focus,textarea[data-v-e3d06770]:focus,select[data-v-e3d06770]:focus{outline:none;box-shadow:0 0 0 4px rgba(231,45,72,.18)!important}.field-grid[data-v-e3d06770],.reward-inputs[data-v-e3d06770]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.quest-lanes[data-v-e3d06770]{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}.quest-card[data-v-e3d06770]{box-shadow:5px 5px 0 var(--ink )!important;min-width:0}.quest-card[data-v-e3d06770]:before{background:var(--red )!important}.quest-card.status-completed[data-v-e3d06770]{box-shadow:5px 5px 0 var(--green )!important}.progress-track[data-v-e3d06770],.xp-track[data-v-e3d06770]{border:3px solid var(--ink )!important;background:#fff!important;border-radius:999px;overflow:hidden}.progress-fill[data-v-e3d06770],.xp-fill[data-v-e3d06770]{background:var(--red )!important}.step-list[data-v-e3d06770]{display:grid;gap:8px}.step-list label[data-v-e3d06770]{border:2px solid var(--ink );border-radius:12px;background:#fff;padding:8px}.step-list label.done[data-v-e3d06770]{background:rgba(47,168,79,.12)}.reward-row span[data-v-e3d06770],.quest-meta span[data-v-e3d06770]{border:2px solid var(--ink );border-radius:999px;background:#fff;color:var(--ink );font-weight:900}.quest-toast[data-v-e3d06770]{border:3px solid var(--ink )!important;background:var(--cream )!important;color:var(--ink )!important;box-shadow:6px 6px 0 var(--red )!important} @media(max-width:1100px){.quest-layout[data-v-e3d06770],.quest-hero[data-v-e3d06770]{grid-template-columns:1fr}.editor-panel[data-v-e3d06770]{position:static}.quest-toolbar[data-v-e3d06770]{align-items:flex-start}.filter-tabs[data-v-e3d06770],.toolbar-actions[data-v-e3d06770]{width:100%}} @media(max-width:720px){.quest-page[data-v-e3d06770]{padding:14px!important}.quest-hero[data-v-e3d06770],.quest-toolbar[data-v-e3d06770],.quest-panel[data-v-e3d06770],.board-panel[data-v-e3d06770],.hero-card[data-v-e3d06770],.quest-card[data-v-e3d06770]{border-radius:18px!important;box-shadow:5px 5px 0 var(--red )!important}.field-grid[data-v-e3d06770],.reward-inputs[data-v-e3d06770],.currency-row[data-v-e3d06770]{grid-template-columns:1fr!important}.filter-tabs[data-v-e3d06770],.toolbar-actions[data-v-e3d06770],.template-row[data-v-e3d06770],.card-actions[data-v-e3d06770]{display:grid;grid-template-columns:1fr}.filter-tabs button[data-v-e3d06770],.toolbar-actions button[data-v-e3d06770],.template-row button[data-v-e3d06770],.card-actions button[data-v-e3d06770],.submit-button[data-v-e3d06770]{width:100%}.quest-lanes[data-v-e3d06770]{grid-template-columns:1fr}.quest-card-head[data-v-e3d06770]{align-items:flex-start;gap:10px}.board-head[data-v-e3d06770]{align-items:flex-start;flex-direction:column}} .video-container[data-v-d0a3fc98] { max-width:800px; margin:0 auto; padding:16px; -webkit-user-select:none; -moz-user-select:none; user-select:none; } .aura-app[data-v-697ff8f3] { min-height:100vh; background:var(--color-bg ); color:var(--color-text ); font-family:"Inter",-apple-system,sans-serif; overflow-x:hidden; padding-bottom:60px; } .glow-canvas[data-v-697ff8f3] { position:fixed; inset:0; z-index:0; pointer-events:none; } .glow-orb[data-v-697ff8f3] { position:absolute; border-radius:50%; filter:blur(100px); opacity:0.1; animation:float-697ff8f3 20s infinite alternate; } .orb-1[data-v-697ff8f3] { width:800px; height:800px; background:var(--color-primary ); top:-20%; left:-10%; } .orb-2[data-v-697ff8f3] { width:600px; height:600px; background:var(--color-card-topline ); bottom:-10%; right:-10%; animation-delay:-5s; } @keyframes float-697ff8f3 { from { transform:translate(0,0) scale(1); } to { transform:translate(50px,50px) scale(1.1); } } .app-header[data-v-697ff8f3] { position:sticky; top:0; z-index:1000; background:rgba(255,255,255,0.86); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); border-bottom:1px solid var(--color-border ); } .header-content[data-v-697ff8f3] { max-width:1800px; margin:0 auto; height:70px; display:flex; align-items:center; justify-content:space-between; padding:0 30px; } .brand[data-v-697ff8f3] { display:flex; align-items:center; gap:10px; } .logo[data-v-697ff8f3] { width:28px; height:28px; background:var(--color-primary ); color:white; border-radius:8px; display:flex; align-items:center; justify-content:center; font-weight:900; font-size:14px; } .title[data-v-697ff8f3] { font-weight:800; font-size:18px; letter-spacing:0; } .title span[data-v-697ff8f3] { color:var(--color-muted ); font-weight:400; } .toolbar[data-v-697ff8f3] { display:flex; align-items:center; gap:12px; } .search-wrapper[data-v-697ff8f3] { background:var(--color-bg-soft ); border-radius:10px; padding:0 12px; display:flex; align-items:center; height:38px; max-width:300px; width:100%; transition: 0.3s; border:1px solid transparent; } .search-wrapper[data-v-697ff8f3]:focus-within { background:var(--color-surface ); border-color:var(--color-text ); box-shadow:0 4px 12px rgba(0,0,0,0.05); } .search-hint[data-v-697ff8f3] { font-size:10px; font-weight:700; color:var(--color-muted ); background:var(--color-surface ); padding:2px 4px; border-radius:4px; margin-right:10px; border:1px solid #e2e8f0; } .search-wrapper input[data-v-697ff8f3] { border:none; background:none; outline:none; font-size:14px; width:100%; color:var(--color-text ); } .enter-icon[data-v-697ff8f3] { color:#cbd5e1; font-size:14px; } .button-group[data-v-697ff8f3] { display:flex; align-items:center; gap:8px; } .tool-btn[data-v-697ff8f3] { height:38px; display:flex; align-items:center; gap:6px; border-radius:10px; border:none; cursor:pointer; transition:0.2s; padding:0 14px; font-weight:600; font-size:14px; } .tool-btn.primary[data-v-697ff8f3] { background:var(--color-button ); color:white; } .tool-btn.primary[data-v-697ff8f3]:hover { opacity:0.9; transform:translateY(-1px); } .tool-btn.secondary[data-v-697ff8f3] { background:var(--color-bg-soft ); color:var(--color-text-soft ); padding:0 10px; } .tool-btn.secondary[data-v-697ff8f3]:hover { background:var(--color-border ); color:var(--color-text ); } .category-bar[data-v-697ff8f3] { max-width:1800px; margin:0 auto; padding:0 30px 10px; } .scroll-container[data-v-697ff8f3] { display:flex; gap:8px; overflow-x:auto; scrollbar-width:none; } .cat-item[data-v-697ff8f3] { background:white; border:1px solid #f1f5f9; padding:5px 12px; border-radius:18px; font-size:12px; font-weight:600; color:var(--color-text-soft ); cursor:pointer; white-space:nowrap; transition:0.2s; } .cat-item[data-v-697ff8f3]:hover { border-color:var(--color-text ); color:var(--color-text ); } .cat-item span[data-v-697ff8f3] { opacity:0.4; margin-left:4px; font-size:10px; } .content-container[data-v-697ff8f3] { max-width:1800px; margin:30px auto; padding:0 30px; position:relative; z-index:1; } .folder-section[data-v-697ff8f3] { background:var(--m-bg ); border-radius:24px; padding:24px; margin-bottom:30px; border:1px solid rgba(255,255,255,0.5); } .section-head[data-v-697ff8f3] { display:flex; align-items:center; gap:10px; margin-bottom:20px; } .section-head .dot[data-v-697ff8f3] { width:6px; height:6px; background:var(--m-accent ); border-radius:50%; } .section-head h2[data-v-697ff8f3] { font-size:16px; font-weight:800; color:#475569; text-transform:capitalize; } .brick-grid[data-v-697ff8f3] { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; } .resource-brick[data-v-697ff8f3] { background:white; border-radius:14px; padding:12px; display:flex; align-items:center; gap:12px; cursor:pointer; transition: 0.2s; border:1px solid transparent; position:relative; } .resource-brick[data-v-697ff8f3]:hover { transform:translateY(-2px); box-shadow:0 8px 16px rgba(0,0,0,0.04); border-color:var(--m-accent ); } .brick-icon[data-v-697ff8f3] { width:36px; height:36px; background:var(--color-bg ); border-radius:10px; display:flex; align-items:center; justify-content:center; flex-shrink:0; } .brick-icon img[data-v-697ff8f3] { width:20px; height:20px; } .brick-body[data-v-697ff8f3] { overflow:hidden; } .brick-title[data-v-697ff8f3] { font-size:13px; font-weight:700; color:var(--color-text ); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; } .brick-desc[data-v-697ff8f3] { font-size:11px; color:var(--color-muted ); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-top:2px; } .brick-edit[data-v-697ff8f3] { position:absolute; right:8px; top:8px; width:20px; height:20px; border-radius:5px; background:var(--color-bg-soft ); color:var(--color-muted ); border:none; opacity:0; transition:0.2s; cursor:pointer; } .resource-brick:hover .brick-edit[data-v-697ff8f3] { opacity:1; } .brick-edit[data-v-697ff8f3]:hover { background:var(--color-button ); color:white; } .modal-overlay[data-v-697ff8f3] { position:fixed; inset:0; background:var(--color-focus-shadow ); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); z-index:2000; display:flex; align-items:center; justify-content:center; } .modal-sheet[data-v-697ff8f3] { background:white; width:400px; border-radius:24px; padding:30px; box-shadow:0 30px 60px rgba(0,0,0,0.1); } .modal-head h3[data-v-697ff8f3] { font-size:18px; font-weight:800; margin-bottom:20px; } .modal-body input[data-v-697ff8f3],.modal-body textarea[data-v-697ff8f3] { width:100%; margin-bottom:12px; padding:12px; background:var(--color-bg-soft ); border:none; border-radius:10px; font-size:14px; outline:none; } .btn-confirm[data-v-697ff8f3] { width:100%; background:var(--color-button ); color:white; border:none; padding:14px; border-radius:12px; font-weight:700; cursor:pointer; } @media (max-width:767px) { .modal-sheet[data-v-697ff8f3] { width:calc(100% - 32px); max-width:575px; } } @media (max-width:768px) { .search-wrapper[data-v-697ff8f3] { width:140px; } .search-hint[data-v-697ff8f3] { display:none; } .brick-grid[data-v-697ff8f3] { grid-template-columns:repeat(2,1fr); } .header-content[data-v-697ff8f3] { padding:0 15px; } } .transform-plan-page { min-height:100vh; color:#1f2933; background:linear-gradient(90deg,rgba(255,255,255,0.42) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,0.38) 1px,transparent 1px),radial-gradient(circle at 8% 8%,rgba(253,242,248,0.9),transparent 30rem),radial-gradient(circle at 88% 10%,rgba(246,240,255,0.92),transparent 34rem),radial-gradient(circle at 52% 88%,rgba(224,242,254,0.46),transparent 36rem),linear-gradient(135deg,#f8fafc 0%,#fff5f7 45%,#f6f0ff 100%); background-size:42px 42px,42px 42px,auto,auto,auto,auto; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; } .transform-shell { width:min(100% - 32px,1500px); margin:0 auto; padding:18px 0 64px; } .plan-topbar { display:grid; grid-template-columns:44px 1fr auto; align-items:center; gap:14px; margin-bottom:18px; } .back-button,.home-button,.module-actions button,.quick-actions button,.record-toolbar button,.floating-top,.banner-arrow,.banner-dots button,.stage-tabs button,.month-toggle,.choice-group button,.toggle-pill,.score-btn { border:0; cursor:pointer; font:inherit; transition:transform 0.2s ease,box-shadow 0.2s ease,background 0.2s ease,color 0.2s ease,border-color 0.2s ease; } .back-button { width:44px; height:44px; border-radius:16px; background:rgba(255,255,255,0.72); box-shadow:0 14px 36px rgba(148,163,184,0.18); } .back-button span { display:block; width:12px; height:12px; margin:0 auto; border-left:2px solid #334155; border-bottom:2px solid #334155; transform:rotate(45deg); } .logo-mark { width:112px; max-height:44px; -o-object-fit:contain; object-fit:contain; } .home-button,.module-actions button,.quick-actions button,.record-toolbar button,.floating-top { min-height:42px; padding:0 18px; border-radius:999px; color:#374151; background:rgba(255,255,255,0.78); box-shadow:0 14px 34px rgba(148,163,184,0.18); } .home-button:hover,.module-actions button:hover,.quick-actions button:hover,.record-toolbar button:hover,.floating-top:hover { transform:translateY(-1px); box-shadow:0 18px 42px rgba(148,163,184,0.24); } .record-toolbar button.primary,.quick-actions button:first-child,.weight-editor button { color:#fff; background:linear-gradient(135deg,#111827,#be185d 52%,#8b5cf6); } .plan-header,.module-panel { position:relative; overflow:hidden; border:1px solid rgba(255,255,255,0.78); border-radius:28px; background:linear-gradient(145deg,rgba(255,255,255,0.82),rgba(255,255,255,0.56)),rgba(255,255,255,0.66); box-shadow:0 24px 70px rgba(148,163,184,0.22); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .plan-header::before,.module-panel::before { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(135deg,rgba(255,255,255,0.46),transparent 28%,rgba(255,255,255,0.22)); } .plan-header > *,.module-panel > * { position:relative; z-index:1; } .plan-header { padding:18px; } .overview-hero { display:grid; grid-template-columns:minmax(400px,0.82fr) minmax(520px,1.18fr); gap:24px; align-items:stretch; } .overview-copy { display:flex; flex-direction:column; justify-content:center; padding:18px; } .eyebrow,.section-kicker { margin:0 0 8px; color:#be185d; font-size:0.76rem; font-weight:800; letter-spacing:0; text-transform:uppercase; } .overview-copy h1,.module-head h2 { margin:0; color:#111827; font-size:clamp(2rem,4vw,4.8rem); line-height:1.05; letter-spacing:0; } .module-head h2 { font-size:clamp(1.55rem,2.5vw,2.6rem); } .lead,.module-head p,.overview-copy p,.plan-card p,.notice-card p,.overview-card p { color:#64748b; line-height:1.75; } .weight-editor { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:24px; } .weight-editor label,.form-field { display:grid; gap:7px; color:#64748b; font-size:0.86rem; font-weight:700; } .weight-editor input,.form-field input,.form-field textarea { width:100%; box-sizing:border-box; border:1px solid rgba(203,213,225,0.92); border-radius:16px; outline:none; color:#111827; background:rgba(248,250,252,0.92); box-shadow:inset 0 1px 0 rgba(255,255,255,0.72); } .weight-editor input,.form-field input { min-height:44px; padding:0 14px; } .form-field textarea { min-height:96px; padding:12px 14px; resize:vertical; } .weight-editor input:focus,.form-field input:focus,.form-field textarea:focus { border-color:rgba(219,39,119,0.45); box-shadow:0 0 0 4px rgba(253,242,248,0.9); } .weight-editor button { min-height:44px; border:0; border-radius:16px; font-weight:800; } .banner-carousel { position:relative; overflow:hidden; min-height:100%; aspect-ratio:21/8.5; border-radius:26px; background:linear-gradient(135deg,#f8fafc,#fdf2f8); box-shadow:0 26px 70px rgba(15,23,42,0.18); } .banner-viewport,.banner-slide,.banner-slide img { width:100%; height:100%; } .banner-slide { position:absolute; inset:0; opacity:0; transform:scale(1.02); transition:opacity 0.45s ease,transform 0.65s ease; } .banner-slide.active { opacity:1; transform:scale(1); } .banner-slide img { display:block; -o-object-fit:cover; object-fit:cover; } .banner-slide.failed img { opacity:0; } .banner-slide.failed { background:linear-gradient(135deg,#fff1f2,#eef2ff); } .banner-shade { position:absolute; inset:0; background:linear-gradient(90deg,rgba(15,23,42,0.55),rgba(15,23,42,0.12),rgba(15,23,42,0)); } .banner-copy { position:absolute; left:28px; bottom:26px; width:min(460px,70%); color:#fff; } .banner-copy p,.banner-copy h2,.banner-copy span { margin:0; text-shadow:0 10px 24px rgba(15,23,42,0.32); } .banner-copy h2 { margin:6px 0; font-size:clamp(1.5rem,2.5vw,3.2rem); letter-spacing:0; } .banner-arrow { position:absolute; top:50%; z-index:2; width:42px; height:42px; border-radius:50%; color:#111827; background:rgba(255,255,255,0.78); transform:translateY(-50%); box-shadow:0 12px 32px rgba(15,23,42,0.18); } .banner-arrow.prev { left:14px; } .banner-arrow.next { right:14px; } .banner-dots { position:absolute; z-index:2; right:24px; bottom:22px; display:flex; gap:8px; } .banner-dots button { width:9px; height:9px; padding:0; border-radius:50%; background:rgba(255,255,255,0.58); } .banner-dots button.active { width:24px; border-radius:999px; background:#fff; } .overview-metrics,.record-summary-grid,.schedule-summary,.overview-grid,.ai-score-grid,.detail-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin-top:18px; } .overview-metrics article,.record-summary-grid article,.schedule-summary article,.overview-card,.ai-score-grid article,.detail-grid article { padding:16px; border-radius:20px; background:rgba(255,255,255,0.72); box-shadow:0 14px 34px rgba(148,163,184,0.14); } .overview-metrics span,.record-summary-grid span,.schedule-summary span,.overview-card span,.ai-score-grid span,.detail-grid span { display:block; color:#94a3b8; font-size:0.78rem; font-weight:800; } .overview-metrics strong,.record-summary-grid strong,.schedule-summary strong,.overview-card h3,.ai-score-grid strong,.detail-grid strong { display:block; margin-top:5px; color:#111827; font-size:1.35rem; letter-spacing:0; } .overview-progress { overflow:hidden; height:10px; margin-top:16px; border-radius:999px; background:rgba(226,232,240,0.88); } .overview-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#111827,#ec4899,#a78bfa); } .transform-layout { display:grid; grid-template-columns:260px minmax(0,1fr); gap:24px; margin-top:20px; align-items:start; } .plan-nav { position:sticky; top:14px; display:grid; gap:11px; max-height:calc(100vh - 28px); overflow:auto; padding:14px; border:1px solid rgba(255,255,255,0.72); border-radius:24px; background:rgba(255,255,255,0.72); box-shadow:0 18px 54px rgba(148,163,184,0.18); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .plan-nav button { display:grid; gap:4px; min-height:64px; padding:13px 15px; border:1px solid rgba(226,232,240,0.86); border-radius:18px; text-align:left; color:#475569; background:linear-gradient(135deg,rgba(255,255,255,0.92),rgba(248,250,252,0.72)); } .plan-nav button:hover { transform:translateX(2px); border-color:rgba(236,72,153,0.28); box-shadow:0 12px 26px rgba(148,163,184,0.16); } .plan-nav button.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,#111827,#be185d 55%,#8b5cf6); box-shadow:0 16px 36px rgba(190,24,93,0.22); } .plan-nav span { font-weight:900; } .plan-nav small { opacity:0.74; } .section-stage { min-width:0; } .module-panel { padding:24px; } .stacked-panels { display:grid; gap:20px; } .module-head { display:flex; justify-content:space-between; gap:20px; margin-bottom:20px; } .module-head > div:first-child { max-width:860px; } .module-actions { display:flex; flex-wrap:wrap; gap:10px; align-items:flex-start; justify-content:flex-end; } .status-badge { display:inline-flex; align-items:center; min-height:34px; padding:0 12px; border-radius:999px; color:#64748b; background:rgba(248,250,252,0.92); font-size:0.82rem; font-weight:800; } .status-badge.done,.history-card-top span.done { color:#047857; background:rgba(209,250,229,0.88); } .status-badge.warn { color:#9a3412; background:rgba(255,237,213,0.9); } .quick-actions { display:flex; flex-wrap:wrap; gap:12px; margin:18px 0; } .command-center { min-height:620px; } .console-actions button:first-child { color:#fff; background:linear-gradient(135deg,#111827,#be185d,#8b5cf6); } .console-grid { display:grid; grid-template-columns:minmax(360px,1.1fr) minmax(340px,0.95fr) minmax(300px,0.82fr); grid-template-areas:"primary today stage" "routes routes focus" "routes routes quick"; gap:16px; } .console-primary,.console-card { position:relative; overflow:hidden; min-width:0; padding:22px; border:1px solid rgba(226,232,240,0.72); border-radius:26px; background:linear-gradient(145deg,rgba(255,255,255,0.92),rgba(248,250,252,0.72)); box-shadow:0 18px 48px rgba(148,163,184,0.16); } .console-primary { grid-area:primary; color:#fff; background:radial-gradient(circle at 85% 16%,rgba(255,255,255,0.28),transparent 12rem),linear-gradient(135deg,#111827 0%,#4c1d95 48%,#be185d 100%); box-shadow:0 24px 64px rgba(76,29,149,0.24); } .today-command { grid-area:today; } .stage-preview { grid-area:stage; display:grid; grid-template-rows:auto 1fr; gap:14px; } .route-card { grid-area:routes; } .focus-card { grid-area:focus; } .quick-control { grid-area:quick; } .console-primary-top { display:flex; justify-content:space-between; gap:18px; } .console-label { display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:0 10px; border-radius:999px; color:#be185d; background:rgba(253,242,248,0.92); font-size:0.74rem; font-weight:900; text-transform:uppercase; letter-spacing:0; } .console-primary .console-label { color:#fff; background:rgba(255,255,255,0.16); } .console-primary h3,.console-card h3 { margin:14px 0 8px; color:#111827; font-size:clamp(1.3rem,1.65vw,2.2rem); line-height:1.15; } .console-primary h3,.console-primary p,.console-primary .console-stat-row span,.console-primary .console-stat-row b { color:#fff; } .console-primary p,.console-card p { margin:0; color:#64748b; line-height:1.7; } .console-primary > .console-primary-top > strong { font-size:clamp(3rem,4.6vw,5.6rem); line-height:0.9; letter-spacing:0; } .console-progress { overflow:hidden; height:12px; margin:28px 0 18px; border-radius:999px; background:rgba(255,255,255,0.22); } .console-progress span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#fff,#fbcfe8,#ddd6fe); } .console-stat-row { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; } .console-stat-row article { padding:12px; border-radius:18px; background:rgba(255,255,255,0.12); } .console-stat-row span,.console-stat-row b { display:block; } .console-stat-row span { font-size:0.76rem; opacity:0.76; } .console-stat-row b { margin-top:4px; font-size:1.25rem; } .command-list { display:grid; gap:10px; margin-top:16px; } .command-list section { display:grid; grid-template-columns:54px minmax(0,1fr); gap:10px; align-items:start; padding:12px; border-radius:18px; background:rgba(248,250,252,0.86); } .command-list b { color:#111827; } .command-list span { color:#64748b; line-height:1.55; } .stage-preview .image-frame { border-radius:20px; } .stage-preview .image-frame::before { aspect-ratio:16/11; } .console-route-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin-top:16px; } .console-route-grid button { display:grid; gap:5px; min-height:78px; padding:13px; border:1px solid rgba(226,232,240,0.78); border-radius:18px; text-align:left; color:#334155; background:rgba(248,250,252,0.84); } .console-route-grid button:hover { transform:translateY(-2px); color:#fff; border-color:transparent; background:linear-gradient(135deg,#111827,#be185d,#8b5cf6); box-shadow:0 16px 34px rgba(190,24,93,0.18); } .console-route-grid b,.console-route-grid span { display:block; } .console-route-grid span { color:inherit; opacity:0.72; font-size:0.78rem; } .quick-control .quick-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin-bottom:12px; } .quick-control .quick-actions button { min-height:44px; padding:0 12px; font-size:0.9rem; } .focus-card ul { margin-top:12px; } .stage-detail { display:grid; grid-template-columns:minmax(280px,0.48fr) minmax(0,1fr); gap:22px; align-items:stretch; } .stage-detail.compact { margin-top:10px; } .image-frame { position:relative; overflow:hidden; border-radius:24px; background:linear-gradient(135deg,#f8fafc,#fdf2f8); box-shadow:0 20px 52px rgba(15,23,42,0.14); } .image-frame::before { content:""; display:block; aspect-ratio:3/4; } .image-frame img { position:absolute; inset:0; width:100%; height:100%; -o-object-fit:cover; object-fit:cover; } .stage-copy,.record-card,.plan-card,.notice-card,.today-schedule-card,.month-card,.history-detail { padding:20px; border-radius:24px; background:rgba(255,255,255,0.76); box-shadow:0 18px 48px rgba(148,163,184,0.16); } .stage-copy h3,.record-card h3,.plan-card h3,.notice-card strong,.today-schedule-card h3 { margin:0 0 10px; color:#111827; } .stage-columns,.plan-card-grid,.reference-grid,.final-reference-grid,.product-grid,.stage-mini-grid,.scenario-grid,.weekday-grid,.today-task-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; } .stage-columns section,.scenario-grid article,.weekday-grid article,.today-task-grid article,.stage-mini-grid article,.product-card,.reference-card,.final-card { padding:16px; border-radius:20px; background:rgba(248,250,252,0.82); border:1px solid rgba(226,232,240,0.78); } .stage-columns h4,.detail-block h4 { margin:0 0 8px; color:#111827; } ul,ol { margin:0; padding-left:1.1rem; color:#475569; line-height:1.7; } .stage-tabs { display:flex; gap:10px; overflow-x:auto; padding:0 0 14px; } .stage-tabs button { min-width:148px; padding:13px 14px; border:1px solid rgba(226,232,240,0.86); border-radius:18px; color:#475569; background:rgba(248,250,252,0.82); } .stage-tabs button.active { color:#fff; background:linear-gradient(135deg,#111827,#be185d,#8b5cf6); } .stage-tabs button.current { border-color:rgba(236,72,153,0.48); } .record-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; } .record-card { min-width:0; } .card-heading,.history-card-top,.day-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:14px; } .form-row { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .form-row.compact { grid-template-columns:repeat(3,minmax(0,1fr)); } .form-field.wide { margin-top:12px; } .toggle-wrap { display:flex; flex-wrap:wrap; gap:10px; margin-top:14px; } .toggle-group { display:inline-flex; align-items:center; gap:8px; padding:8px; border-radius:18px; background:rgba(248,250,252,0.88); } .toggle-group > span { color:#64748b; font-size:0.82rem; font-weight:800; } .toggle-pill { min-height:36px; padding:0 12px; border:1px solid rgba(203,213,225,0.9); border-radius:999px; color:#64748b; background:rgba(255,255,255,0.8); } .toggle-pill.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,#be185d,#8b5cf6); box-shadow:0 12px 24px rgba(190,24,93,0.18); } .score-field-list { display:grid; gap:14px; margin-top:14px; } .score-field > span { display:block; margin-bottom:8px; color:#64748b; font-size:0.86rem; font-weight:800; } .score-buttons { display:flex; flex-wrap:wrap; gap:6px; } .score-btn { width:34px; height:34px; border:1px solid rgba(203,213,225,0.92); border-radius:12px; color:#64748b; background:rgba(255,255,255,0.86); } .score-btn.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,#111827,#be185d); } .choice-group { display:grid; gap:8px; margin-top:14px; color:#64748b; font-weight:800; } .choice-group div { display:flex; flex-wrap:wrap; gap:8px; } .choice-group button { min-height:36px; padding:0 12px; border-radius:999px; color:#475569; background:rgba(248,250,252,0.88); border:1px solid rgba(226,232,240,0.86); } .choice-group button.active { color:#fff; border-color:transparent; background:linear-gradient(135deg,#111827,#be185d); } .record-toolbar { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:18px; } .record-toast { display:inline-flex; align-items:center; min-height:38px; padding:0 12px; border-radius:999px; font-weight:800; } .record-toast.success { color:#047857; background:rgba(209,250,229,0.9); } .record-toast.error { color:#be123c; background:rgba(255,228,230,0.92); } .ai-panel { margin-top:16px; } .ai-metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin-top:14px; } .ai-metric-grid article { padding:12px; border-radius:16px; background:rgba(248,250,252,0.86); } .ai-metric-grid span,.ai-metric-grid b { display:block; } .ai-metric-grid span { color:#94a3b8; font-size:0.78rem; } .ai-analysis-list { display:grid; gap:12px; margin-top:14px; } .ai-analysis-list section,.detail-block { padding:14px; border-radius:16px; background:rgba(248,250,252,0.88); } .muted,.plan-card small,.history-card small,.day-card small { color:#64748b; } .history-layout { display:grid; grid-template-columns:minmax(0,0.95fr) minmax(320px,0.72fr); gap:16px; } .history-list { display:grid; gap:12px; max-height:70vh; overflow:auto; padding-right:4px; } .history-card { padding:16px; border:1px solid rgba(226,232,240,0.82); border-radius:20px; background:rgba(248,250,252,0.82); cursor:pointer; } .history-card.active { border-color:rgba(236,72,153,0.45); box-shadow:0 16px 34px rgba(236,72,153,0.14); } .history-card p,.history-card small { display:block; margin:6px 0 0; } .history-card-top span { padding:4px 8px; border-radius:999px; color:#64748b; background:rgba(226,232,240,0.8); font-size:0.76rem; font-weight:800; } .month-list { display:grid; gap:14px; margin-top:18px; } .month-toggle { display:flex; justify-content:space-between; width:100%; padding:0; color:#111827; background:transparent; text-align:left; } .month-toggle small { display:block; margin-top:4px; color:#64748b; } .day-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:16px; } .day-card { padding:16px; border-radius:18px; background:rgba(248,250,252,0.86); border:1px solid rgba(226,232,240,0.82); } .day-card.today { border-color:rgba(236,72,153,0.48); background:rgba(253,242,248,0.9); } .day-card.rest { background:rgba(240,253,244,0.72); } .day-card-top em { padding:4px 8px; border-radius:999px; color:#64748b; background:rgba(226,232,240,0.84); font-style:normal; font-size:0.76rem; font-weight:800; } .day-card li { margin-top:6px; } .day-card b { margin-right:8px; color:#111827; } .reference-card,.final-card { cursor:zoom-in; } .reference-card .image-frame::before,.final-card .image-frame::before { aspect-ratio:3/4; } .final-card ul { margin-top:12px; } .product-card span { display:inline-flex; padding:5px 9px; border-radius:999px; color:#be185d; background:rgba(253,242,248,0.95); font-size:0.76rem; font-weight:900; } .plan-card.featured,.overview-card.strong,.notice-card.soft { background:linear-gradient(135deg,rgba(255,255,255,0.9),rgba(253,242,248,0.78)); border:1px solid rgba(251,207,232,0.72); } .danger-soft { background:rgba(255,247,237,0.84); border:1px solid rgba(254,215,170,0.72); } .floating-top { position:fixed; right:22px; bottom:22px; z-index:8; } .image-preview { position:fixed; inset:0; z-index:20; display:grid; place-items:center; padding:24px; background:rgba(15,23,42,0.78); } .image-preview img { max-width:min(94vw,1100px); max-height:82vh; border-radius:24px; -o-object-fit:contain; object-fit:contain; box-shadow:0 30px 90px rgba(0,0,0,0.35); } .image-preview button { position:absolute; top:24px; right:24px; min-height:42px; padding:0 16px; border:0; border-radius:999px; color:#111827; background:#fff; } .image-preview p { margin:12px 0 0; color:#fff; } .loading-card { padding:24px; border-radius:22px; color:#64748b; background:rgba(248,250,252,0.84); } .transform-plan-page { color:#1d1d1f; background:#f5f5f7; background-image:none; background-size:auto; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; } .transform-shell { padding-top:24px; } .plan-header,.module-panel,.plan-nav,.stage-copy,.record-card,.plan-card,.notice-card,.today-schedule-card,.month-card,.history-detail,.console-primary,.console-card,.overview-metrics article,.record-summary-grid article,.schedule-summary article,.overview-card,.ai-score-grid article,.detail-grid article { border:1px solid #e5e5ea; background:#ffffff; box-shadow:0 18px 50px rgba(0,0,0,0.06); -webkit-backdrop-filter:none; backdrop-filter:none; } .plan-header::before,.module-panel::before { display:none; } .plan-header { padding:24px; } .module-panel { padding:30px; } .overview-copy h1,.module-head h2 { color:#1d1d1f; font-weight:800; } .eyebrow,.section-kicker,.console-label { color:#6e6e73; background:transparent; padding:0; min-height:auto; border-radius:0; font-size:0.72rem; font-weight:800; } .lead,.module-head p,.overview-copy p,.plan-card p,.notice-card p,.overview-card p,.console-card p,.console-primary p,.command-list span,.muted { color:#6e6e73; } .back-button,.home-button,.module-actions button,.quick-actions button,.record-toolbar button,.floating-top,.banner-arrow,.stage-tabs button,.choice-group button,.toggle-pill,.score-btn,.console-route-grid button,.weight-editor button { box-shadow:none; } .back-button,.home-button,.module-actions button,.quick-actions button,.record-toolbar button,.floating-top,.banner-arrow { color:#1d1d1f; border:1px solid #d2d2d7; background:#ffffff; } .home-button:hover,.module-actions button:hover,.quick-actions button:hover,.record-toolbar button:hover,.floating-top:hover,.back-button:hover,.banner-arrow:hover { transform:translateY(-1px); border-color:#86868b; background:#f5f5f7; box-shadow:none; } .record-toolbar button.primary,.quick-actions button:first-child,.weight-editor button,.console-actions button:first-child { color:#ffffff; border-color:#0071e3; background:#0071e3; } .record-toolbar button.primary:hover,.quick-actions button:first-child:hover,.weight-editor button:hover,.console-actions button:first-child:hover { background:#0077ed; border-color:#0077ed; } .weight-editor input,.form-field input,.form-field textarea { color:#1d1d1f; border:1px solid #d2d2d7; background:#fbfbfd; box-shadow:none; } .weight-editor input:focus,.form-field input:focus,.form-field textarea:focus { border-color:#0071e3; box-shadow:0 0 0 4px rgba(0,113,227,0.14); } .banner-carousel,.image-frame { background:#f5f5f7; box-shadow:0 18px 46px rgba(0,0,0,0.08); } .banner-slide.failed { background:#e8e8ed; } .banner-shade { background:rgba(0,0,0,0.18); } .banner-copy p,.banner-copy h2,.banner-copy span { text-shadow:0 6px 18px rgba(0,0,0,0.26); } .banner-dots button { background:rgba(255,255,255,0.56); } .banner-dots button.active { background:#ffffff; } .overview-progress,.console-progress { background:#e8e8ed; } .overview-progress span,.console-progress span { background:#0071e3; } .plan-nav { background:#ffffff; } .plan-nav button { color:#424245; border:1px solid transparent; background:#ffffff; } .plan-nav button:hover { transform:none; border-color:#d2d2d7; background:#f5f5f7; box-shadow:none; } .plan-nav button.active { color:#ffffff; border-color:#1d1d1f; background:#1d1d1f; box-shadow:none; } .status-badge { color:#424245; background:#f5f5f7; } .status-badge.done,.history-card-top span.done { color:#1d1d1f; background:#e8f3ea; } .status-badge.warn { color:#1d1d1f; background:#fff4d9; } .console-primary { color:#ffffff; border-color:#1d1d1f; background:#1d1d1f; box-shadow:0 22px 56px rgba(0,0,0,0.16); } .console-primary .console-label { color:#a1a1a6; } .console-primary .console-stat-row article { background:#2c2c2e; } .console-stat-row article,.command-list section,.stage-columns section,.scenario-grid article,.weekday-grid article,.today-task-grid article,.stage-mini-grid article,.product-card,.reference-card,.final-card,.ai-metric-grid article,.ai-analysis-list section,.detail-block,.day-card,.history-card { border:1px solid #e5e5ea; background:#fbfbfd; } .command-list b,.day-card b,.stage-columns h4,.detail-block h4,.console-card h3,.stage-copy h3,.record-card h3,.plan-card h3,.today-schedule-card h3 { color:#1d1d1f; } .console-route-grid button { color:#1d1d1f; border:1px solid #e5e5ea; background:#fbfbfd; } .console-route-grid button:hover { transform:translateY(-1px); color:#ffffff; border-color:#0071e3; background:#0071e3; box-shadow:none; } .quick-control .quick-actions button,.module-actions button,.record-toolbar button { font-weight:700; } .stage-tabs button,.choice-group button,.toggle-pill,.score-btn { color:#424245; border:1px solid #d2d2d7; background:#ffffff; } .stage-tabs button:hover,.choice-group button:hover,.toggle-pill:hover,.score-btn:hover { border-color:#86868b; background:#f5f5f7; } .stage-tabs button.active,.choice-group button.active,.toggle-pill.active,.score-btn.active { color:#ffffff; border-color:#1d1d1f; background:#1d1d1f; box-shadow:none; } .day-card.today { border-color:#0071e3; background:#f5f9ff; } .day-card.rest { background:#f7fbf8; } .day-card-top em,.history-card-top span { color:#424245; background:#e8e8ed; } .product-card span { color:#1d1d1f; background:#e8e8ed; } .plan-card.featured,.overview-card.strong,.notice-card.soft,.danger-soft { border:1px solid #e5e5ea; background:#ffffff; } .record-toast.success { color:#1d1d1f; background:#e8f3ea; } .record-toast.error { color:#1d1d1f; background:#fff0f0; } .image-preview { background:rgba(0,0,0,0.72); } .loading-card { color:#6e6e73; background:#fbfbfd; }:root { --tp-bg:#f5f5f7; --tp-surface:#ffffff; --tp-surface-soft:#fbfbfd; --tp-ink:#1d1d1f; --tp-ink-soft:#515154; --tp-muted:#86868b; --tp-line:#d9d9de; --tp-line-soft:#ececf0; --tp-blue:#0071e3; --tp-magenta:#ff2d55; --tp-yellow:#ffd60a; --tp-lime:#32d74b; --tp-orange:#ff9f0a; --tp-cyan:#00a7ff; } .transform-plan-page { color:var(--tp-ink ); background:var(--tp-bg ); } .transform-shell { padding-top:34px; } .plan-header,.module-panel { border-color:var(--tp-line-soft ); border-radius:34px; background:var(--tp-surface ); box-shadow:0 22px 70px rgba(0,0,0,0.055); } .plan-header { padding:28px; } .module-panel { padding:34px; } .overview-copy { padding:28px; } .overview-copy h1 { max-width:780px; color:var(--tp-ink ); font-size:clamp(3.1rem,5.2vw,6.4rem); font-weight:850; line-height:0.96; } .module-head h2 { color:var(--tp-ink ); font-size:clamp(2rem,3.1vw,3.8rem); font-weight:820; line-height:1; } .lead,.module-head p,.overview-copy p { max-width:767px; color:var(--tp-muted ); font-size:1.03rem; line-height:1.78; } .section-kicker,.eyebrow { color:var(--tp-muted ); font-size:0.73rem; letter-spacing:0.08em; } .overview-hero { gap:32px; } .banner-carousel { border:1px solid var(--tp-line-soft ); border-radius:30px; background:#e8e8ed; box-shadow:none; } .banner-shade { background:rgba(0,0,0,0.12); } .banner-copy h2 { font-weight:820; } .banner-arrow { color:var(--tp-ink ); border:1px solid rgba(255,255,255,0.72); background:rgba(255,255,255,0.9); } .weight-editor { gap:14px; } .weight-editor label,.form-field { color:var(--tp-ink-soft ); } .weight-editor input,.form-field input,.form-field textarea { min-height:48px; border-color:var(--tp-line ); border-radius:18px; background:var(--tp-surface-soft ); } .form-field textarea { min-height:108px; } .weight-editor input:focus,.form-field input:focus,.form-field textarea:focus { border-color:var(--tp-blue ); box-shadow:0 0 0 4px rgba(0,113,227,0.12); } .home-button,.module-actions button,.quick-actions button,.record-toolbar button,.floating-top,.weight-editor button,.console-route-grid button { min-height:46px; border:0; border-radius:999px; color:#ffffff; background:var(--tp-blue ); font-weight:800; box-shadow:none; } .home-button:hover,.module-actions button:hover,.quick-actions button:hover,.record-toolbar button:hover,.floating-top:hover,.weight-editor button:hover,.console-route-grid button:hover { transform:translateY(-1px); filter:brightness(0.96); box-shadow:none; } .module-actions button:nth-child(5n + 1),.record-toolbar button:nth-child(5n + 1),.quick-actions button:nth-child(5n + 1),.console-route-grid button:nth-child(5n + 1) { color:#ffffff; background:var(--tp-blue ); } .module-actions button:nth-child(5n + 2),.record-toolbar button:nth-child(5n + 2),.quick-actions button:nth-child(5n + 2),.console-route-grid button:nth-child(5n + 2) { color:#ffffff; background:var(--tp-magenta ); } .module-actions button:nth-child(5n + 3),.record-toolbar button:nth-child(5n + 3),.quick-actions button:nth-child(5n + 3),.console-route-grid button:nth-child(5n + 3) { color:#1d1d1f; background:var(--tp-yellow ); } .module-actions button:nth-child(5n + 4),.record-toolbar button:nth-child(5n + 4),.quick-actions button:nth-child(5n + 4),.console-route-grid button:nth-child(5n + 4) { color:#1d1d1f; background:var(--tp-lime ); } .module-actions button:nth-child(5n),.record-toolbar button:nth-child(5n),.quick-actions button:nth-child(5n),.console-route-grid button:nth-child(5n) { color:#1d1d1f; background:var(--tp-orange ); } .back-button { border:1px solid var(--tp-line ); background:var(--tp-surface ); } .back-button:hover { background:var(--tp-surface-soft ); } .plan-nav { gap:12px; padding:16px; border-color:var(--tp-line-soft ); border-radius:30px; background:var(--tp-surface ); box-shadow:0 18px 54px rgba(0,0,0,0.045); } .plan-nav button { position:relative; min-height:68px; padding:15px 16px 15px 19px; border:1px solid transparent; border-radius:22px; color:var(--tp-ink ); background:var(--tp-surface ); } .plan-nav button::before { content:""; position:absolute; top:15px; bottom:15px; left:9px; width:4px; border-radius:999px; background:var(--tp-line ); } .plan-nav button:nth-child(5n + 1)::before { background:var(--tp-blue ); } .plan-nav button:nth-child(5n + 2)::before { background:var(--tp-magenta ); } .plan-nav button:nth-child(5n + 3)::before { background:var(--tp-yellow ); } .plan-nav button:nth-child(5n + 4)::before { background:var(--tp-lime ); } .plan-nav button:nth-child(5n)::before { background:var(--tp-orange ); } .plan-nav button:hover { transform:none; border-color:var(--tp-line-soft ); background:var(--tp-surface-soft ); } .plan-nav button.active { color:#ffffff; border-color:var(--tp-ink ); background:var(--tp-ink ); } .plan-nav button.active::before { background:#ffffff; } .overview-metrics article,.record-summary-grid article,.schedule-summary article,.overview-card,.ai-score-grid article,.detail-grid article,.console-card,.stage-copy,.record-card,.plan-card,.notice-card,.today-schedule-card,.month-card,.history-detail { border-color:var(--tp-line-soft ); border-radius:28px; background:var(--tp-surface ); box-shadow:0 14px 42px rgba(0,0,0,0.042); } .console-grid { gap:20px; } .console-primary { border:0; border-radius:30px; background:var(--tp-ink ); box-shadow:0 26px 60px rgba(0,0,0,0.13); } .console-primary .console-label { color:#a1a1a6; } .console-label { color:var(--tp-muted ); letter-spacing:0.08em; } .console-card h3,.stage-copy h3,.record-card h3,.plan-card h3,.today-schedule-card h3,.overview-card h3 { color:var(--tp-ink ); font-weight:800; } .console-primary > .console-primary-top > strong { font-weight:850; } .console-progress { background:#2c2c2e; } .console-progress span,.overview-progress span { background:var(--tp-lime ); } .console-stat-row article { border:0; background:#2c2c2e; } .command-list section,.stage-columns section,.scenario-grid article,.weekday-grid article,.today-task-grid article,.stage-mini-grid article,.product-card,.reference-card,.final-card,.ai-metric-grid article,.ai-analysis-list section,.detail-block,.day-card,.history-card { border-color:var(--tp-line-soft ); border-radius:22px; background:var(--tp-surface-soft ); } .console-route-grid button { display:grid; align-content:center; min-height:86px; padding:16px; border-radius:22px; text-align:left; } .console-route-grid button span { opacity:0.8; } .stage-tabs button,.choice-group button,.toggle-pill,.score-btn { border:1px solid var(--tp-line ); border-radius:999px; color:var(--tp-ink ); background:var(--tp-surface ); } .score-btn { border-radius:14px; } .stage-tabs button:hover,.choice-group button:hover,.toggle-pill:hover,.score-btn:hover { border-color:var(--tp-muted ); background:var(--tp-surface-soft ); } .stage-tabs button.active,.choice-group button.active,.toggle-pill.active,.score-btn.active { color:#ffffff; border-color:var(--tp-blue ); background:var(--tp-blue ); } .toggle-group { background:var(--tp-surface-soft ); } .status-badge,.day-card-top em,.history-card-top span,.product-card span { color:var(--tp-ink ); background:#eeeeef; } .status-badge.done,.history-card-top span.done { background:#e5f8ea; } .status-badge.warn { background:#fff6d7; } .day-card.today { border-color:var(--tp-blue ); background:#f2f8ff; } .day-card.rest { background:#f4fbf6; } .record-toast.success { color:var(--tp-ink ); background:#e5f8ea; } .record-toast.error { color:var(--tp-ink ); background:#ffe8e8; } .plan-card.featured,.overview-card.strong,.notice-card.soft,.danger-soft { border-color:var(--tp-line-soft ); background:var(--tp-surface ); } .floating-top { background:var(--tp-magenta ); } @media (min-width:1537px) and (max-width:2559px) { .transform-shell { width:min(100% - 64px,1760px); } .transform-layout { grid-template-columns:280px minmax(0,1fr); gap:28px; } .overview-hero { grid-template-columns:minmax(460px,0.78fr) minmax(640px,1.22fr); } .record-grid,.stage-columns,.plan-card-grid,.reference-grid,.final-reference-grid,.product-grid,.stage-mini-grid,.scenario-grid,.weekday-grid,.today-task-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; } .overview-metrics,.record-summary-grid,.schedule-summary,.overview-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } .console-grid { grid-template-columns:minmax(430px,1.12fr) minmax(390px,0.95fr) minmax(340px,0.86fr); gap:20px; } .console-route-grid { grid-template-columns:repeat(5,minmax(0,1fr)); } } @media (min-width:1440px) { .transform-shell { width:min(100% - 112px,2160px); padding-bottom:96px; } .transform-layout { grid-template-columns:320px minmax(0,1fr); gap:36px; } .overview-hero { grid-template-columns:minmax(560px,0.76fr) minmax(760px,1.24fr); } .module-panel,.plan-header { padding:32px; border-radius:32px; } .record-grid,.stage-columns,.plan-card-grid,.reference-grid,.final-reference-grid,.product-grid,.stage-mini-grid,.scenario-grid,.weekday-grid,.today-task-grid,.day-list { grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; } .form-row.compact,.ai-metric-grid { grid-template-columns:repeat(4,minmax(0,1fr)); } .plan-nav button,.plan-card,.record-card,.notice-card { font-size:1.04rem; } .console-grid { grid-template-columns:minmax(520px,1.12fr) minmax(470px,0.96fr) minmax(420px,0.86fr); gap:24px; } .console-route-grid { grid-template-columns:repeat(5,minmax(0,1fr)); } .console-primary,.console-card { padding:28px; border-radius:30px; } } @media (max-width:1280px) { .transform-shell { width:min(100% - 24px,1180px); } .overview-hero,.stage-detail,.history-layout { grid-template-columns:1fr; } .banner-carousel { aspect-ratio:16/9; } .console-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:"primary primary" "today stage" "routes routes" "focus quick"; } .console-route-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } } @media (max-width:1024px) { .transform-layout { grid-template-columns:1fr; } .plan-nav { position:sticky; top:0; z-index:6; display:flex; overflow-x:auto; max-height:none; border-radius:20px; } .plan-nav button { min-width:138px; flex:0 0 auto; } .overview-metrics,.record-summary-grid,.schedule-summary,.overview-grid,.record-grid,.stage-columns,.plan-card-grid,.reference-grid,.final-reference-grid,.product-grid,.stage-mini-grid,.scenario-grid,.weekday-grid,.today-task-grid,.day-list,.ai-metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .module-head { display:grid; } .module-actions { justify-content:flex-start; } .console-grid { grid-template-columns:1fr; grid-template-areas:"primary" "today" "stage" "routes" "focus" "quick"; } .console-route-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:767px) { .transform-shell { width:min(100% - 18px,100%); padding-top:10px; padding-bottom:96px; } .plan-header,.module-panel { padding:16px; border-radius:22px; } .plan-topbar { grid-template-columns:42px 1fr auto; } .logo-mark { width:92px; } .overview-copy { padding:6px; } .overview-copy h1,.module-head h2 { font-size:2rem; } .weight-editor,.overview-metrics,.record-summary-grid,.schedule-summary,.overview-grid,.record-grid,.stage-columns,.plan-card-grid,.reference-grid,.final-reference-grid,.product-grid,.stage-mini-grid,.scenario-grid,.weekday-grid,.today-task-grid,.day-list,.ai-score-grid,.ai-metric-grid,.form-row,.form-row.compact { grid-template-columns:1fr; } .banner-carousel { aspect-ratio:16/10; border-radius:20px; } .banner-copy { left:18px; bottom:18px; width:calc(100% - 72px); } .banner-copy h2 { font-size:1.45rem; } .banner-arrow { width:36px; height:36px; } .stage-detail { gap:14px; } .console-primary,.console-card { padding:16px; border-radius:22px; } .console-stat-row,.console-route-grid,.quick-control .quick-actions { grid-template-columns:1fr; } .command-list section { grid-template-columns:1fr; } .record-toolbar.sticky-save-bar { position:fixed; left:10px; right:10px; bottom:10px; z-index:9; padding:10px; border:1px solid rgba(255,255,255,0.72); border-radius:20px; background:rgba(255,255,255,0.88); box-shadow:0 18px 54px rgba(15,23,42,0.18); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .record-toolbar button { flex:1 1 140px; min-height:42px; padding:0 12px; } .score-btn { width:36px; height:36px; } .floating-top { right:12px; bottom:86px; } }:root { --premium-bg:#f5f5f7; --premium-surface:#ffffff; --premium-surface-2:#fbfbfd; --premium-surface-3:#f1f1f4; --premium-text:#1d1d1f; --premium-text-2:#424245; --premium-muted:#86868b; --premium-line:#e6e6eb; --premium-line-2:#d2d2d7; --premium-blue:#0071e3; --premium-magenta:#ff2d55; --premium-yellow:#ffd60a; --premium-lime:#32d74b; --premium-orange:#ff9f0a; --premium-radius-xl:34px; --premium-radius-lg:26px; --premium-radius-md:18px; --premium-shadow:0 24px 70px rgba(0,0,0,0.055); --premium-shadow-soft:0 12px 38px rgba(0,0,0,0.045); } .transform-plan-page { color:var(--premium-text ); background:var(--premium-bg ); background-image:none; font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; -webkit-font-smoothing:antialiased; text-rendering:geometricPrecision; } .transform-shell { width:min(100% - 40px,1680px); padding:36px 0 88px; } .plan-header,.module-panel,.plan-nav { border:1px solid var(--premium-line ); background:var(--premium-surface ); box-shadow:var(--premium-shadow ); -webkit-backdrop-filter:none; backdrop-filter:none; } .plan-header,.module-panel { border-radius:var(--premium-radius-xl ); } .plan-header::before,.module-panel::before { display:none; } .plan-header { padding:32px; } .module-panel { padding:38px; } .overview-hero { grid-template-columns:minmax(420px,0.78fr) minmax(560px,1.22fr); gap:36px; } .overview-copy { padding:28px 24px 28px 10px; } .overview-copy h1 { max-width:840px; color:var(--premium-text ); font-size:clamp(3.4rem,5.4vw,6.8rem); font-weight:850; line-height:0.94; letter-spacing:0; } .module-head h2 { color:var(--premium-text ); font-size:clamp(2.1rem,3vw,3.7rem); font-weight:820; line-height:0.98; letter-spacing:0; } .lead,.module-head p,.overview-copy p,.console-card p,.plan-card p,.notice-card p,.overview-card p,.stage-copy p,.detail-block p { color:var(--premium-muted ); font-size:1rem; line-height:1.78; } .eyebrow,.section-kicker,.console-label { display:block; min-height:0; padding:0; color:var(--premium-muted ); background:transparent; font-size:0.72rem; font-weight:800; line-height:1.1; letter-spacing:0.08em; text-transform:uppercase; } .banner-carousel { border:1px solid var(--premium-line ); border-radius:32px; background:#e8e8ed; box-shadow:none; } .banner-slide img,.image-frame img { filter:saturate(0.96) contrast(1.02); } .banner-shade { background:rgba(0,0,0,0.14); } .banner-copy { left:34px; bottom:32px; } .banner-copy h2 { font-weight:820; letter-spacing:0; } .banner-arrow { border:0; color:var(--premium-text ); background:rgba(255,255,255,0.9); box-shadow:none; } .banner-dots button { background:rgba(255,255,255,0.52); } .banner-dots button.active { background:#ffffff; } .overview-metrics,.record-summary-grid,.schedule-summary,.overview-grid,.ai-score-grid,.detail-grid { gap:16px; } .overview-metrics article,.record-summary-grid article,.schedule-summary article,.overview-card,.ai-score-grid article,.detail-grid article,.console-card,.stage-copy,.record-card,.plan-card,.notice-card,.today-schedule-card,.month-card,.history-detail { border:1px solid var(--premium-line ); border-radius:var(--premium-radius-lg ); background:var(--premium-surface ); box-shadow:var(--premium-shadow-soft ); } .overview-metrics article,.record-summary-grid article,.schedule-summary article,.overview-card,.ai-score-grid article,.detail-grid article { padding:20px; } .overview-metrics span,.record-summary-grid span,.schedule-summary span,.overview-card span,.ai-score-grid span,.detail-grid span,.ai-metric-grid span { color:var(--premium-muted ); font-size:0.76rem; font-weight:800; letter-spacing:0.02em; } .overview-metrics strong,.record-summary-grid strong,.schedule-summary strong,.overview-card h3,.ai-score-grid strong,.detail-grid strong { color:var(--premium-text ); font-weight:800; letter-spacing:0; } .overview-progress,.console-progress { height:10px; background:var(--premium-surface-3 ); } .overview-progress span,.console-progress span { background:var(--premium-lime ); } .transform-layout { grid-template-columns:292px minmax(0,1fr); gap:30px; margin-top:30px; } .plan-nav { top:18px; gap:10px; padding:16px; border-radius:30px; } .plan-nav button { position:relative; min-height:68px; padding:15px 18px 15px 22px; border:1px solid transparent; border-radius:22px; color:var(--premium-text ); background:var(--premium-surface ); box-shadow:none; } .plan-nav button::before { content:""; position:absolute; top:16px; bottom:16px; left:10px; width:4px; border-radius:999px; background:var(--premium-line-2 ); } .plan-nav button:nth-child(5n + 1)::before { background:var(--premium-blue ); } .plan-nav button:nth-child(5n + 2)::before { background:var(--premium-magenta ); } .plan-nav button:nth-child(5n + 3)::before { background:var(--premium-yellow ); } .plan-nav button:nth-child(5n + 4)::before { background:var(--premium-lime ); } .plan-nav button:nth-child(5n)::before { background:var(--premium-orange ); } .plan-nav button:hover { border-color:var(--premium-line ); background:var(--premium-surface-2 ); transform:none; } .plan-nav button.active { color:#ffffff; border-color:var(--premium-text ); background:var(--premium-text ); } .plan-nav button.active::before { background:#ffffff; } .plan-nav span { font-weight:800; } .plan-nav small { color:inherit; opacity:0.64; } .module-head { margin-bottom:28px; } .module-head > div:first-child { max-width:991px; } .console-grid { gap:20px; } .console-primary { border:0; border-radius:32px; background:var(--premium-text ); box-shadow:0 28px 70px rgba(0,0,0,0.16); } .console-primary h3,.console-primary p,.console-primary .console-stat-row span,.console-primary .console-stat-row b { color:#ffffff; } .console-primary .console-label { color:#a1a1a6; } .console-primary > .console-primary-top > strong { font-weight:850; letter-spacing:0; } .console-stat-row article { border:0; background:#2c2c2e; } .console-card { padding:24px; } .console-card h3,.stage-copy h3,.record-card h3,.plan-card h3,.notice-card strong,.today-schedule-card h3,.history-detail h3,.final-card h3,.reference-card h3,.product-card h3 { color:var(--premium-text ); font-weight:800; letter-spacing:0; } .command-list { gap:12px; } .command-list section,.stage-columns section,.scenario-grid article,.weekday-grid article,.today-task-grid article,.stage-mini-grid article,.product-card,.reference-card,.final-card,.ai-metric-grid article,.ai-analysis-list section,.detail-block,.day-card,.history-card { border:1px solid var(--premium-line ); border-radius:22px; background:var(--premium-surface-2 ); box-shadow:none; } .command-list section { grid-template-columns:64px minmax(0,1fr); } .command-list b,.day-card b,.stage-columns h4,.detail-block h4 { color:var(--premium-text ); font-weight:800; } .console-route-grid { gap:12px; } .console-route-grid button,.module-actions button,.quick-actions button,.record-toolbar button,.weight-editor button,.home-button,.floating-top { min-height:46px; border:0; border-radius:999px; color:#ffffff; background:var(--premium-blue ); font-weight:800; box-shadow:none; } .console-route-grid button { min-height:86px; padding:16px; border-radius:24px; text-align:left; } .console-route-grid button:hover,.module-actions button:hover,.quick-actions button:hover,.record-toolbar button:hover,.weight-editor button:hover,.home-button:hover,.floating-top:hover { filter:brightness(0.96); transform:translateY(-1px); box-shadow:none; } .console-route-grid button:nth-child(5n + 1),.module-actions button:nth-child(5n + 1),.quick-actions button:nth-child(5n + 1),.record-toolbar button:nth-child(5n + 1) { color:#ffffff; background:var(--premium-blue ); } .console-route-grid button:nth-child(5n + 2),.module-actions button:nth-child(5n + 2),.quick-actions button:nth-child(5n + 2),.record-toolbar button:nth-child(5n + 2) { color:#ffffff; background:var(--premium-magenta ); } .console-route-grid button:nth-child(5n + 3),.module-actions button:nth-child(5n + 3),.quick-actions button:nth-child(5n + 3),.record-toolbar button:nth-child(5n + 3) { color:var(--premium-text ); background:var(--premium-yellow ); } .console-route-grid button:nth-child(5n + 4),.module-actions button:nth-child(5n + 4),.quick-actions button:nth-child(5n + 4),.record-toolbar button:nth-child(5n + 4) { color:var(--premium-text ); background:var(--premium-lime ); } .console-route-grid button:nth-child(5n),.module-actions button:nth-child(5n),.quick-actions button:nth-child(5n),.record-toolbar button:nth-child(5n) { color:var(--premium-text ); background:var(--premium-orange ); } .back-button,.banner-arrow,.image-preview button { color:var(--premium-text ); border:1px solid var(--premium-line-2 ); background:var(--premium-surface ); box-shadow:none; } .back-button:hover,.banner-arrow:hover,.image-preview button:hover { background:var(--premium-surface-2 ); transform:none; } .weight-editor { gap:14px; max-width:720px; } .weight-editor label,.form-field,.score-field > span,.choice-group,.toggle-group > span { color:var(--premium-text-2 ); font-weight:700; } .weight-editor input,.form-field input,.form-field textarea { min-height:48px; border:1px solid var(--premium-line-2 ); border-radius:var(--premium-radius-md ); color:var(--premium-text ); background:var(--premium-surface-2 ); box-shadow:none; } .form-field textarea { min-height:108px; } .weight-editor input:focus,.form-field input:focus,.form-field textarea:focus { border-color:var(--premium-blue ); box-shadow:0 0 0 4px rgba(0,113,227,0.12); } .record-grid { gap:18px; } .record-card { padding:24px; } .card-heading { margin-bottom:18px; } .toggle-group { background:var(--premium-surface-2 ); } .stage-tabs button,.choice-group button,.toggle-pill,.score-btn { border:1px solid var(--premium-line-2 ); color:var(--premium-text ); background:var(--premium-surface ); box-shadow:none; } .score-btn { border-radius:14px; } .stage-tabs button:hover,.choice-group button:hover,.toggle-pill:hover,.score-btn:hover { border-color:var(--premium-muted ); background:var(--premium-surface-2 ); } .stage-tabs button.active,.choice-group button.active,.toggle-pill.active,.score-btn.active { color:#ffffff; border-color:var(--premium-blue ); background:var(--premium-blue ); } .stage-tabs button.current:not(.active) { border-color:var(--premium-blue ); } .stage-detail { gap:26px; } .image-frame { border:1px solid var(--premium-line ); border-radius:28px; background:#e8e8ed; box-shadow:none; } .stage-preview .image-frame,.reference-card .image-frame,.final-card .image-frame { border-radius:24px; } .history-layout { gap:18px; } .history-card { transition:border-color 0.2s ease,background 0.2s ease; } .history-card:hover,.history-card.active { border-color:var(--premium-blue ); background:#f2f8ff; box-shadow:none; } .status-badge,.day-card-top em,.history-card-top span,.product-card span { color:var(--premium-text ); background:#eeeeef; } .status-badge.done,.history-card-top span.done { background:#e5f8ea; } .status-badge.warn { background:#fff6d7; } .day-card.today { border-color:var(--premium-blue ); background:#f2f8ff; } .day-card.rest { background:#f4fbf6; } .month-toggle { color:var(--premium-text ); } .month-toggle small,.history-card small,.day-card small,.plan-card small,.muted,.ai-metric-grid span { color:var(--premium-muted ); } .plan-card.featured,.overview-card.strong,.notice-card.soft,.danger-soft { border-color:var(--premium-line ); background:var(--premium-surface ); } .notice-card,.today-schedule-card { margin-top:18px; } .record-toast { border-radius:999px; } .record-toast.success { color:var(--premium-text ); background:#e5f8ea; } .record-toast.error { color:var(--premium-text ); background:#ffe8e8; } .floating-top { background:var(--premium-magenta ); } .image-preview { background:rgba(0,0,0,0.72); } .image-preview img { border-radius:28px; box-shadow:0 28px 80px rgba(0,0,0,0.35); } .loading-card { color:var(--premium-muted ); background:var(--premium-surface-2 ); } @media (min-width:1537px) and (max-width:2559px) { .transform-shell { width:min(100% - 72px,1840px); } .transform-layout { grid-template-columns:310px minmax(0,1fr); gap:34px; } .overview-hero { grid-template-columns:minmax(520px,0.78fr) minmax(700px,1.22fr); } .console-grid { grid-template-columns:minmax(460px,1.08fr) minmax(420px,0.96fr) minmax(360px,0.86fr); gap:22px; } } @media (min-width:1440px) { .transform-shell { width:min(100% - 120px,2160px); } .transform-layout { grid-template-columns:340px minmax(0,1fr); gap:40px; } .overview-hero { grid-template-columns:minmax(620px,0.76fr) minmax(860px,1.24fr); } .plan-header,.module-panel { padding:44px; border-radius:40px; } .console-grid { grid-template-columns:minmax(560px,1.08fr) minmax(500px,0.96fr) minmax(440px,0.86fr); gap:26px; } } @media (max-width:1280px) { .transform-shell { width:min(100% - 28px,1180px); } .overview-hero,.stage-detail,.history-layout { grid-template-columns:1fr; } .console-grid { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-areas:"primary primary" "today stage" "routes routes" "focus quick"; } } @media (max-width:1024px) { .transform-layout { grid-template-columns:1fr; } .plan-nav { position:sticky; top:0; display:flex; overflow-x:auto; max-height:none; } .plan-nav button { min-width:150px; flex:0 0 auto; } .console-grid { grid-template-columns:1fr; grid-template-areas:"primary" "today" "stage" "routes" "focus" "quick"; } .console-route-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:767px) { .transform-shell { width:min(100% - 18px,100%); padding-top:14px; padding-bottom:104px; } .plan-header,.module-panel { padding:18px; border-radius:26px; } .overview-copy { padding:8px 2px 12px; } .overview-copy h1,.module-head h2 { font-size:2.15rem; letter-spacing:0; } .lead,.module-head p,.overview-copy p { font-size:0.96rem; } .overview-metrics,.record-summary-grid,.schedule-summary,.overview-grid,.record-grid,.stage-columns,.plan-card-grid,.reference-grid,.final-reference-grid,.product-grid,.stage-mini-grid,.scenario-grid,.weekday-grid,.today-task-grid,.day-list,.ai-score-grid,.ai-metric-grid,.form-row,.form-row.compact,.console-stat-row,.console-route-grid,.quick-control .quick-actions { grid-template-columns:1fr; } .console-primary,.console-card,.record-card,.plan-card,.notice-card,.today-schedule-card,.month-card,.history-detail { padding:18px; border-radius:24px; } .command-list section { grid-template-columns:1fr; } .record-toolbar.sticky-save-bar { border:1px solid var(--premium-line ); background:rgba(255,255,255,0.94); box-shadow:0 18px 48px rgba(0,0,0,0.12); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); } } .local-reader-page[data-v-664e9644] { min-height:100vh; padding:clamp(18px,3vw,42px); box-sizing:border-box; background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); color:var(--color-text ); font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; } .reader-hero[data-v-664e9644],.reader-workspace[data-v-664e9644] { width:min(100%,1480px); margin:0 auto; } .reader-hero[data-v-664e9644] { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(320px,0.85fr); gap:clamp(18px,2.2vw,34px); align-items:stretch; margin-top:clamp(24px,4vw,54px); } .hero-copy[data-v-664e9644],.drop-zone[data-v-664e9644],.side-card[data-v-664e9644],.standard-panel[data-v-664e9644],.empty-reader[data-v-664e9644],.search-results[data-v-664e9644] { border:1px solid var(--color-border ); background:rgba(255,255,255,0.86); box-shadow:0 24px 70px var(--color-shadow ); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-copy[data-v-664e9644] { min-height:250px; padding:clamp(30px,5vw,72px); border-radius:34px; } .eyebrow[data-v-664e9644],.panel-toolbar span[data-v-664e9644],.drawer-head span[data-v-664e9644] { display:inline-flex; color:var(--color-text-soft ); font-size:12px; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; } .hero-copy h1[data-v-664e9644] { margin:14px 0 18px; color:var(--color-text ); font-size:clamp(42px,7vw,92px); line-height:1.05; letter-spacing:0; } .hero-copy p[data-v-664e9644] { max-width:720px; margin:0; color:var(--color-text-soft ); font-size:clamp(16px,1.4vw,20px); line-height:1.8; } .hero-actions[data-v-664e9644],.toolbar-actions[data-v-664e9644],.reader-pills[data-v-664e9644],.chapter-nav[data-v-664e9644],.search-row[data-v-664e9644] { display:flex; flex-wrap:wrap; gap:10px; align-items:center; } .hero-actions[data-v-664e9644] { margin-top:32px; } .primary-upload input[data-v-664e9644] { display:none; } .primary-upload[data-v-664e9644],.ghost-button[data-v-664e9644],.mode-button[data-v-664e9644],.side-title-row button[data-v-664e9644],.panel-toolbar button[data-v-664e9644],.toolbar-actions button[data-v-664e9644],.chapter-nav button[data-v-664e9644],.reader-pills button[data-v-664e9644],.search-row button[data-v-664e9644],.load-more[data-v-664e9644],.novel-topbar button[data-v-664e9644],.drawer-head button[data-v-664e9644] { border:0; border-radius:999px; min-height:42px; padding:0 18px; color:var(--color-text ); background:var(--color-bg-soft ); font-weight:800; cursor:pointer; transition:transform 0.18s ease,background 0.18s ease,color 0.18s ease,box-shadow 0.18s ease; } .primary-upload[data-v-664e9644] { display:inline-flex; align-items:center; justify-content:center; color:#ffffff; background:#111111; box-shadow:0 14px 32px rgba(17,17,17,0.16); } .ghost-button[data-v-664e9644] { background:#ffffff; border:1px solid rgba(20,20,20,0.1); } button[data-v-664e9644]:hover,.primary-upload[data-v-664e9644]:hover { transform:translateY(-1px); } button[data-v-664e9644]:disabled { cursor:not-allowed; opacity:0.42; transform:none; } .drop-zone[data-v-664e9644] { display:flex; flex-direction:column; justify-content:flex-end; min-height:250px; padding:30px; border-radius:34px; background:linear-gradient(180deg,rgba(18,18,18,0.08),rgba(18,18,18,0.02)),#ffffff; } .drop-zone.dragging[data-v-664e9644] { border-color:#111111; background:#f8f7f4; } .drop-zone strong[data-v-664e9644] { color:#111111; font-size:clamp(24px,3vw,42px); line-height:1.08; letter-spacing:0; } .drop-zone span[data-v-664e9644],.drop-zone small[data-v-664e9644] { margin-top:10px; color:#66615a; } .parse-progress[data-v-664e9644] { overflow:hidden; height:7px; margin-top:22px; border-radius:999px; background:#e6e0d8; } .parse-progress i[data-v-664e9644] { display:block; height:100%; border-radius:inherit; background:#111111; } .message-strip[data-v-664e9644] { width:min(100%,1480px); margin:18px auto 0; padding:14px 18px; border-radius:18px; background:#fff9e8; color:#765b16; font-weight:700; } .message-strip.error[data-v-664e9644] { background:#fff1f0; color:#9f2d22; } .reader-workspace[data-v-664e9644] { display:grid; grid-template-columns:280px minmax(0,1fr); gap:clamp(18px,2vw,30px); margin-top:24px; } .reader-sidebar[data-v-664e9644] { position:sticky; top:24px; align-self:start; display:grid; gap:16px; max-height:calc(100vh - 48px); overflow:auto; padding-right:2px; min-width:0; } .side-card[data-v-664e9644] { padding:18px; border-radius:26px; } .side-card h2[data-v-664e9644] { margin:0 0 14px; font-size:18px; letter-spacing:0; } .mode-button[data-v-664e9644] { display:flex; width:100%; min-height:62px; flex-direction:column; align-items:flex-start; justify-content:center; gap:4px; margin-top:8px; border-radius:18px; background:#f7f5f1; text-align:left; } .mode-button.active[data-v-664e9644] { color:#ffffff; background:#191919; box-shadow:0 14px 34px rgba(17,17,17,0.18); } .mode-button small[data-v-664e9644] { color:inherit; opacity:0.68; font-weight:600; } .side-title-row[data-v-664e9644] { display:flex; align-items:center; justify-content:space-between; gap:12px; } .side-title-row button[data-v-664e9644] { min-height:32px; padding:0 12px; background:#eeeae2; font-size:12px; } .recent-list[data-v-664e9644],.mini-toc[data-v-664e9644],.toc-list[data-v-664e9644],.bookmark-list[data-v-664e9644] { display:grid; gap:8px; } .recent-item[data-v-664e9644],.mini-toc button[data-v-664e9644],.toc-list button[data-v-664e9644],.bookmark-list button[data-v-664e9644],.search-result[data-v-664e9644] { display:grid; gap:4px; width:100%; border:0; border-radius:16px; padding:12px; background:#f8f6f2; color:#1d1d1f; text-align:left; cursor:pointer; } .recent-item span[data-v-664e9644],.recent-item small[data-v-664e9644],.search-result small[data-v-664e9644] { color:#77716a; font-size:12px; } .mini-toc button.active[data-v-664e9644],.toc-list button.active[data-v-664e9644] { color:#ffffff; background:#111111; } .empty-copy[data-v-664e9644] { color:#77716a; line-height:1.7; } .reader-main[data-v-664e9644] { min-width:0; } .empty-reader[data-v-664e9644] { display:grid; place-items:center; min-height:560px; border-radius:34px; text-align:center; } .empty-reader > div[data-v-664e9644] { max-width:520px; padding:30px; } .empty-icon[data-v-664e9644] { display:inline-flex; align-items:center; justify-content:center; width:88px; height:88px; border-radius:28px; background:#111111; color:#ffffff; font-weight:900; letter-spacing:0.08em; } .empty-reader h2[data-v-664e9644] { margin:24px 0 12px; font-size:clamp(30px,4vw,52px); letter-spacing:0; } .empty-reader p[data-v-664e9644] { color:#645f58; line-height:1.8; } .inline-upload[data-v-664e9644] { margin-top:18px; } .novel-mode[data-v-664e9644] { min-height:calc(100vh - 160px); } .novel-shell[data-v-664e9644] { position:relative; overflow:hidden; min-height:calc(100vh - 150px); border-radius:34px; background:#f4efe6; box-shadow:0 30px 90px rgba(30,30,30,0.12); } .novel-theme-eye .novel-shell[data-v-664e9644] { background:#edf1e4; } .novel-theme-night .novel-shell[data-v-664e9644] { background:#1f211f; } .novel-topbar[data-v-664e9644],.novel-bottombar[data-v-664e9644] { position:absolute; left:16px; right:16px; z-index:6; display:flex; align-items:center; justify-content:space-between; gap:14px; border-radius:24px; border:1px solid rgba(17,17,17,0.08); background:rgba(255,255,255,0.88); box-shadow:0 18px 50px rgba(17,17,17,0.12); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .novel-topbar[data-v-664e9644] { top:16px; padding:12px; } .novel-topbar div[data-v-664e9644] { display:grid; gap:2px; min-width:0; text-align:center; } .novel-topbar strong[data-v-664e9644],.novel-topbar span[data-v-664e9644] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .novel-topbar span[data-v-664e9644] { color:#77716a; font-size:12px; } .novel-bottombar[data-v-664e9644] { bottom:16px; display:grid; grid-template-columns:1fr; padding:14px; } .chapter-nav[data-v-664e9644] { justify-content:space-between; } .chapter-nav span[data-v-664e9644] { color:#111111; font-weight:900; } .reader-controls[data-v-664e9644] { display:grid; grid-template-columns:repeat(3,1fr); gap:12px; } .reader-controls label[data-v-664e9644] { display:grid; gap:6px; color:#5f5a53; font-size:12px; font-weight:800; } .reader-controls input[data-v-664e9644] { width:100%; accent-color:#111111; } .reader-pills button.active[data-v-664e9644],.toolbar-actions button.active[data-v-664e9644] { color:#ffffff; background:#111111; } .novel-search[data-v-664e9644] { display:flex; gap:10px; align-items:center; } .novel-search input[data-v-664e9644] { flex:1; min-height:42px; min-width:180px; border:1px solid rgba(20,20,20,0.1); border-radius:999px; padding:0 14px; background:#ffffff; outline:0; } .novel-viewport[data-v-664e9644] { overflow:auto; height:calc(100vh - 150px); min-height:680px; max-width:860px; margin:0 auto; padding:clamp(76px,10vh,132px) clamp(26px,5vw,70px) clamp(126px,17vh,180px); box-sizing:border-box; color:#2e2924; scrollbar-width:thin; } .novel-theme-night .novel-viewport[data-v-664e9644] { color:#ddd8ce; } .novel-viewport.paged[data-v-664e9644] { scroll-snap-type:y mandatory; } .novel-viewport.paged p[data-v-664e9644],.novel-viewport.paged h2[data-v-664e9644] { scroll-snap-align:start; } .novel-viewport h2[data-v-664e9644] { margin:0 0 1.4em; color:inherit; font-size:1.55em; letter-spacing:0; } .novel-viewport p[data-v-664e9644] { margin:0 0 var(--paragraph-spacing ); text-align:justify; word-break:break-word; } .inline-loading[data-v-664e9644],.partial-tip[data-v-664e9644],.sheet-summary[data-v-664e9644] { margin-top:18px; padding:12px 14px; border-radius:16px; background:rgba(17,17,17,0.06); color:#68625a; font-weight:700; } .reader-chrome-enter-active[data-v-664e9644],.reader-chrome-leave-active[data-v-664e9644],.drawer-enter-active[data-v-664e9644],.drawer-leave-active[data-v-664e9644] { transition:opacity 0.22s ease,transform 0.22s ease; } .reader-chrome-enter[data-v-664e9644],.reader-chrome-leave-to[data-v-664e9644] { opacity:0; transform:translateY(8px); } .reader-drawer[data-v-664e9644] { position:fixed; inset:0; z-index:1100; display:flex; justify-content:flex-end; background:rgba(17,17,17,0.32); } .drawer-enter[data-v-664e9644],.drawer-leave-to[data-v-664e9644] { opacity:0; } .drawer-panel[data-v-664e9644] { width:min(420px,92vw); height:100%; padding:24px; box-sizing:border-box; background:#f8f7f4; overflow:auto; box-shadow:-18px 0 60px rgba(0,0,0,0.16); } .drawer-head[data-v-664e9644] { display:flex; align-items:center; justify-content:space-between; margin-bottom:18px; } .drawer-head h3[data-v-664e9644] { margin:4px 0 0; font-size:28px; letter-spacing:0; } .toc-list button[data-v-664e9644] { grid-template-columns:1fr auto; align-items:center; } .bookmark-list[data-v-664e9644] { margin-top:24px; } .bookmark-list h4[data-v-664e9644] { margin:0 0 10px; } .standard-panel[data-v-664e9644] { overflow:hidden; min-height:640px; border-radius:34px; } .panel-toolbar[data-v-664e9644] { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:22px; border-bottom:1px solid rgba(20,20,20,0.08); } .panel-toolbar h2[data-v-664e9644] { margin:4px 0 0; font-size:clamp(24px,2.6vw,40px); line-height:1.08; letter-spacing:0; } .toolbar-actions select[data-v-664e9644],.toolbar-actions input[data-v-664e9644],.search-row input[data-v-664e9644] { min-height:42px; border:1px solid rgba(20,20,20,0.1); border-radius:999px; padding:0 14px; background:#ffffff; color:#111111; outline:0; } .document-viewer[data-v-664e9644] { overflow:auto; min-height:720px; padding:20px; background:#e8e6e1; } .document-viewer iframe[data-v-664e9644] { width:100%; min-height:720px; border:0; border-radius:18px; background:#ffffff; transform-origin:top center; } .document-text-preview[data-v-664e9644] { max-width:900px; margin:0 auto; padding:28px; border-radius:24px; background:#ffffff; color:#222222; } .document-text-preview pre[data-v-664e9644] { overflow:auto; white-space:pre-wrap; line-height:1.7; } .table-scroll[data-v-664e9644] { overflow:auto; max-height:720px; margin:18px; border:1px solid rgba(20,20,20,0.08); border-radius:22px; background:#ffffff; } .table-scroll table[data-v-664e9644] { width:100%; border-collapse:separate; border-spacing:0; font-size:13px; } .table-scroll th[data-v-664e9644],.table-scroll td[data-v-664e9644] { max-width:260px; min-width:120px; padding:11px 12px; border-bottom:1px solid #ece8e1; border-right:1px solid #ece8e1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .table-scroll th[data-v-664e9644] { position:sticky; top:0; z-index:2; background:#f6f3ed; color:#33302d; text-align:left; } .load-more[data-v-664e9644] { margin:0 18px 22px; } .search-row[data-v-664e9644] { padding:18px 22px 0; } .search-row input[data-v-664e9644] { flex:1 1 320px; border-radius:18px; } .text-viewer[data-v-664e9644],.markdown-preview[data-v-664e9644] { overflow:auto; min-height:640px; max-height:74vh; margin:18px; padding:20px; border-radius:24px; background:#171717; color:#eeeeee; font-family:"SFMono-Regular",Consolas,"Liberation Mono",Menlo,monospace; font-size:14px; line-height:1.72; } .markdown-preview[data-v-664e9644] { max-width:900px; margin-left:auto; margin-right:auto; background:#ffffff; color:#1e1e1e; font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC",sans-serif; } .markdown-preview h1[data-v-664e9644],.markdown-preview h2[data-v-664e9644],.markdown-preview h3[data-v-664e9644] { letter-spacing:0; } .text-line[data-v-664e9644] { display:grid; grid-template-columns:auto minmax(0,1fr); gap:16px; min-height:24px; } .line-no[data-v-664e9644] { min-width:46px; color:rgba(255,255,255,0.35); text-align:right; -webkit-user-select:none; -moz-user-select:none; user-select:none; } .text-line code[data-v-664e9644] { white-space:pre; } .text-viewer.wrap .text-line code[data-v-664e9644] { white-space:pre-wrap; word-break:break-word; } .text-line code.hit[data-v-664e9644] { background:#fff3a6; color:#111111; } .search-results[data-v-664e9644] { margin-top:18px; padding:18px; border-radius:26px; } .result-head[data-v-664e9644] { display:flex; align-items:center; justify-content:space-between; margin-bottom:12px; } .result-head button[data-v-664e9644] { border:0; border-radius:999px; padding:8px 12px; background:#eeeae2; cursor:pointer; } @media (min-width:1440px) { .reader-hero[data-v-664e9644],.reader-workspace[data-v-664e9644] { width:min(100%,1660px); } .reader-workspace[data-v-664e9644] { grid-template-columns:320px minmax(0,1fr); } .novel-viewport[data-v-664e9644] { max-width:991px; } } @media (min-width:1440px) { .reader-hero[data-v-664e9644],.reader-workspace[data-v-664e9644] { width:min(100%,1920px); } .reader-workspace[data-v-664e9644] { grid-template-columns:360px minmax(0,1fr); } .local-reader-page[data-v-664e9644] { font-size:18px; } } @media (max-width:1199px) { .reader-hero[data-v-664e9644],.reader-workspace[data-v-664e9644] { grid-template-columns:1fr; } .reader-sidebar[data-v-664e9644] { position:static; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); max-height:none; overflow:visible; } } @media (max-width:767px) { .local-reader-page[data-v-664e9644] { padding:14px; } .hero-copy[data-v-664e9644],.drop-zone[data-v-664e9644],.standard-panel[data-v-664e9644],.empty-reader[data-v-664e9644],.novel-shell[data-v-664e9644] { border-radius:24px; } .reader-sidebar[data-v-664e9644] { grid-template-columns:1fr; } .panel-toolbar[data-v-664e9644],.novel-topbar[data-v-664e9644] { align-items:flex-start; flex-direction:column; } .reader-controls[data-v-664e9644] { grid-template-columns:1fr; } .novel-viewport[data-v-664e9644] { min-height:calc(100vh - 92px); height:calc(100vh - 92px); padding:86px 24px 168px; } .novel-bottombar[data-v-664e9644] { max-height:45vh; overflow:auto; } .text-line[data-v-664e9644] { grid-template-columns:38px minmax(0,1fr); gap:10px; } } .local-reader-page[data-v-664e9644] { --pink-bg:#F1DDDF; --cream:#FFF9F7; --ink:#1A1A1D; --red:#E72D48; --green:#2FA84F; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.12) 2px,transparent 2.5px) 0 0/28px 28px,var(--pink-bg ) !important; color:var(--ink ); overflow-x:hidden; } .local-reader-page *[data-v-664e9644],.local-reader-page *[data-v-664e9644]::before,.local-reader-page *[data-v-664e9644]::after { box-sizing:border-box; } .reader-hero[data-v-664e9644],.drop-zone[data-v-664e9644],.side-card[data-v-664e9644],.reader-main[data-v-664e9644],.empty-reader[data-v-664e9644],.standard-panel[data-v-664e9644],.novel-shell[data-v-664e9644],.reader-drawer .drawer-panel[data-v-664e9644] { background:var(--cream ) !important; color:var(--ink ) !important; border:3px solid var(--ink ) !important; box-shadow:8px 8px 0 var(--red ) !important; } .reader-hero[data-v-664e9644] { width:min(100%,1380px); margin:0 auto 18px; display:grid; gap:16px; } .hero-copy h1[data-v-664e9644] { color:var(--ink ); line-height:1.05; letter-spacing:-1.5px; } .hero-copy p[data-v-664e9644] { color:rgba(26,26,29,.76); line-height:1.75; } .eyebrow[data-v-664e9644] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:6px 12px; border:3px solid var(--ink ); border-radius:999px; background:var(--red ); color:var(--cream ); box-shadow:4px 4px 0 var(--ink ); font-weight:900; } .reader-workspace[data-v-664e9644] { width:min(100%,1380px); margin:0 auto; grid-template-columns:minmax(240px,300px) minmax(0,1fr); gap:22px; align-items:start; } .reader-sidebar[data-v-664e9644] { min-width:0; } .reader-main[data-v-664e9644] { min-width:0; } .primary-upload[data-v-664e9644],.ghost-button[data-v-664e9644],.mode-button[data-v-664e9644],.side-title-row button[data-v-664e9644],.drawer-head button[data-v-664e9644],.toolbar-actions button[data-v-664e9644],.inline-upload[data-v-664e9644],.chapter-nav button[data-v-664e9644],.reader-pills button[data-v-664e9644] { border:3px solid var(--ink ) !important; border-radius:14px !important; font-weight:900; box-shadow:4px 4px 0 var(--ink ) !important; transition:transform .15s ease,box-shadow .15s ease,background .15s ease; } .primary-upload[data-v-664e9644],.mode-button.active[data-v-664e9644],.toolbar-actions button.active[data-v-664e9644] { background:var(--red ) !important; color:var(--cream ) !important; } .ghost-button[data-v-664e9644],.mode-button[data-v-664e9644],.side-title-row button[data-v-664e9644],.drawer-head button[data-v-664e9644],.toolbar-actions button[data-v-664e9644],.chapter-nav button[data-v-664e9644],.reader-pills button[data-v-664e9644] { background:var(--cream ) !important; color:var(--ink ) !important; } .primary-upload[data-v-664e9644]:hover,.ghost-button[data-v-664e9644]:hover,.mode-button[data-v-664e9644]:hover,.side-title-row button[data-v-664e9644]:hover,.drawer-head button[data-v-664e9644]:hover,.toolbar-actions button[data-v-664e9644]:hover,.chapter-nav button[data-v-664e9644]:hover,.reader-pills button[data-v-664e9644]:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--ink ) !important; } .primary-upload[data-v-664e9644]:active,.ghost-button[data-v-664e9644]:active,.mode-button[data-v-664e9644]:active,.side-title-row button[data-v-664e9644]:active,.drawer-head button[data-v-664e9644]:active,.toolbar-actions button[data-v-664e9644]:active,.chapter-nav button[data-v-664e9644]:active,.reader-pills button[data-v-664e9644]:active { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink ) !important; } .drop-zone[data-v-664e9644] { min-height:128px; display:grid; place-items:center; text-align:center; } .drop-zone.dragging[data-v-664e9644] { background:#fff !important; box-shadow:8px 8px 0 var(--green ) !important; } .parse-progress[data-v-664e9644] { border:3px solid var(--ink ); border-radius:999px; overflow:hidden; background:var(--cream ); } .parse-progress i[data-v-664e9644] { background:var(--red ) !important; } .recent-item[data-v-664e9644],.search-result[data-v-664e9644],.toc-list button[data-v-664e9644],.bookmark-list button[data-v-664e9644],.text-line[data-v-664e9644],.sheet-summary[data-v-664e9644],.code-block[data-v-664e9644],.json-node[data-v-664e9644] { border:2px solid var(--ink ) !important; border-radius:14px !important; background:#fff !important; color:var(--ink ) !important; } .toc-list button.active[data-v-664e9644] { background:var(--red ) !important; color:var(--cream ) !important; } .message-strip[data-v-664e9644] { width:min(100%,1380px); margin:0 auto 18px; border:3px solid var(--ink ); border-radius:16px; background:var(--cream ); box-shadow:5px 5px 0 var(--ink ); } .message-strip.error[data-v-664e9644] { box-shadow:5px 5px 0 var(--red ); } .novel-viewport[data-v-664e9644] { color:var(--ink ); overflow-wrap:anywhere; } .novel-viewport p[data-v-664e9644] { line-height:1.95; } .reader-controls input[data-v-664e9644],.novel-search input[data-v-664e9644],input[data-v-664e9644],textarea[data-v-664e9644],select[data-v-664e9644] { max-width:100%; min-width:0; border:3px solid var(--ink ) !important; border-radius:12px !important; background:var(--cream ) !important; color:var(--ink ) !important; } @media (max-width:1199px) { .reader-workspace[data-v-664e9644] { grid-template-columns:1fr; } .reader-sidebar[data-v-664e9644] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:767px) { .local-reader-page[data-v-664e9644] { padding:14px !important; } .reader-hero[data-v-664e9644],.drop-zone[data-v-664e9644],.side-card[data-v-664e9644],.reader-main[data-v-664e9644],.empty-reader[data-v-664e9644],.standard-panel[data-v-664e9644],.novel-shell[data-v-664e9644] { border-radius:18px !important; box-shadow:5px 5px 0 var(--red ) !important; } .hero-actions[data-v-664e9644],.reader-sidebar[data-v-664e9644],.reader-controls[data-v-664e9644],.panel-toolbar[data-v-664e9644],.novel-topbar[data-v-664e9644],.novel-bottombar[data-v-664e9644],.chapter-nav[data-v-664e9644],.reader-pills[data-v-664e9644] { display:grid !important; grid-template-columns:1fr !important; gap:10px; } .primary-upload[data-v-664e9644],.ghost-button[data-v-664e9644],.toolbar-actions button[data-v-664e9644],.chapter-nav button[data-v-664e9644] { width:100%; } .novel-viewport[data-v-664e9644] { min-height:calc(100vh - 96px); height:calc(100vh - 96px); padding:78px 18px 164px !important; } .text-line[data-v-664e9644] { grid-template-columns:34px minmax(0,1fr) !important; } } .addTitle input[data-v-4c2e0c3c] { margin-top:-5px; font-weight:300; font-size:26px; text-align:left; margin-right:20px; } .addInfo textarea[data-v-4c2e0c3c] { margin-top:30px; width:80vw; height:70vh; font-weight:300; font-size:26px; text-align:left; margin-right:20px; } .searchIcon[data-v-4c2e0c3c] { scale:0.65; margin-top:-5px; position:absolute; } .clearIcon[data-v-4c2e0c3c] { scale:0.5; margin-top:-25px; position:absolute; } .search[data-v-4c2e0c3c] { cursor:pointer; padding-right:100px; text-align:right; margin-top:30px; margin-bottom:30px; } .search input[data-v-4c2e0c3c] { margin-top:-5px; font-weight:300; font-size:22px; text-align:left; margin-right:20px; } .box_container[data-v-4c2e0c3c] { display:flex; flex-wrap:wrap; justify-content:space-between; gap:20px; } .box[data-v-4c2e0c3c] { width:calc(25% - 20px); box-sizing:border-box; border:#fcfcfc 1px solid; box-shadow:3px 4px 8px rgba(86,77,77,0.7); padding:10px; } .word[data-v-4c2e0c3c] { display:flex; color:#a10000; font-weight:bold; font-size:20px; } .interpretation[data-v-4c2e0c3c] { padding:10px; white-space:pre-wrap; word-wrap:break-word; text-align:left; } @media (max-width:1200px) { .box[data-v-4c2e0c3c] { width:calc(50% - 20px); } } @media (max-width:575px) { .box[data-v-4c2e0c3c] { width:100%; } } .gotoXls[data-v-4c2e0c3c] { position:fixed; padding:10px; background:red; border-radius:15px; color:white; cursor:pointer; display:flex; justify-content:center; align-items:center; text-align:center; text-decoration:none; transition:transform 0.3s,box-shadow 0.3s; } .gotoXls[data-v-4c2e0c3c]:hover { box-shadow:3px 4px 8px rgba(86,77,77,0.7); transform:scale(0.95); } .create-button[data-v-4c2e0c3c] { color:white; border-radius:50%; width:60px; height:60px; padding:0; position:fixed; bottom:20px; right:20px; z-index:999; display:flex; justify-content:center; align-items:center; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; user-select:none; font-size:24px; box-shadow:0 4px 6px rgba(0,0,0,0.1); } .create-button[data-v-4c2e0c3c]:hover { background-color:#ff4d4d; } .copyButton[data-v-4c2e0c3c] { cursor:pointer; background-color:red; padding:4px; border-radius:5px; color:white; } .copyButton[data-v-4c2e0c3c]:hover { cursor:pointer; scale:1.04; } .page { background:#f0f2f5; min-height:100vh; transition:background 0.5s ease; overflow-x:hidden; scroll-behavior:smooth; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }::-webkit-scrollbar { width:8px; height:8px; }::-webkit-scrollbar-track { background:rgba(0,0,0,0.03); border-radius:10px; }::-webkit-scrollbar-thumb { background:rgba(0,0,0,0.15); border-radius:10px; -webkit-transition:background 0.3s; transition:background 0.3s; }::-webkit-scrollbar-thumb:hover { background:rgba(0,0,0,0.3); } .search-overlay { position:fixed; top:0; left:0; width:100%; height:100vh; background:radial-gradient(circle at 50% 30%,rgba(255,255,255,0.6),rgba(0,0,0,0.15)); backdrop-filter:blur(20px) saturate(150%); -webkit-backdrop-filter:blur(20px) saturate(150%); z-index:900; will-change:opacity; } .fade-blur-enter-active,.fade-blur-leave-active { transition:opacity 0.4s cubic-bezier(0.25,1,0.5,1); } .fade-blur-enter,.fade-blur-leave-to { opacity:0; } .fixed-ui-layer { position:fixed; top:0; left:0; width:100%; z-index:1000; pointer-events:none; } .navigation-bar { pointer-events:auto; padding:15px 1% 0 1%; background:rgba(255,255,255,0.75); backdrop-filter:blur(25px) saturate(200%); -webkit-backdrop-filter:blur(25px) saturate(200%); border-bottom:1px solid rgba(0,0,0,0.05); box-shadow:0 4px 15px rgba(0,0,0,0.02); transition:background-color 0.4s ease; } .fixed-ui-layer.search-active-layer .navigation-bar { background:rgba(255,255,255,0.4); } .logo-header { display:flex; justify-content:space-between; align-items:center; } .logo { height:48px; width:auto; max-width:180px; -o-object-fit:contain; object-fit:contain; transition:transform 0.3s cubic-bezier(0.34,1.56,0.64,1); } .logo:hover { transform:scale(1.03); } .header-right { display:flex; gap:12px; align-items:center; } .header-right-bottom { width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; cursor:pointer; transition:transform 0.25s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.25s ease; font-size:18px; color:#fff; -webkit-user-select:none; -moz-user-select:none; user-select:none; box-shadow:0 2px 8px rgba(0,0,0,0.1); position:relative; overflow:hidden; transform:translateZ(0); } .header-right-bottom::after { content:""; position:absolute; top:50%; left:50%; width:0; height:0; border-radius:50%; background:rgba(255,255,255,0.4); transform:translate(-50%,-50%); transition:width 0.3s ease-out,height 0.3s ease-out; } .header-right-bottom:active::after { width:80px; height:80px; } .header-right-bottom:hover { transform:scale(1.1) translateZ(0); box-shadow:0 6px 12px rgba(0,0,0,0.15); } .toggle { background-color:#8534c7; font-size:20px; font-weight:300; } .add { background-color:#34c759; font-size:24px; font-weight:300; } .export { background-color:#007aff; } .edit { background-color:#ff9500; font-size:16px; } .edit.edit-active { background-color:#ff3b30; position:relative; } .edit.edit-active::before { content:""; position:absolute; top:-4px; left:-4px; right:-4px; bottom:-4px; border-radius:50%; border:2px solid #ff3b30; animation:simplePulse 2s infinite ease-out; } @keyframes simplePulse { 0% { transform:scale(0.8); opacity:0.8; } 100% { transform:scale(1.5); opacity:0; } } .nsfw-container { display:flex; align-items:center; gap:8px; cursor:pointer; margin-left:8px; } .nsfw-text { font-size:13px; color:#555; font-weight:600; -webkit-user-select:none; -moz-user-select:none; user-select:none; transition:color 0.3s; } .nsfw-container:hover .nsfw-text { color:#ff3b30; } .switch-wrapper { position:relative; width:44px; height:24px; } .switch-input { display:none; } .switch-label { display:block; width:44px; height:24px; background:#e5e5ea; border-radius:12px; cursor:pointer; transition:background 0.3s; position:relative; } .switch-button { position:absolute; top:2px; left:2px; width:20px; height:20px; background:#fff; border-radius:50%; box-shadow:0 2px 4px rgba(0,0,0,0.2); transition:transform 0.3s cubic-bezier(0.68,-0.55,0.265,1.55); } .switch-input:checked + .switch-label { background:#ff3b30; } .switch-input:checked + .switch-label .switch-button { transform:translateX(20px); } .category-wrapper { position:relative; padding:2px 0; } .category { display:flex; flex-wrap:wrap; gap:10px; max-height:80px; overflow:hidden; transition:max-height 0.4s cubic-bezier(0.25,1,0.5,1); } .category-wrapper.is-expanded .category { max-height:600px; } .category-tag { padding:6px 16px; border-radius:20px; font-size:13px; font-weight:600; cursor:pointer; transition:transform 0.2s ease,filter 0.2s ease; border:1px solid rgba(255,255,255,0.4); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); display:flex; align-items:center; position:relative; overflow:hidden; } .category-tag:hover { transform:translateY(-2px); box-shadow:0 4px 10px rgba(0,0,0,0.06); filter:brightness(0.95); } .category-tag small { margin-left:6px; opacity:0.7; font-size:11px; background:rgba(255,255,255,0.4); padding:2px 6px; border-radius:10px; } .category-expand-btn { text-align:center; font-size:12px; color:#007aff; cursor:pointer; font-weight:600; letter-spacing:1px; -webkit-user-select:none; -moz-user-select:none; user-select:none; transition:opacity 0.3s; position:fixed; left:50%; transform:translateX(-50%); background:rgba(255,255,255,0.8); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); border-radius:20px; padding:2px 12px; margin-top:2px; } .category-expand-btn:hover { opacity:0.7; } .header-line { height:1px; margin-top:5px; background:linear-gradient(90deg,transparent,rgba(0,0,0,0.05) 10%,rgba(0,0,0,0.05) 90%,transparent); } .main-search-container { position:relative; width:100%; padding:35px 0 20px 0; z-index:1100; pointer-events:none; } .search-wrapper { width:100%; display:flex; justify-content:center; padding:0 20px; box-sizing:border-box; } .search-capsule { pointer-events:auto; display:flex; align-items:center; width:100%; max-width:500px; height:52px; background:rgba(255,255,255,0.75); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-radius:26px; padding:0 20px; border:1px solid rgba(255,255,255,0.5); box-shadow:0 4px 15px rgba(0,0,0,0.04),inset 0 1px 0 rgba(255,255,255,0.6); transition:max-width 0.5s cubic-bezier(0.16,1,0.3,1),background-color 0.4s ease,box-shadow 0.4s ease,height 0.4s ease; box-sizing:border-box; } .main-search-container.is-active .search-capsule { max-width:767px; height:60px; border-radius:30px; background:rgba(255,255,255,1); box-shadow:0 16px 40px rgba(0,0,0,0.12),0 0 0 4px rgba(0,122,255,0.15),inset 0 1px 0 rgba(255,255,255,1); border-color:rgba(0,122,255,0.3); } .main-search-input { flex:1; border:none; background:transparent; outline:none; font-size:16px; color:#1c1c1e; height:100%; font-weight:500; transition:font-size 0.4s ease; } .main-search-container.is-active .main-search-input { font-size:18px; font-weight:400; } .main-search-input::-moz-placeholder { color:#8e8e93; } .main-search-input::placeholder { color:#8e8e93; } .search-icon { font-size:18px; margin-right:12px; color:#8e8e93; transition:color 0.3s; } .main-search-container.is-active .search-icon { color:#007aff; } .search-enter-btn { opacity:0; pointer-events:none; background:linear-gradient(135deg,#007aff,#005bb5); color:#fff; font-weight:600; font-size:14px; border:none; border-radius:20px; padding:0 20px; height:40px; margin-left:10px; white-space:nowrap; box-shadow:0 4px 12px rgba(0,122,255,0.3); cursor:pointer; position:relative; overflow:hidden; transform:scale(0.9) translateX(10px); transition: 0.4s cubic-bezier(0.34,1.56,0.64,1); } .main-search-container.is-active .search-enter-btn { opacity:1; pointer-events:auto; transform:scale(1) translateX(0); } .main-search-container.is-active .search-enter-btn:hover { transform:scale(1.05); box-shadow:0 6px 16px rgba(0,122,255,0.4); } .bookmark-card,.folder-header { position:relative; } @keyframes jiggle { 0% { transform:rotate(-1deg); } 50% { transform:rotate(1deg); } 100% { transform:rotate(-1deg); } } .is-edit-mode .bookmark-card { animation:jiggle 0.3s infinite ease-in-out; transform-origin:center center; cursor:cell; } .is-edit-mode .bookmark-card.folder { animation:none; } .is-edit-mode .bookmark-card.folder .safari-folder-icon { animation:jiggle 0.3s infinite ease-in-out; transform-origin:center center; } .edit-badge { position:absolute; top:-4px; right:-4px; width:24px; height:24px; background:#ff3b30; color:white; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:bold; box-shadow:0 2px 6px rgba(0,0,0,0.25),inset 0 1px 1px rgba(255,255,255,0.4); z-index:10; border:2px solid #fff; pointer-events:none; } .edit-badge-inline { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; background:#ff3b30; color:white; border-radius:50%; font-size:11px; margin-left:8px; box-shadow:0 2px 4px rgba(255,59,48,0.4); vertical-align:middle; transition:transform 0.2s; cursor:pointer; } .edit-badge-inline:hover { transform:scale(1.1); } .bookmark-window { padding:0 4%; box-sizing:border-box; } .bookmark-container { margin:0 auto; max-width:1600px; } .view-tree { margin-top:15px; } .folder-header { display:flex; align-items:center; font-size:18px; font-weight:600; color:#1c1c1e; cursor:pointer; -webkit-user-select:none; -moz-user-select:none; user-select:none; margin-bottom:20px; padding:5px 0; letter-spacing:0; transition:color 0.3s; } .folder-header:hover { color:#007aff; } .collapse-arrow { width:20px; height:20px; margin-right:8px; color:#8e8e93; transition:transform 0.3s ease; } .collapse-arrow.is-collapsed { transform:rotate(-90deg); color:#aeaeb2; } .collapse-line { flex:1; height:1px; margin-left:15px; background:linear-gradient(90deg,rgba(0,0,0,0.08) 0%,transparent 100%); } .collapse-enter-active,.collapse-leave-active { transition: 0.3s cubic-bezier(0.4,0,0.2,1); overflow:hidden; } .collapse-enter,.collapse-leave-to { opacity:0; transform:translateY(-10px); } .bookmark-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(90px,1fr)); gap:16px 12px; } .bookmark-card { display:flex; flex-direction:column; align-items:center; text-decoration:none; background:transparent; border:none; padding:8px 6px; border-radius:16px; transition:transform 0.25s cubic-bezier(0.2,0.9,0.4,1.1),background-color 0.2s; cursor:pointer; } .bookmark-card:hover { transform:translateY(-4px); background:rgba(255,255,255,0.5); border-radius:16px; } .bookmark-card:active { transform:scale(0.96); transition:transform 0.1s; } .icon { width:64px; height:64px; border-radius:16px; -o-object-fit:cover; object-fit:cover; margin-bottom:8px; background:#fff; box-shadow:0 4px 10px rgba(0,0,0,0.08),0 1px 2px rgba(0,0,0,0.02); transition:transform 0.25s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.25s; } .bookmark-card:hover .icon { transform:scale(1.04); box-shadow:0 10px 20px -6px rgba(0,0,0,0.15),0 0 0 2px rgba(0,122,255,0.15); } .safari-folder-icon { width:68px; height:68px; background:linear-gradient(135deg,rgba(255,255,255,0.9),rgba(245,245,247,0.95)); border:1px solid rgba(255,255,255,0.9); border-radius:18px; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:4px; padding:8px; box-sizing:border-box; box-shadow:0 6px 14px rgba(0,0,0,0.06),inset 0 1px 2px rgba(255,255,255,0.8); margin-bottom:8px; position:relative; transition:transform 0.25s cubic-bezier(0.34,1.56,0.64,1),box-shadow 0.25s; } .safari-folder-icon::before { content:""; position:absolute; top:-6px; left:12px; width:26px; height:8px; background:linear-gradient(135deg,rgba(255,255,255,0.9),rgba(245,245,247,0.95)); border-radius:6px 6px 0 0; border:1px solid rgba(255,255,255,0.9); border-bottom:none; z-index:-1; } .safari-folder-icon span { background:rgba(0,0,0,0.04); border-radius:6px; } .folder-mini-icon { width:100%; height:100%; border-radius:6px; -o-object-fit:cover; object-fit:cover; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,0.05); } .bookmark-card.folder:hover .safari-folder-icon { transform:scale(1.04) translateY(-2px); box-shadow:0 12px 24px -6px rgba(0,0,0,0.15),0 0 0 2px rgba(0,122,255,0.12); } .name { font-size:13px; font-weight:500; color:#1c1c1e; text-align:center; width:100%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding:0 4px; transition:color 0.2s; } .bookmark-card:hover .name { color:#007aff; } .expanded-folder-area { grid-column:1/-1; width:100%; padding:25px; margin-top:5px; margin-bottom:15px; background:rgba(0,0,0,0.02); border-radius:20px; border:1px solid rgba(255,255,255,0.5); animation:fadeSlideIn 0.3s cubic-bezier(0.2,0.9,0.4,1.1); } @keyframes fadeSlideIn { from { opacity:0; transform:translateY(-5px) scale(0.98); } to { opacity:1; transform:translateY(0) scale(1); } } .inner-grid { grid-template-columns:repeat(auto-fill,minmax(90px,1fr)); gap:14px 10px; } .tree-nav { display:flex; align-items:center; gap:15px; margin-bottom:25px; } .back-btn { display:flex; align-items:center; gap:6px; padding:8px 16px; background:rgba(255,255,255,0.7); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:1px solid rgba(255,255,255,0.5); border-radius:20px; color:#007aff; font-size:14px; font-weight:600; cursor:pointer; transition: 0.3s; box-shadow:0 2px 8px rgba(0,0,0,0.05); } .back-btn:hover { background:#fff; transform:translateY(-2px); box-shadow:0 6px 12px rgba(0,0,0,0.1); } .modal-fade-enter-active { animation:modalIn 0.3s cubic-bezier(0.2,0.9,0.4,1.1); } .modal-fade-leave-active { animation:modalOut 0.2s ease forwards; } @keyframes modalIn { 0% { opacity:0; transform:translateY(20px) scale(0.95); } 100% { opacity:1; transform:translateY(0) scale(1); } } @keyframes modalOut { 100% { opacity:0; transform:scale(0.95); } } .modal-mask { position:fixed; top:0; left:0; width:100%; height:100vh; display:flex; align-items:center; justify-content:center; z-index:2000; background:rgba(0,0,0,0.4); -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px); animation:maskFade 0.3s ease; } @keyframes maskFade { from { opacity:0; } to { opacity:1; } } .glass-modal { width:420px; background:rgba(255,255,255,0.9); backdrop-filter:blur(40px) saturate(200%); -webkit-backdrop-filter:blur(40px) saturate(200%); border-radius:24px; border:1px solid rgba(255,255,255,0.8); box-shadow:0 20px 50px rgba(0,0,0,0.15); overflow:hidden; display:flex; flex-direction:column; } .modal-header { padding:20px 24px; font-size:17px; font-weight:600; color:#1c1c1e; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid rgba(0,0,0,0.06); } .modal-close { width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:20px; background:rgba(0,0,0,0.04); cursor:pointer; transition: 0.25s; color:#8e8e93; } .modal-close:hover { background:#ffebee; color:#ff3b30; transform:rotate(90deg); } .modal-body { padding:24px; display:flex; flex-direction:column; gap:20px; } .form-group { display:flex; flex-direction:column; gap:8px; } .form-group label { font-size:14px; font-weight:600; color:#3a3a3c; } .glass-input { width:100%; height:46px; padding:0 16px; border-radius:14px; font-size:15px; color:#1c1c1e; outline:none; box-sizing:border-box; background:rgba(0,0,0,0.03); border:1px solid rgba(0,0,0,0.08); transition: 0.25s ease; } .glass-input:focus { background:#fff; border-color:#007aff; box-shadow:0 0 0 3px rgba(0,122,255,0.15); } .modal-footer { padding:16px 24px; background:rgba(0,0,0,0.02); border-top:1px solid rgba(0,0,0,0.05); display:flex; justify-content:flex-end; gap:12px; } .btn-cancel { padding:10px 20px; border-radius:12px; border:none; background:#f2f2f7; color:#007aff; font-size:15px; font-weight:600; cursor:pointer; transition:background 0.2s; } .btn-cancel:hover { background:#e5e5ea; } .btn-confirm { padding:10px 24px; border-radius:12px; border:none; background:linear-gradient(135deg,#0a84ff,#005bb5); color:#fff; font-size:15px; font-weight:600; cursor:pointer; transition:transform 0.2s,box-shadow 0.2s; } .btn-confirm:hover { transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,122,255,0.3); } .custom-context-menu { position:fixed; background:rgba(255,255,255,0.95); -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px); border:1px solid rgba(0,0,0,0.08); box-shadow:0 10px 30px rgba(0,0,0,0.15); border-radius:12px; padding:6px; min-width:120px; z-index:3000; animation:menuFadeIn 0.2s cubic-bezier(0.2,0.9,0.4,1.1); } @keyframes menuFadeIn { from { opacity:0; transform:scale(0.95); } to { opacity:1; transform:scale(1); } } .menu-item { padding:10px 16px; font-size:14px; font-weight:500; color:#1c1c1e; cursor:pointer; border-radius:8px; transition:background 0.2s; } .menu-item:hover { background:#f2f2f7; } .menu-item.delete { color:#ff3b30; } .menu-item.delete:hover { background:#ffebee; } @media (min-width:2000px) { .bookmark-container { max-width:2200px; } .search-capsule { max-width:700px; height:60px; } .main-search-container.is-active .search-capsule { max-width:1000px; height:68px; } .main-search-input { font-size:18px; } .bookmark-grid { gap:24px 20px; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); } .icon { width:80px; height:80px; border-radius:20px; } .safari-folder-icon { width:84px; height:84px; border-radius:22px; padding:10px; } } @media (max-width:1024px) { .search-capsule { max-width:450px; } .main-search-container.is-active .search-capsule { max-width:90vw; } .bookmark-grid { grid-template-columns:repeat(auto-fill,minmax(85px,1fr)); gap:15px 10px; } .icon { width:60px; height:60px; } .safari-folder-icon { width:64px; height:64px; } .category-tag { padding:5px 14px; font-size:12px; } .logo { height:42px; } } @media (max-width:768px) { .navigation-bar { padding:10px 1% 0 1%; } .logo { height:36px; } .header-right { gap:8px; } .header-right-bottom { width:32px; height:32px; font-size:15px; } .nsfw-text { display:none; } .category { max-height:35px; gap:8px; } .category-tag { padding:4px 12px; font-size:12px; } .search-capsule { max-width:100%; height:46px; border-radius:23px; } .main-search-container.is-active .search-capsule { max-width:96vw; height:50px; border-radius:25px; padding:0 12px; } .main-search-input { font-size:15px; } .main-search-container.is-active .main-search-input { font-size:16px; } .bookmark-grid { grid-template-columns:repeat(auto-fill,minmax(70px,1fr)); gap:12px 8px; } .icon,.safari-folder-icon { width:52px; height:52px; border-radius:14px; } .safari-folder-icon { padding:6px; gap:3px; } .safari-folder-icon::before { width:20px; height:6px; top:-5px; left:8px; } .name { font-size:12px; } .glass-modal { width:90%; max-width:380px; } .expanded-folder-area { padding:15px; } } @media (max-width:575px) { .search-capsule { height:44px; } .main-search-container.is-active .search-capsule { height:48px; max-width:98vw; } .bookmark-grid { grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); gap:10px 6px; } .icon,.safari-folder-icon { width:48px; height:48px; border-radius:12px; } .name { font-size:11px; } .category-tag { padding:3px 10px; font-size:11px; } .category-tag small { font-size:9px; margin-left:4px; } .header-right-bottom { width:28px; height:28px; font-size:14px; } .logo { height:30px; } } @media (hover:none) and (pointer:coarse) { .bookmark-card,.category-tag,.header-right-bottom,.search-enter-btn { cursor:pointer; -webkit-tap-highlight-color:transparent; } .bookmark-card:hover { transform:none; background:transparent; } .bookmark-card:active { transform:scale(0.92); transition:transform 0.08s; background:rgba(0,0,0,0.05); } .bookmark-card:active .icon,.bookmark-card:active .safari-folder-icon { transform:scale(0.95); box-shadow:none; } } .web-container[data-v-aeeb6b52] { display:flex; justify-content:center; align-items:flex-start; min-height:100vh; width:100%; background-color:#f4f4f9; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif; overflow:hidden; margin:0; padding:0; } .bird-phone[data-v-aeeb6b52] { width:100%; max-width:575px; min-height:100vh; background-color:#e31922; display:flex; flex-direction:column; padding:5px 10px 10px 10px; box-sizing:border-box; border-left:3px solid #fff; border-right:3px solid #fff; border-bottom:3px solid #fff; border-radius:0 0 24px 24px; box-shadow:0 5px 0 2px #ccc,0 8px 0 4px #111,0 20px 30px rgba(0,0,0,0.3),inset 0px -5px 10px rgba(0,0,0,0.4); } .speaker-grill[data-v-aeeb6b52] { display:flex; justify-content:center; margin-bottom:10px; margin-top:5px; flex-shrink:0; } .grill-line[data-v-aeeb6b52] { width:60px; height:5px; background:#222; border-radius:4px; background-image:repeating-linear-gradient(90deg,transparent,transparent 2px,#444 2px,#444 4px); border:1px solid #111; } .screen-bezel[data-v-aeeb6b52] { flex:0 0 42%; background:#000; border-radius:12px; padding:6px; padding-bottom:0; border:1px solid #333; box-shadow:inset 0 2px 5px rgba(255,255,255,0.2); display:flex; flex-direction:column; } .screen-glass[data-v-aeeb6b52] { flex:1; background:#000; border-radius:4px; overflow:hidden; position:relative; } .screen-home[data-v-aeeb6b52] { width:100%; height:100%; background:linear-gradient(120deg,#301610 0%,#612716 30%,#a25c3a 50%,#e0b490 60%,#592518 80%,#150a08 100%); display:flex; flex-direction:column; color:white; } .screen-dialing[data-v-aeeb6b52] { width:100%; height:100%; background:#f0f0f0; color:#000; display:flex; flex-direction:column; justify-content:space-between; } .dialing-text[data-v-aeeb6b52] { flex:1; display:flex; align-items:center; justify-content:flex-end; padding:10px; font-size:40px; font-weight:bold; overflow-wrap:break-word; text-align:right; } .status-bar[data-v-aeeb6b52] { display:flex; justify-content:space-between; padding:4px 6px; font-size:12px; font-weight:bold; flex-shrink:0; } .signal[data-v-aeeb6b52],.battery-time[data-v-aeeb6b52] { display:flex; align-items:center; } .small-time[data-v-aeeb6b52] { margin-right:5px; } .battery-icon[data-v-aeeb6b52] { width:22px; height:10px; border:1px solid #fff; border-radius:2px; padding:1px; position:relative; } .battery-icon[data-v-aeeb6b52]::after { content:""; position:absolute; right:-3px; top:2px; width:2px; height:4px; background:#fff; } .battery-level[data-v-aeeb6b52] { width:100%; height:100%; background:#b5e61d; } .home-content[data-v-aeeb6b52] { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; } .huge-time[data-v-aeeb6b52] { font-size:clamp(36px,12vw,58px); font-weight:900; letter-spacing:0; line-height:1; text-shadow:0 2px 4px rgba(0,0,0,0.5); margin-bottom:5px; } .date-text[data-v-aeeb6b52],.lunar-text[data-v-aeeb6b52] { font-size:14px; margin-bottom:4px; text-shadow:0 1px 2px rgba(0,0,0,0.8); } .carrier-text[data-v-aeeb6b52] { font-size:18px; line-height:1.4; color:#f0f0f0; text-shadow:0 1px 3px rgba(0,0,0,0.8); margin-top:10px; } .soft-key-labels[data-v-aeeb6b52] { display:flex; justify-content:space-between; padding:5px 10px; font-size:14px; font-weight:bold; text-shadow:0 1px 2px rgba(0,0,0,0.8); flex-shrink:0; } .brand-logo[data-v-aeeb6b52] { text-align:center; color:#fff; font-size:18px; font-weight:900; font-style:italic; letter-spacing:1px; padding:4px 0; flex-shrink:0; } .keypad[data-v-aeeb6b52] { flex:1; display:flex; flex-direction:column; padding:5px; margin-top:5px; } button[data-v-aeeb6b52] { background:none; border:none; outline:none; cursor:pointer; font-family:inherit; -webkit-user-select:none; -moz-user-select:none; user-select:none; } button[data-v-aeeb6b52]:active { filter:brightness(0.85); transform:scale(0.98); } .control-row[data-v-aeeb6b52] { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; flex-shrink:0; height:65px; } .call-row[data-v-aeeb6b52] { display:flex; justify-content:space-between; align-items:center; margin-bottom:8px; flex-shrink:0; height:35px; padding:0 10px; } .action-btn[data-v-aeeb6b52] { width:70px; height:45px; background-color:transparent; border:1px solid rgba(255,255,255,0.4); border-radius:4px; } .text-btn[data-v-aeeb6b52] { color:white; font-size:18px; font-weight:bold; } .nav-pad[data-v-aeeb6b52] { width:85px; height:65px; background-color:transparent; border:2px solid #eee; border-radius:12px; display:flex; justify-content:center; align-items:center; box-shadow:inset 0 0 5px rgba(0,0,0,0.3); } .nav-center[data-v-aeeb6b52] { width:34px; height:34px; border-radius:50%; border:2px solid #aaa; box-shadow:0 2px 4px rgba(0,0,0,0.5); background:repeating-conic-gradient(from 0deg,#eee 0deg 10deg,#999 10deg 20deg,#ddd 20deg 30deg); } .call-btn[data-v-aeeb6b52],.end-btn[data-v-aeeb6b52] { display:flex; justify-content:center; align-items:center; height:35px; border:none; } .call-icon[data-v-aeeb6b52] { width:30px; height:10px; border-radius:15px 15px 0 0; border:4px solid; border-bottom:none; } .call-icon.green[data-v-aeeb6b52] { border-color:#55ff55; } .call-icon.yellow-red[data-v-aeeb6b52] { border-color:#ffff55; position:relative; } .power-symbol[data-v-aeeb6b52] { position:absolute; top:5px; left:5px; color:#ffcc00; font-size:12px; } .number-grid[data-v-aeeb6b52] { flex:1; display:grid; grid-template-columns:repeat(3,1fr); grid-template-rows:repeat(4,1fr); gap:2px; background:#5a0b0f; border:1px solid #5a0b0f; border-radius:4px; overflow:hidden; } .num-key[data-v-aeeb6b52] { background-color:#e31922; width:100%; height:100%; display:flex; justify-content:center; align-items:center; color:white; transition:background-color 0.1s; } .num-key[data-v-aeeb6b52]:active { background-color:#b5131a; } .key-content[data-v-aeeb6b52] { display:flex; align-items:baseline; justify-content:center; position:relative; width:100%; } .main-num[data-v-aeeb6b52] { font-size:clamp(28px,6vh,42px); font-weight:600; font-family:Arial,sans-serif; line-height:1; } .sub-char[data-v-aeeb6b52] { font-size:11px; font-weight:bold; position:absolute; right:10px; bottom:0; letter-spacing:0; } .num-key:nth-child(10) .sub-char[data-v-aeeb6b52],.num-key:nth-child(11) .sub-char[data-v-aeeb6b52],.num-key:nth-child(12) .sub-char[data-v-aeeb6b52] { position:static; margin-left:5px; font-size:14px; } .not-found-page[data-v-7bdf59c5] { --dock-height:96px; min-height:100vh; color:var(--nf-text ); background:var(--nf-bg ); overflow-x:hidden; } .nf-template[data-v-7bdf59c5] { min-height:calc(100vh - var(--dock-height )); width:min(1760px,calc(100% - 48px)); margin:0 auto; } button[data-v-7bdf59c5] { border:0; border-radius:8px; font-weight:900; cursor:pointer; letter-spacing:0; } .action-row[data-v-7bdf59c5] { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; } .action-row.compact[data-v-7bdf59c5] { margin-top:20px; } .action-row button[data-v-7bdf59c5],.receipt-side button[data-v-7bdf59c5],.metro-actions button[data-v-7bdf59c5],.flight-actions button[data-v-7bdf59c5],.gallery-plaque button[data-v-7bdf59c5],.vending-machine footer button[data-v-7bdf59c5] { min-height:44px; padding:0 18px; color:var(--nf-bg ); background:var(--nf-accent ); } .action-row .ghost[data-v-7bdf59c5],.receipt-side button + button[data-v-7bdf59c5],.flight-actions button + button[data-v-7bdf59c5],.gallery-plaque button + button[data-v-7bdf59c5],.vending-machine footer button + button[data-v-7bdf59c5] { color:var(--nf-text ); background:rgba(255,255,255,0.12); border:1px solid rgba(255,255,255,0.18); } .signal-template[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(280px,0.82fr) minmax(360px,1fr) minmax(220px,0.45fr); align-items:center; gap:clamp(18px,4vw,64px); background:radial-gradient(circle at 48% 50%,var(--nf-soft ),transparent 30rem),linear-gradient(120deg,transparent 0 48%,rgba(255,255,255,0.04) 48% 52%,transparent 52%); } .signal-copy span[data-v-7bdf59c5],.receipt-paper span[data-v-7bdf59c5],.terminal-card span[data-v-7bdf59c5],.metro-board span[data-v-7bdf59c5],.archive-index span[data-v-7bdf59c5],.flight-ticket span[data-v-7bdf59c5],.postcard-front span[data-v-7bdf59c5],.blueprint-copy span[data-v-7bdf59c5],.gallery-plaque span[data-v-7bdf59c5],.vending-machine header span[data-v-7bdf59c5] { display:block; color:var(--nf-accent ); font-size:12px; font-weight:900; text-transform:uppercase; } .signal-copy h1[data-v-7bdf59c5],.metro-board h1[data-v-7bdf59c5],.blueprint-copy h1[data-v-7bdf59c5] { margin:10px 0 0; font-size:clamp(86px,14vw,230px); line-height:1.0; } .signal-copy h2[data-v-7bdf59c5],.terminal-card h2[data-v-7bdf59c5],.metro-board h2[data-v-7bdf59c5],.archive-copy h2[data-v-7bdf59c5],.flight-ticket h2[data-v-7bdf59c5],.postcard-back h2[data-v-7bdf59c5],.blueprint-copy h2[data-v-7bdf59c5],.gallery-plaque h2[data-v-7bdf59c5],.vending-copy h2[data-v-7bdf59c5] { margin:18px 0 10px; font-size:clamp(28px,4vw,72px); line-height:1.02; } .signal-copy p[data-v-7bdf59c5],.terminal-card p[data-v-7bdf59c5],.metro-board p[data-v-7bdf59c5],.archive-copy p[data-v-7bdf59c5],.flight-ticket p[data-v-7bdf59c5],.postcard-back p[data-v-7bdf59c5],.blueprint-copy p[data-v-7bdf59c5],.gallery-plaque p[data-v-7bdf59c5],.vending-copy p[data-v-7bdf59c5] { max-width:620px; margin:0; color:var(--nf-muted ); font-size:clamp(15px,1.2vw,20px); line-height:1.8; } .radar-board[data-v-7bdf59c5] { position:relative; display:grid; place-items:center; aspect-ratio:1; border:1px solid rgba(255,255,255,0.15); border-radius:50%; background:linear-gradient(90deg,transparent 49.6%,rgba(255,255,255,0.18) 49.6% 50.4%,transparent 50.4%),linear-gradient(0deg,transparent 49.6%,rgba(255,255,255,0.18) 49.6% 50.4%,transparent 50.4%),rgba(255,255,255,0.04); } .radar-board i[data-v-7bdf59c5] { position:absolute; width:calc(13% * var(--ring )); aspect-ratio:1; border:1px solid var(--nf-accent ); border-radius:50%; opacity:0.16; } .radar-board i[data-v-7bdf59c5]:nth-child(1) { --ring:1; } .radar-board i[data-v-7bdf59c5]:nth-child(2) { --ring:2; } .radar-board i[data-v-7bdf59c5]:nth-child(3) { --ring:3; } .radar-board i[data-v-7bdf59c5]:nth-child(4) { --ring:4; } .radar-board i[data-v-7bdf59c5]:nth-child(5) { --ring:5; } .radar-board i[data-v-7bdf59c5]:nth-child(6) { --ring:6; } .radar-board i[data-v-7bdf59c5]:nth-child(7) { --ring:7; } .radar-board b[data-v-7bdf59c5] { width:72px; aspect-ratio:1; border-radius:50%; background:var(--nf-accent ); box-shadow:0 0 70px var(--nf-accent ); } .signal-log[data-v-7bdf59c5] { display:grid; gap:12px; padding:18px; border-left:1px solid rgba(255,255,255,0.16); color:var(--nf-muted ); font-family:Consolas,Monaco,monospace; } .signal-log strong[data-v-7bdf59c5] { color:var(--nf-text ); } .receipt-template[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(300px,520px) minmax(180px,320px); justify-content:center; align-items:center; gap:28px; background:repeating-linear-gradient(90deg,rgba(0,0,0,0.035) 0 1px,transparent 1px 62px),linear-gradient(180deg,var(--nf-bg ),#fff8ed); } .receipt-paper[data-v-7bdf59c5] { position:relative; padding:clamp(28px,5vw,58px); color:var(--nf-text ); background:var(--nf-panel ); box-shadow:0 24px 70px rgba(44,31,18,0.18); } .receipt-paper[data-v-7bdf59c5]::before,.receipt-paper[data-v-7bdf59c5]::after { content:""; position:absolute; left:0; right:0; height:18px; background:linear-gradient(135deg,transparent 12px,var(--nf-panel ) 0) 0 0/24px 18px repeat-x; } .receipt-paper[data-v-7bdf59c5]::before { top:-18px; transform:rotate(180deg); } .receipt-paper[data-v-7bdf59c5]::after { bottom:-18px; } .receipt-paper h1[data-v-7bdf59c5] { margin:14px 0 8px; font-size:clamp(84px,15vw,190px); line-height:1.0; font-family:Georgia,serif; } .receipt-paper h2[data-v-7bdf59c5] { margin:12px 0; font-size:clamp(26px,4vw,52px); } .receipt-paper p[data-v-7bdf59c5],.receipt-paper li[data-v-7bdf59c5] { color:var(--nf-muted ); line-height:1.75; } .receipt-paper ul[data-v-7bdf59c5] { display:grid; gap:8px; margin:24px 0; padding:0; list-style:none; } .receipt-total[data-v-7bdf59c5] { display:flex; justify-content:space-between; padding-top:16px; border-top:1px dashed rgba(0,0,0,0.18); } .receipt-side[data-v-7bdf59c5] { display:grid; gap:12px; } .terminal-template[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(380px,1.2fr) minmax(300px,0.72fr); align-items:center; gap:28px; background:radial-gradient(circle at 20% 20%,var(--nf-soft ),transparent 26rem),linear-gradient(135deg,#050806,var(--nf-bg )); } .terminal-window[data-v-7bdf59c5] { overflow:hidden; border:1px solid rgba(49,209,88,0.28); border-radius:8px; background:rgba(2,8,4,0.86); box-shadow:0 32px 90px rgba(0,0,0,0.38); } .terminal-window header[data-v-7bdf59c5] { display:flex; align-items:center; gap:8px; min-height:42px; padding:0 14px; border-bottom:1px solid rgba(255,255,255,0.08); } .terminal-window header span[data-v-7bdf59c5] { width:11px; height:11px; border-radius:50%; background:var(--nf-accent ); } .terminal-window header strong[data-v-7bdf59c5] { margin-left:8px; color:var(--nf-muted ); } .terminal-body[data-v-7bdf59c5] { min-height:clamp(300px,44vw,560px); padding:clamp(20px,4vw,42px); font-family:Consolas,Monaco,monospace; font-size:clamp(15px,1.6vw,24px); } .terminal-body p[data-v-7bdf59c5] { color:var(--nf-accent ); } .terminal-cursor[data-v-7bdf59c5] { animation:blink-7bdf59c5 1s steps(2,start) infinite; } .terminal-card[data-v-7bdf59c5] { padding:clamp(24px,4vw,44px); border:1px solid rgba(255,255,255,0.12); border-radius:8px; background:rgba(255,255,255,0.05); } .terminal-card h1[data-v-7bdf59c5],.archive-copy h1[data-v-7bdf59c5],.flight-panel h1[data-v-7bdf59c5],.gallery-frame span[data-v-7bdf59c5],.vending-machine header strong[data-v-7bdf59c5] { margin:0; font-size:clamp(86px,13vw,220px); line-height:1.0; } .metro-template[data-v-7bdf59c5] { position:relative; display:grid; grid-template-columns:minmax(320px,0.8fr) minmax(360px,1fr); grid-template-rows:1fr auto; align-items:center; gap:24px; background:linear-gradient(90deg,rgba(25,118,210,0.08) 0 1px,transparent 1px 80px),linear-gradient(180deg,rgba(25,118,210,0.08) 0 1px,transparent 1px 80px),var(--nf-bg ); } .metro-board[data-v-7bdf59c5] { align-self:stretch; display:grid; align-content:center; padding:clamp(24px,5vw,64px); border-left:10px solid var(--nf-accent ); background:var(--nf-panel ); box-shadow:0 24px 60px rgba(16,24,40,0.12); } .metro-lines[data-v-7bdf59c5] { position:relative; min-height:clamp(280px,42vw,560px); } .metro-lines i[data-v-7bdf59c5] { position:absolute; left:5%; right:5%; height:14px; border-radius:999px; background:var(--nf-accent ); } .metro-lines i[data-v-7bdf59c5]:nth-child(1) { top:14%; transform:rotate(12deg); background:#1976d2; } .metro-lines i[data-v-7bdf59c5]:nth-child(2) { top:30%; transform:rotate(-8deg); background:#ff6f9f; } .metro-lines i[data-v-7bdf59c5]:nth-child(3) { top:48%; transform:rotate(5deg); background:#19c99a; } .metro-lines i[data-v-7bdf59c5]:nth-child(4) { top:62%; transform:rotate(-14deg); background:#ffcf45; } .metro-lines i[data-v-7bdf59c5]:nth-child(5) { top:76%; transform:rotate(9deg); background:#7c5cff; } .metro-lines i[data-v-7bdf59c5]:nth-child(6) { top:42%; left:32%; right:32%; height:68px; border-radius:50%; background:transparent; border:14px solid var(--nf-accent ); } .metro-actions[data-v-7bdf59c5] { grid-column:1/-1; display:flex; gap:10px; justify-content:center; padding-bottom:18px; } .archive-template[data-v-7bdf59c5] { display:grid; grid-template-columns:260px minmax(360px,1fr) minmax(280px,0.7fr); align-items:center; gap:24px; background:linear-gradient(180deg,var(--nf-bg ),#f8fafc); } .archive-index[data-v-7bdf59c5] { display:grid; gap:10px; padding:20px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:var(--nf-panel ); } .archive-index strong[data-v-7bdf59c5] { font-size:34px; } .archive-index button[data-v-7bdf59c5] { min-height:42px; padding:0 12px; color:var(--nf-muted ); background:#f1f5f9; text-align:left; } .archive-index button.active[data-v-7bdf59c5] { color:#fff; background:var(--nf-accent ); } .archive-drawer[data-v-7bdf59c5] { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; } .archive-drawer i[data-v-7bdf59c5] { display:block; min-height:clamp(88px,12vw,150px); border-radius:8px; background:linear-gradient(180deg,rgba(255,255,255,0.75),transparent 52%),var(--nf-panel ); border:1px solid rgba(15,23,42,0.12); box-shadow:inset 0 -18px 0 rgba(15,23,42,0.06); } .flight-template[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(320px,0.76fr) minmax(380px,1fr); grid-template-rows:1fr auto; gap:24px; align-items:center; background:linear-gradient(140deg,transparent 0 55%,rgba(255,207,69,0.1) 55% 100%),var(--nf-bg ); } .flight-ticket[data-v-7bdf59c5] { position:relative; padding:clamp(28px,5vw,56px); border-radius:8px; background:var(--nf-panel ); box-shadow:0 30px 90px rgba(0,0,0,0.28); } .ticket-route[data-v-7bdf59c5] { display:grid; grid-template-columns:auto 1fr auto; gap:16px; align-items:center; margin:24px 0; } .ticket-route strong[data-v-7bdf59c5] { font-size:clamp(34px,5vw,72px); } .ticket-route i[data-v-7bdf59c5] { height:2px; background:linear-gradient(90deg,var(--nf-accent ),transparent); } .flight-panel[data-v-7bdf59c5] { position:relative; display:grid; place-items:center; min-height:clamp(300px,40vw,580px); border:1px solid rgba(255,255,255,0.14); border-radius:8px; overflow:hidden; } .flight-grid[data-v-7bdf59c5] { position:absolute; inset:18px; display:grid; grid-template-columns:repeat(4,1fr); gap:10px; opacity:0.24; } .flight-grid span[data-v-7bdf59c5] { border:1px solid var(--nf-accent ); border-radius:8px; } .flight-actions[data-v-7bdf59c5] { grid-column:1/-1; display:flex; justify-content:flex-end; gap:10px; padding-bottom:18px; } .postcard-template[data-v-7bdf59c5] { display:grid; place-items:center; background:linear-gradient(135deg,rgba(255,111,159,0.1),transparent 42%),linear-gradient(45deg,transparent 0 48%,rgba(255,255,255,0.38) 48% 52%,transparent 52%),var(--nf-bg ); } .postcard[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(260px,0.9fr) minmax(320px,1.1fr); width:min(980px,100%); min-height:clamp(420px,54vw,620px); border:1px solid rgba(43,28,41,0.12); border-radius:8px; background:var(--nf-panel ); box-shadow:0 28px 80px rgba(64,36,59,0.16); } .postcard-front[data-v-7bdf59c5] { display:grid; align-content:space-between; padding:clamp(24px,5vw,48px); color:#fff; background:linear-gradient(135deg,rgba(255,255,255,0.18),transparent 50%),var(--nf-accent ); } .postcard-front h1[data-v-7bdf59c5] { margin:0; font-size:clamp(90px,15vw,210px); line-height:1.0; } .postcard-back[data-v-7bdf59c5] { position:relative; padding:clamp(24px,5vw,48px); } .postcard-back i[data-v-7bdf59c5] { position:absolute; right:32px; top:32px; width:86px; height:70px; border:2px solid var(--nf-accent ); border-radius:8px; } .postcard-lines[data-v-7bdf59c5] { display:grid; gap:10px; margin-top:28px; color:var(--nf-muted ); } .postcard-lines span[data-v-7bdf59c5] { padding-bottom:8px; border-bottom:1px solid rgba(43,28,41,0.16); } .blueprint-template[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(300px,0.72fr) minmax(420px,1fr); align-items:center; gap:28px; background:linear-gradient(90deg,rgba(98,210,255,0.11) 1px,transparent 1px) 0 0/36px 36px,linear-gradient(180deg,rgba(98,210,255,0.11) 1px,transparent 1px) 0 0/36px 36px,var(--nf-bg ); } .blueprint-sheet[data-v-7bdf59c5] { position:relative; min-height:clamp(320px,42vw,600px); border:2px solid var(--nf-accent ); border-radius:8px; background:rgba(255,255,255,0.04); } .blueprint-sheet i[data-v-7bdf59c5] { position:absolute; border:1px solid var(--nf-accent ); opacity:0.65; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(1) { left:10%; top:12%; width:34%; height:24%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(2) { right:12%; top:10%; width:18%; height:42%; border-radius:50%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(3) { left:20%; bottom:14%; width:55%; height:18%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(4) { left:52%; top:28%; width:20%; height:22%; transform:rotate(18deg); } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(n+5) { width:8px; height:8px; border-radius:50%; background:var(--nf-accent ); } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(5) { left:12%; top:58%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(6) { left:28%; top:40%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(7) { left:66%; top:62%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(8) { left:82%; top:30%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(9) { left:42%; top:74%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(10) { left:74%; top:82%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(11) { left:18%; top:22%; } .blueprint-sheet i[data-v-7bdf59c5]:nth-child(12) { left:88%; top:68%; } .blueprint-sheet b[data-v-7bdf59c5] { position:absolute; left:24px; bottom:20px; color:var(--nf-accent ); font-family:Consolas,Monaco,monospace; } .gallery-template[data-v-7bdf59c5] { display:grid; align-items:center; background:linear-gradient(180deg,rgba(0,0,0,0.04),transparent 40%),var(--nf-bg ); } .gallery-wall[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(360px,1fr) minmax(280px,420px); gap:clamp(20px,5vw,72px); align-items:end; } .gallery-frame[data-v-7bdf59c5] { display:grid; place-items:center; min-height:clamp(360px,50vw,680px); border:clamp(16px,3vw,34px) solid #2c2118; background:linear-gradient(135deg,rgba(124,92,255,0.16),transparent 45%),var(--nf-panel ); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.6),0 28px 80px rgba(33,26,20,0.18); } .gallery-frame span[data-v-7bdf59c5] { color:var(--nf-accent ); } .gallery-plaque[data-v-7bdf59c5] { display:grid; gap:12px; padding:24px; border-left:4px solid var(--nf-accent ); background:var(--nf-panel ); } .gallery-plaque button[data-v-7bdf59c5] { width:-moz-max-content; width:max-content; } .vending-template[data-v-7bdf59c5] { display:grid; grid-template-columns:minmax(320px,520px) minmax(280px,0.8fr); align-items:center; gap:clamp(20px,5vw,72px); background:radial-gradient(circle at 20% 20%,var(--nf-soft ),transparent 28rem),var(--nf-bg ); } .vending-machine[data-v-7bdf59c5] { padding:18px; border:10px solid #263238; border-radius:8px; background:var(--nf-panel ); box-shadow:0 30px 80px rgba(37,29,18,0.18); } .vending-machine header[data-v-7bdf59c5],.vending-machine footer[data-v-7bdf59c5] { display:flex; justify-content:space-between; align-items:center; gap:10px; } .vending-machine header[data-v-7bdf59c5] { padding:12px 14px 20px; } .vending-machine header strong[data-v-7bdf59c5] { color:var(--nf-accent ); } .vending-slots[data-v-7bdf59c5] { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:12px; border-radius:8px; background:rgba(0,0,0,0.06); } .vending-slots span[data-v-7bdf59c5] { min-height:74px; border-radius:8px; background:linear-gradient(180deg,rgba(255,255,255,0.82),transparent 65%),var(--nf-soft ); border:1px solid rgba(0,0,0,0.08); } .vending-machine footer[data-v-7bdf59c5] { padding:18px 4px 4px; } .vending-copy ul[data-v-7bdf59c5] { display:grid; gap:10px; margin:28px 0 0; padding:0; list-style:none; } .vending-copy li[data-v-7bdf59c5] { width:-moz-max-content; width:max-content; max-width:100%; padding:10px 14px; border-radius:8px; color:var(--nf-text ); background:var(--nf-soft ); } .template-picker[data-v-7bdf59c5] { position:sticky; bottom:0; z-index:5; display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:8px; width:min(1760px,calc(100% - 48px)); margin:0 auto; padding:12px 0 16px; background:linear-gradient(180deg,transparent,var(--nf-bg ) 16px); } .template-picker button[data-v-7bdf59c5] { display:grid; grid-template-columns:28px minmax(0,1fr); gap:8px; align-items:center; min-height:50px; padding:8px; color:var(--nf-text ); background:rgba(255,255,255,0.14); border:1px solid rgba(255,255,255,0.16); text-align:left; -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); } .template-picker button.active[data-v-7bdf59c5] { color:var(--nf-bg ); background:var(--nf-accent ); } .template-picker span[data-v-7bdf59c5] { display:grid; place-items:center; width:28px; height:28px; border-radius:50%; background:rgba(255,255,255,0.22); } .template-picker strong[data-v-7bdf59c5] { min-width:0; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } @keyframes blink-7bdf59c5 { 50% { opacity:0; } } @media (max-width:1199px) { .template-picker[data-v-7bdf59c5] { grid-template-columns:repeat(5,minmax(0,1fr)); } .signal-template[data-v-7bdf59c5],.terminal-template[data-v-7bdf59c5],.metro-template[data-v-7bdf59c5],.archive-template[data-v-7bdf59c5],.flight-template[data-v-7bdf59c5],.blueprint-template[data-v-7bdf59c5],.gallery-wall[data-v-7bdf59c5],.vending-template[data-v-7bdf59c5] { grid-template-columns:1fr; align-content:center; padding:36px 0; } .signal-log[data-v-7bdf59c5] { border-left:0; border-top:1px solid rgba(255,255,255,0.16); } .archive-template[data-v-7bdf59c5] { grid-template-columns:1fr; } .archive-index[data-v-7bdf59c5] { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:767px) { .nf-template[data-v-7bdf59c5],.template-picker[data-v-7bdf59c5] { width:min(100% - 28px,1760px); } .template-picker[data-v-7bdf59c5] { grid-template-columns:1fr 1fr; position:relative; padding-bottom:14px; } .receipt-template[data-v-7bdf59c5],.postcard[data-v-7bdf59c5] { grid-template-columns:1fr; padding:34px 0; } .metro-actions[data-v-7bdf59c5],.flight-actions[data-v-7bdf59c5],.vending-machine header[data-v-7bdf59c5],.vending-machine footer[data-v-7bdf59c5] { justify-content:flex-start; flex-wrap:wrap; } .archive-index[data-v-7bdf59c5],.vending-slots[data-v-7bdf59c5] { grid-template-columns:1fr 1fr; } } .douyin-page[data-v-89d32998] { min-height:100vh; color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); } .tool-shell[data-v-89d32998] { width:min(1760px,calc(100% - 40px)); margin:0 auto; padding:clamp(52px,6vw,84px) 0 clamp(36px,5vw,70px); } .tool-hero[data-v-89d32998] { display:flex; justify-content:space-between; gap:18px; align-items:flex-end; margin-bottom:18px; } .eyebrow[data-v-89d32998],.panel-head span[data-v-89d32998],.field span[data-v-89d32998],.range-field span[data-v-89d32998] { display:block; color:var(--color-primary ); font-size:12px; font-weight:900; text-transform:uppercase; } .tool-hero h1[data-v-89d32998] { margin:10px 0 10px; font-size:clamp(42px,5.8vw,86px); line-height:0.98; } .tool-hero p[data-v-89d32998] { max-width:767px; margin:0; color:var(--color-text-soft ); font-size:clamp(15px,1.15vw,18px); line-height:1.75; } .primary-action[data-v-89d32998],.panel-head button[data-v-89d32998],.button-grid button[data-v-89d32998],.sample-list button[data-v-89d32998] { min-height:42px; border:0; border-radius:8px; background:var(--color-button ); color:var(--color-button-text ); font-weight:900; cursor:pointer; } .primary-action[data-v-89d32998] { min-width:140px; border-radius:999px; } button[data-v-89d32998]:disabled { cursor:not-allowed; opacity:0.5; } .workspace[data-v-89d32998] { display:grid; grid-template-columns:minmax(280px,340px) minmax(320px,0.8fr) minmax(360px,750px); gap:16px; align-items:start; } .panel[data-v-89d32998] { border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 22px 60px var(--color-shadow ); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .control-panel[data-v-89d32998],.editor-panel[data-v-89d32998],.preview-panel[data-v-89d32998] { min-width:0; padding:16px; } .panel-head[data-v-89d32998] { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:14px; } .panel-head h2[data-v-89d32998] { margin:5px 0 0; font-size:24px; } .panel-head small[data-v-89d32998] { color:var(--color-text-soft ); font-weight:900; } .panel-head button[data-v-89d32998] { padding:0 12px; background:#ff6f9f; } .field-title-row[data-v-89d32998] { display:flex; justify-content:space-between; gap:10px; align-items:center; } .field-title-row small[data-v-89d32998] { color:var(--color-text-soft ); font-size:12px; font-weight:900; } .field[data-v-89d32998],.range-field[data-v-89d32998] { display:grid; gap:8px; margin-top:12px; } .field select[data-v-89d32998],.field input[data-v-89d32998],.editor-panel textarea[data-v-89d32998] { width:100%; border:1px solid var(--color-border ); border-radius:8px; background:#fff; color:var(--color-text ); outline:none; } .field select[data-v-89d32998],.field input[data-v-89d32998] { min-height:42px; padding:0 12px; font-weight:800; } .style-actions[data-v-89d32998] { display:grid; grid-template-columns:1fr 1fr; gap:8px; } .style-actions button[data-v-89d32998] { min-height:38px; border:0; border-radius:8px; background:var(--color-button ); color:#ffffff; font-weight:900; cursor:pointer; } .style-actions button[data-v-89d32998]:first-child { background:#ff6f9f; } .style-library[data-v-89d32998] { display:grid; max-height:420px; gap:8px; overflow:auto; padding:8px; border:1px solid var(--color-border ); border-radius:8px; background:rgba(248,250,252,0.88); } .style-option[data-v-89d32998] { display:grid; grid-template-columns:50px minmax(0,1fr); gap:10px; align-items:center; min-height:62px; border:1px solid var(--color-border ); border-radius:8px; background:rgba(255,255,255,0.88); color:var(--color-text ); cursor:pointer; padding:8px; text-align:left; transition:transform 0.16s ease,border-color 0.16s ease,box-shadow 0.16s ease; } .style-option[data-v-89d32998]:hover { transform:translateY(-2px); border-color:var(--color-primary ); box-shadow:0 12px 30px var(--color-shadow ); } .style-option.active[data-v-89d32998] { border-color:var(--color-primary ); box-shadow:0 0 0 3px var(--color-focus-shadow ); } .style-swatch[data-v-89d32998] { position:relative; display:block; width:50px; height:46px; overflow:hidden; border-radius:8px; background:var(--style-bg ); box-shadow:inset 0 0 0 1px rgba(255,255,255,0.52); } .style-swatch[data-v-89d32998]::before,.style-swatch[data-v-89d32998]::after { content:""; position:absolute; border-radius:999px; } .style-swatch[data-v-89d32998]::before { width:24px; height:24px; left:-8px; top:-6px; background:var(--style-accent ); opacity:0.42; } .style-swatch[data-v-89d32998]::after { width:22px; height:8px; right:7px; bottom:9px; background:var(--style-text ); border-radius:99px; } .style-swatch i[data-v-89d32998] { position:absolute; left:10px; right:12px; top:15px; height:5px; border-radius:999px; background:var(--style-muted ); } .style-meta[data-v-89d32998] { display:grid; gap:4px; min-width:0; } .style-meta strong[data-v-89d32998],.style-meta small[data-v-89d32998] { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .style-meta strong[data-v-89d32998] { font-size:14px; font-weight:900; } .style-meta small[data-v-89d32998] { color:var(--color-text-soft ); font-size:12px; font-weight:800; } .style-list-enter-active[data-v-89d32998],.style-list-leave-active[data-v-89d32998] { transition:opacity 0.18s ease,transform 0.18s ease; } .style-list-enter[data-v-89d32998],.style-list-leave-to[data-v-89d32998] { opacity:0; transform:translateY(-6px); } .micro-grid[data-v-89d32998] { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin-bottom:12px; } .range-field input[data-v-89d32998] { width:100%; accent-color:#ff6f9f; } .button-grid[data-v-89d32998] { display:grid; grid-template-columns:1fr; gap:8px; margin-top:16px; } .button-grid button[data-v-89d32998]:nth-child(1) { background:#ff6f9f; } .button-grid button[data-v-89d32998]:nth-child(2) { background:var(--color-primary ); } .toast-line[data-v-89d32998] { min-height:42px; margin:14px 0 0; padding:12px; border-radius:8px; color:#475569; background:var(--color-bg-soft ); font-size:13px; line-height:1.45; } .editor-panel textarea[data-v-89d32998] { min-height:250px; resize:vertical; padding:16px; font-size:22px; font-weight:900; line-height:1.45; } .sample-list[data-v-89d32998] { display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; } .sample-list button[data-v-89d32998] { min-height:34px; padding:0 12px; border-radius:999px; background:var(--color-bg-soft ); color:#334155; } .poster-wrap[data-v-89d32998] { display:grid; place-items:center; max-width:100%; overflow:auto; } .poster-card[data-v-89d32998] { position:relative; display:flex; width:min(100%,750px); aspect-ratio:1/1; padding:clamp(30px,6vw,62px); border-radius:var(--poster-radius ); overflow:hidden; align-items:center; justify-content:center; background:var(--poster-bg ); color:var(--poster-text ); isolation:isolate; box-shadow:inset 0 0 0 2px var(--poster-border ),0 28px 70px var(--poster-shadow ); } .poster-card[data-v-89d32998]::before,.poster-card[data-v-89d32998]::after { content:""; position:absolute; border-radius:999px; pointer-events:none; } .poster-card[data-v-89d32998]::before { width:220px; height:220px; left:-70px; top:-50px; background:var(--poster-accent ); opacity:0.16; } .poster-card[data-v-89d32998]::after { width:180px; height:180px; right:-54px; bottom:-42px; background:var(--poster-text ); opacity:0.12; } .poster-decoration[data-v-89d32998] { position:absolute; z-index:1; color:var(--poster-accent ); font-size:clamp(42px,7vw,78px); font-weight:900; line-height:1; opacity:0.72; } .poster-decoration.top-left[data-v-89d32998] { left:36px; top:30px; } .poster-decoration.bottom-right[data-v-89d32998] { right:36px; bottom:30px; transform:rotate(12deg); } .poster-dots[data-v-89d32998] { position:absolute; inset:24px; z-index:0; border:1px dashed var(--poster-border ); border-radius:8px; opacity:0.58; } .poster-rail[data-v-89d32998] { position:absolute; z-index:2; left:30px; bottom:28px; color:var(--poster-muted ); font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; opacity:0.68; } .poster-content[data-v-89d32998] { position:relative; z-index:2; width:100%; text-align:center; } .poster-tag[data-v-89d32998] { display:inline-flex; min-height:34px; align-items:center; padding:0 14px; border-radius:999px; color:var(--poster-accent ); background:var(--poster-surface ); font-size:14px; font-weight:900; } .poster-content h2[data-v-89d32998] { display:grid; gap:0.2em; margin:clamp(22px,5vw,42px) auto; color:var(--poster-text ); font-size:var(--poster-font-size ); font-weight:var(--poster-weight ); line-height:var(--poster-line-height ); letter-spacing:0; } .poster-content h2 span[data-v-89d32998] { display:block; overflow-wrap:break-word; text-wrap:balance; } .poster-content p[data-v-89d32998] { margin:0; color:var(--poster-muted ); font-size:clamp(18px,2vw,26px); font-weight:900; } .layout-left[data-v-89d32998],.layout-receipt[data-v-89d32998],.layout-newspaper[data-v-89d32998] { justify-content:flex-start; } .layout-left .poster-content[data-v-89d32998],.layout-receipt .poster-content[data-v-89d32998],.layout-newspaper .poster-content[data-v-89d32998] { max-width:86%; text-align:left; } .layout-top[data-v-89d32998] { align-items:flex-start; } .layout-top .poster-content[data-v-89d32998] { margin-top:7%; } .layout-bottom[data-v-89d32998] { align-items:flex-end; } .layout-bottom .poster-content[data-v-89d32998] { max-width:92%; text-align:left; } .layout-card .poster-content[data-v-89d32998] { padding:clamp(24px,4.8vw,46px); border:1px solid var(--poster-border ); border-radius:8px; background:var(--poster-surface ); box-shadow:0 20px 44px var(--color-shadow ); } .layout-stack .poster-content h2[data-v-89d32998] { justify-items:center; } .layout-stack .poster-content h2 span[data-v-89d32998] { width:-moz-fit-content; width:fit-content; max-width:100%; padding:0.05em 0.22em 0.1em; border-radius:8px; background:var(--poster-surface ); box-shadow:8px 8px 0 var(--poster-accent ); } .layout-stack .poster-content h2 span[data-v-89d32998]:nth-child(even) { transform:rotate(-1.2deg); } .layout-stack .poster-content h2 span[data-v-89d32998]:nth-child(odd) { transform:rotate(1.2deg); } .layout-diagonal .poster-content[data-v-89d32998] { transform:rotate(-2deg); } .layout-diagonal .poster-content h2[data-v-89d32998] { padding:0.12em 0.18em; border-left:10px solid var(--poster-accent ); background:var(--poster-surface ); text-align:left; } .layout-magazine .poster-content[data-v-89d32998] { display:flex; min-height:100%; flex-direction:column; justify-content:space-between; text-align:left; } .layout-magazine .poster-content h2[data-v-89d32998],.layout-newspaper .poster-content h2[data-v-89d32998] { margin:12px 0; text-transform:uppercase; } .layout-magazine .poster-tag[data-v-89d32998],.layout-newspaper .poster-tag[data-v-89d32998] { align-self:flex-start; } .layout-note .poster-content[data-v-89d32998] { padding:clamp(20px,4vw,38px); border:1px solid var(--poster-border ); border-radius:8px; background:var(--poster-surface ); text-align:left; transform:rotate(-1deg); } .layout-film .poster-content[data-v-89d32998] { padding:36px 0; border-top:12px solid var(--poster-border ); border-bottom:12px solid var(--poster-border ); } .layout-split .poster-content[data-v-89d32998] { display:grid; grid-template-columns:minmax(92px,0.7fr) minmax(0,1.3fr); gap:18px; align-items:end; text-align:left; } .layout-split .poster-tag[data-v-89d32998] { align-self:start; justify-self:start; } .layout-split .poster-content h2[data-v-89d32998] { grid-column:2; grid-row:1/span 2; margin:0; } .layout-split .poster-content p[data-v-89d32998] { grid-column:1; } .layout-headline .poster-content[data-v-89d32998] { text-align:left; } .layout-headline .poster-content h2[data-v-89d32998] { margin:18px 0; font-size:calc(var(--poster-font-size ) * 1.12); line-height:1.05; } .layout-receipt .poster-content[data-v-89d32998],.layout-ticket .poster-content[data-v-89d32998],.layout-stamp .poster-content[data-v-89d32998] { padding:clamp(22px,4vw,40px); border:1px dashed var(--poster-border ); border-radius:8px; background:var(--poster-surface ); } .layout-receipt .poster-content h2[data-v-89d32998],.layout-ticket .poster-content h2[data-v-89d32998],.layout-stamp .poster-content h2[data-v-89d32998] { text-align:left; } .layout-newspaper .poster-content[data-v-89d32998] { padding-top:20px; border-top:4px double var(--poster-accent ); border-bottom:1px solid var(--poster-border ); } .layout-poster .poster-content[data-v-89d32998] { text-align:left; } .layout-poster .poster-content h2[data-v-89d32998] { margin:16px 0; padding:0.12em 0; border-top:8px solid var(--poster-accent ); border-bottom:8px solid var(--poster-accent ); } .layout-pixel[data-v-89d32998] { image-rendering:pixelated; } .layout-pixel .poster-content[data-v-89d32998] { padding:26px; border:4px solid var(--poster-border ); border-radius:0; background:var(--poster-surface ); box-shadow:10px 10px 0 var(--poster-accent ); } .layout-pixel .poster-tag[data-v-89d32998],.layout-pixel .poster-content p[data-v-89d32998] { border-radius:0; } .layout-chat .poster-content h2[data-v-89d32998] { justify-items:start; } .layout-chat .poster-content h2 span[data-v-89d32998] { max-width:92%; padding:0.14em 0.26em; border-radius:8px; background:var(--poster-surface ); text-align:left; } .layout-chat .poster-content h2 span[data-v-89d32998]:nth-child(even) { justify-self:end; background:var(--poster-accent ); color:#ffffff; } .tag-underline .poster-tag[data-v-89d32998] { padding:0 0 6px; border-radius:0; border-bottom:3px solid var(--poster-accent ); background:transparent; } .tag-block .poster-tag[data-v-89d32998],.tag-masthead .poster-tag[data-v-89d32998] { border-radius:0; background:var(--poster-accent ); color:#ffffff; } .tag-bubble .poster-tag[data-v-89d32998],.tag-sticker .poster-tag[data-v-89d32998] { background:var(--poster-accent ); color:#ffffff; box-shadow:5px 5px 0 var(--poster-text ); } .tag-label .poster-tag[data-v-89d32998],.tag-plate .poster-tag[data-v-89d32998],.tag-ticket .poster-tag[data-v-89d32998] { border:1px solid var(--poster-border ); } .tag-tape .poster-tag[data-v-89d32998] { border-radius:3px; background:var(--poster-accent ); color:#ffffff; transform:rotate(-2deg); } .tag-ribbon .poster-tag[data-v-89d32998] { border-radius:0 999px 999px 0; margin-left:-16px; background:var(--poster-accent ); color:#ffffff; } .tag-neon .poster-tag[data-v-89d32998] { border:1px solid var(--poster-accent ); background:rgba(0,0,0,0.16); color:var(--poster-accent ); text-shadow:0 0 14px var(--poster-accent ); } .frame-thin[data-v-89d32998] { box-shadow:inset 0 0 0 1px var(--poster-border ),0 28px 70px var(--poster-shadow ); } .frame-pop[data-v-89d32998] { box-shadow:inset 0 0 0 3px var(--poster-border ),12px 12px 0 var(--poster-accent ),0 28px 70px var(--poster-shadow ); } .frame-glow[data-v-89d32998] { box-shadow:inset 0 0 0 1px var(--poster-border ),inset 0 0 48px rgba(255,255,255,0.08),0 0 42px var(--poster-shadow ); } .frame-ticket .poster-dots[data-v-89d32998] { inset:34px; border-style:dashed; } .frame-ticket[data-v-89d32998]::before,.frame-ticket[data-v-89d32998]::after { width:88px; height:88px; background:rgba(255,255,255,0.7); opacity:0.8; } .frame-ticket[data-v-89d32998]::before { left:-44px; top:calc(50% - 44px); } .frame-ticket[data-v-89d32998]::after { right:-44px; bottom:calc(50% - 44px); } .frame-film .poster-dots[data-v-89d32998] { inset:18px; border-style:solid; } .frame-harsh[data-v-89d32998] { border-radius:0; box-shadow:inset 0 0 0 4px var(--poster-border ),0 28px 70px var(--poster-shadow ); } .frame-pixel[data-v-89d32998] { border-radius:0; box-shadow:inset 0 0 0 4px var(--poster-border ),12px 12px 0 var(--poster-accent ); } .frame-blueprint .poster-dots[data-v-89d32998],.frame-school .poster-dots[data-v-89d32998],.frame-paper .poster-dots[data-v-89d32998] { opacity:0.8; } .frame-glass[data-v-89d32998] { box-shadow:inset 0 0 0 1px var(--poster-border ),inset 0 0 60px rgba(255,255,255,0.24),0 28px 70px var(--poster-shadow ); } .pattern-clean .poster-dots[data-v-89d32998] { display:none; } .pattern-bloom .poster-dots[data-v-89d32998],.pattern-bubbles .poster-dots[data-v-89d32998],.pattern-pearls .poster-dots[data-v-89d32998] { border:0; background:radial-gradient(circle at 16% 18%,var(--poster-accent ) 0 7px,transparent 8px),radial-gradient(circle at 84% 24%,var(--poster-muted ) 0 5px,transparent 6px),radial-gradient(circle at 74% 78%,var(--poster-accent ) 0 12px,transparent 13px); } .pattern-confetti .poster-dots[data-v-89d32998],.pattern-stickers .poster-dots[data-v-89d32998] { border:0; background:linear-gradient(32deg,transparent 0 46%,var(--poster-accent ) 47% 53%,transparent 54%),radial-gradient(circle at 18% 68%,var(--poster-text ) 0 5px,transparent 6px),radial-gradient(circle at 76% 22%,var(--poster-accent ) 0 8px,transparent 9px); background-size:96px 96px,150px 150px,180px 180px; } .pattern-lightbeam .poster-dots[data-v-89d32998],.pattern-aurora .poster-dots[data-v-89d32998] { border:0; background:linear-gradient(118deg,transparent 0 18%,rgba(255,255,255,0.2) 19% 24%,transparent 25% 100%),radial-gradient(circle at 74% 22%,var(--poster-accent ),transparent 26%),radial-gradient(circle at 28% 78%,var(--poster-muted ),transparent 24%); } .pattern-leaf .poster-dots[data-v-89d32998],.pattern-rose .poster-dots[data-v-89d32998] { border:0; background:radial-gradient(ellipse at 18% 18%,var(--poster-accent ) 0 16px,transparent 17px),radial-gradient(ellipse at 84% 74%,var(--poster-muted ) 0 22px,transparent 23px); opacity:0.34; } .pattern-notebook .poster-dots[data-v-89d32998],.pattern-lines .poster-dots[data-v-89d32998] { border:0; background:repeating-linear-gradient(0deg,transparent 0 34px,var(--poster-border ) 35px 36px),linear-gradient(90deg,transparent 0 68px,rgba(255,111,159,0.22) 69px 71px,transparent 72px); } .pattern-sunset .poster-dots[data-v-89d32998],.pattern-glow .poster-dots[data-v-89d32998] { border:0; background:radial-gradient(circle at 78% 22%,rgba(255,255,255,0.58) 0 70px,transparent 72px),linear-gradient(0deg,rgba(255,255,255,0.18),transparent 42%); } .pattern-columns .poster-dots[data-v-89d32998] { border:0; background:repeating-linear-gradient(90deg,transparent 0 72px,var(--poster-border ) 73px 74px); } .pattern-paper .poster-dots[data-v-89d32998],.pattern-receipt .poster-dots[data-v-89d32998] { border:0; background:repeating-linear-gradient(0deg,transparent 0 28px,var(--poster-border ) 29px 30px),repeating-linear-gradient(90deg,transparent 0 84px,rgba(15,23,42,0.08) 85px 86px); } .pattern-grain .poster-dots[data-v-89d32998] { border:0; background:radial-gradient(circle at 12% 18%,rgba(255,255,255,0.18) 0 1px,transparent 2px),radial-gradient(circle at 72% 68%,rgba(255,255,255,0.18) 0 1px,transparent 2px); background-size:12px 12px,18px 18px; } .pattern-grid .poster-dots[data-v-89d32998],.pattern-circuit .poster-dots[data-v-89d32998],.pattern-blueprint .poster-dots[data-v-89d32998] { border:0; background:linear-gradient(var(--poster-border ) 1px,transparent 1px),linear-gradient(90deg,var(--poster-border ) 1px,transparent 1px); background-size:34px 34px; } .pattern-newspaper .poster-dots[data-v-89d32998] { border:0; background:repeating-linear-gradient(0deg,transparent 0 8px,rgba(15,23,42,0.08) 9px 10px),repeating-linear-gradient(90deg,transparent 0 110px,var(--poster-border ) 111px 112px); } .pattern-flash .poster-dots[data-v-89d32998] { border:0; background:conic-gradient(from 20deg at 74% 22%,rgba(255,255,255,0.75),transparent 12%,rgba(255,255,255,0.42) 18%,transparent 28%),radial-gradient(circle at 74% 22%,var(--poster-accent ),transparent 14%); } .pattern-rings .poster-dots[data-v-89d32998],.pattern-vinyl .poster-dots[data-v-89d32998] { border:0; background:repeating-radial-gradient(circle at 78% 28%,transparent 0 18px,var(--poster-border ) 19px 20px),radial-gradient(circle at 78% 28%,var(--poster-accent ) 0 8px,transparent 9px); } .pattern-checker .poster-dots[data-v-89d32998] { border:0; background:linear-gradient(45deg,var(--poster-border ) 25%,transparent 25% 75%,var(--poster-border ) 75%),linear-gradient(45deg,var(--poster-border ) 25%,transparent 25% 75%,var(--poster-border ) 75%); background-position:0 0,14px 14px; background-size:28px 28px; } .pattern-waves .poster-dots[data-v-89d32998] { border:0; background:radial-gradient(ellipse at 30% 100%,transparent 0 56px,var(--poster-border ) 57px 58px,transparent 59px),radial-gradient(ellipse at 70% 0%,transparent 0 52px,var(--poster-border ) 53px 54px,transparent 55px); background-size:180px 120px; } .pattern-map .poster-dots[data-v-89d32998] { border:0; background:linear-gradient(28deg,transparent 0 45%,var(--poster-border ) 46% 47%,transparent 48%),linear-gradient(140deg,transparent 0 52%,var(--poster-border ) 53% 54%,transparent 55%); background-size:160px 120px; } .pattern-clouds .poster-dots[data-v-89d32998] { border:0; background:radial-gradient(circle at 18% 24%,rgba(255,255,255,0.72) 0 28px,transparent 29px),radial-gradient(circle at 30% 28%,rgba(255,255,255,0.58) 0 20px,transparent 21px),radial-gradient(circle at 74% 76%,rgba(255,255,255,0.56) 0 34px,transparent 35px); } .pattern-citrus .poster-dots[data-v-89d32998] { border:0; background:repeating-conic-gradient(from 0deg at 22% 24%,var(--poster-accent ) 0 10deg,transparent 10deg 22deg),radial-gradient(circle at 22% 24%,transparent 0 38px,var(--poster-border ) 39px 40px,transparent 41px); } .pattern-ticket .poster-dots[data-v-89d32998],.pattern-stamp .poster-dots[data-v-89d32998] { border-style:dashed; background:repeating-linear-gradient(90deg,transparent 0 18px,var(--poster-border ) 19px 20px); } .pattern-chalk .poster-dots[data-v-89d32998],.pattern-doodle .poster-dots[data-v-89d32998],.pattern-ink .poster-dots[data-v-89d32998] { border:0; background:radial-gradient(circle at 22% 18%,var(--poster-border ) 0 2px,transparent 3px),radial-gradient(circle at 76% 72%,var(--poster-border ) 0 2px,transparent 3px),linear-gradient(160deg,transparent 0 64%,var(--poster-border ) 65% 66%,transparent 67%); background-size:36px 36px,42px 42px,220px 160px; } .pattern-stripes .poster-dots[data-v-89d32998],.pattern-diagonal .poster-dots[data-v-89d32998] { border:0; background:repeating-linear-gradient(135deg,transparent 0 18px,var(--poster-border ) 19px 28px); } .pattern-cutout .poster-dots[data-v-89d32998] { border:0; background:linear-gradient(30deg,var(--poster-surface ) 0 24%,transparent 25%),linear-gradient(150deg,transparent 0 68%,var(--poster-surface ) 69% 100%),radial-gradient(circle at 72% 24%,var(--poster-accent ) 0 20px,transparent 21px); } .pattern-rain .poster-dots[data-v-89d32998] { border:0; background:repeating-linear-gradient(105deg,transparent 0 18px,rgba(255,255,255,0.4) 19px 20px,transparent 21px 34px); } .pattern-scanline .poster-dots[data-v-89d32998] { border:0; background:repeating-linear-gradient(0deg,rgba(255,255,255,0.13) 0 2px,transparent 3px 8px),linear-gradient(90deg,transparent,rgba(255,255,255,0.18),transparent); } @media (max-width:1199px) { .workspace[data-v-89d32998] { grid-template-columns:minmax(0,1fr) minmax(0,1fr); } .preview-panel[data-v-89d32998] { grid-column:1/-1; } } @media (max-width:991px) { .tool-shell[data-v-89d32998] { width:min(100% - 24px,1760px); padding-top:42px; } .tool-hero[data-v-89d32998],.workspace[data-v-89d32998] { grid-template-columns:1fr; display:grid; } .primary-action[data-v-89d32998] { width:100%; } .tool-hero h1[data-v-89d32998] { font-size:40px; } .poster-card[data-v-89d32998] { padding:28px; } .poster-rail[data-v-89d32998] { display:none; } .layout-split .poster-content[data-v-89d32998] { grid-template-columns:1fr; } .layout-split .poster-content h2[data-v-89d32998],.layout-split .poster-content p[data-v-89d32998] { grid-column:1; grid-row:auto; } .poster-content h2[data-v-89d32998] { font-size:min(var(--poster-font-size ),46px); } .micro-grid[data-v-89d32998] { grid-template-columns:1fr; } } @media (max-width:575px) { .tool-shell[data-v-89d32998] { width:min(100% - 18px,1760px); } .control-panel[data-v-89d32998],.editor-panel[data-v-89d32998],.preview-panel[data-v-89d32998] { padding:12px; } .editor-panel textarea[data-v-89d32998] { min-height:210px; font-size:18px; } .style-actions[data-v-89d32998] { grid-template-columns:1fr; } .style-library[data-v-89d32998] { max-height:320px; } } .douyin-page[data-v-89d32998] { --pink-bg:#F1DDDF; --cream:#FFF9F7; --ink:#1A1A1D; --red:#E72D48; --green:#2FA84F; background:radial-gradient(circle at 18px 18px,rgba(26,26,29,.13) 2px,transparent 2.5px) 0 0/26px 26px,var(--pink-bg ) !important; color:var(--ink ); overflow-x:hidden; } .douyin-page *[data-v-89d32998],.douyin-page *[data-v-89d32998]::before,.douyin-page *[data-v-89d32998]::after { box-sizing:border-box; } .tool-shell[data-v-89d32998] { width:min(100%,1380px); margin:0 auto; } .tool-hero[data-v-89d32998],.panel[data-v-89d32998] { background:var(--cream ) !important; color:var(--ink ) !important; border:3px solid var(--ink ) !important; border-radius:24px !important; box-shadow:8px 8px 0 var(--red ) !important; } .tool-hero[data-v-89d32998] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px; align-items:end; } .tool-hero h1[data-v-89d32998] { color:var(--ink ); line-height:1.05; letter-spacing:-1.5px; } .tool-hero p[data-v-89d32998] { color:rgba(26,26,29,.76); line-height:1.7; } .eyebrow[data-v-89d32998] { display:inline-flex; width:-moz-fit-content; width:fit-content; padding:6px 12px; border:3px solid var(--ink ); border-radius:999px; background:var(--red ); color:var(--cream ); box-shadow:4px 4px 0 var(--ink ); font-weight:900; } .workspace[data-v-89d32998] { display:grid; grid-template-columns:minmax(280px,.8fr) minmax(0,1fr) minmax(340px,.9fr); gap:22px; align-items:start; } .control-panel[data-v-89d32998],.editor-panel[data-v-89d32998],.preview-panel[data-v-89d32998] { min-width:0; } .preview-panel[data-v-89d32998] { position:sticky; top:20px; } .primary-action[data-v-89d32998],.panel-head button[data-v-89d32998],.style-actions button[data-v-89d32998],.style-option[data-v-89d32998],.button-grid button[data-v-89d32998],.sample-list button[data-v-89d32998],.ghost-button[data-v-89d32998],.primary-button[data-v-89d32998] { border:3px solid var(--ink ) !important; border-radius:14px !important; background:var(--cream ) !important; color:var(--ink ) !important; font-weight:900; box-shadow:4px 4px 0 var(--ink ) !important; transition:transform .15s ease,box-shadow .15s ease,background .15s ease; } .primary-action[data-v-89d32998],.button-grid button[data-v-89d32998]:nth-child(1),.style-actions button[data-v-89d32998]:first-child { background:var(--red ) !important; color:var(--cream ) !important; } .primary-action[data-v-89d32998]:hover,.panel-head button[data-v-89d32998]:hover,.style-actions button[data-v-89d32998]:hover,.style-option[data-v-89d32998]:hover,.button-grid button[data-v-89d32998]:hover,.sample-list button[data-v-89d32998]:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 var(--ink ) !important; } .primary-action[data-v-89d32998]:active,.panel-head button[data-v-89d32998]:active,.style-actions button[data-v-89d32998]:active,.style-option[data-v-89d32998]:active,.button-grid button[data-v-89d32998]:active,.sample-list button[data-v-89d32998]:active { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--ink ) !important; } .style-option.active[data-v-89d32998] { background:var(--red ) !important; color:var(--cream ) !important; } .field input[data-v-89d32998],.editor-panel textarea[data-v-89d32998],.range-field input[data-v-89d32998],select[data-v-89d32998] { max-width:100%; min-width:0; border:3px solid var(--ink ) !important; border-radius:14px !important; background:#fff !important; color:var(--ink ) !important; font-weight:800; } .field input[data-v-89d32998]:focus,.editor-panel textarea[data-v-89d32998]:focus,select[data-v-89d32998]:focus { outline:none; box-shadow:0 0 0 4px rgba(231,45,72,.18) !important; } .panel-head[data-v-89d32998],.field-title-row[data-v-89d32998] { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; } .micro-grid[data-v-89d32998],.button-grid[data-v-89d32998],.style-actions[data-v-89d32998] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .style-library[data-v-89d32998],.sample-list[data-v-89d32998] { max-height:360px; overflow:auto; padding-right:4px; } .poster-wrap[data-v-89d32998] { max-width:100%; overflow:hidden; } .poster-card[data-v-89d32998] { max-width:100%; border:3px solid var(--ink ) !important; box-shadow:8px 8px 0 var(--ink ) !important; } .toast-line[data-v-89d32998] { color:var(--red ) !important; font-weight:900; } @media (max-width:1199px){ .workspace[data-v-89d32998]{grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);} .preview-panel[data-v-89d32998]{grid-column:1/-1; position:static;} .poster-wrap[data-v-89d32998]{display:flex; justify-content:center;} } @media (max-width:991px){ .workspace[data-v-89d32998],.tool-hero[data-v-89d32998]{grid-template-columns:1fr;} } @media (max-width:575px){ .douyin-page[data-v-89d32998]{padding:14px !important;} .tool-hero[data-v-89d32998],.panel[data-v-89d32998]{border-radius:18px !important; box-shadow:5px 5px 0 var(--red ) !important;} .primary-action[data-v-89d32998],.panel-head button[data-v-89d32998],.style-actions button[data-v-89d32998],.button-grid button[data-v-89d32998]{width:100%;} .panel-head[data-v-89d32998],.field-title-row[data-v-89d32998]{align-items:flex-start; flex-direction:column;} .micro-grid[data-v-89d32998],.button-grid[data-v-89d32998],.style-actions[data-v-89d32998]{grid-template-columns:1fr;} .poster-card[data-v-89d32998]{transform:scale(.9); transform-origin:top center; margin-bottom:-36px;} } .adventure-page[data-v-612a3ab3] { min-height:100vh; color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); } .adventure-shell[data-v-612a3ab3] { width:min(1760px,calc(100% - 32px)); margin:0 auto; padding:clamp(54px,6vw,86px) 0 clamp(36px,5vw,70px); } .adventure-hero[data-v-612a3ab3] { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,380px); gap:1rem; align-items:end; margin-bottom:1rem; } .eyebrow[data-v-612a3ab3],.scene-kicker span[data-v-612a3ab3],.journal h2[data-v-612a3ab3] { display:block; color:#0f9f9a; font-size:0.8rem; font-weight:900; text-transform:uppercase; } .adventure-hero h1[data-v-612a3ab3] { margin:0.45rem 0 0.75rem; font-size:clamp(2.4rem,5vw,5.2rem); line-height:0.98; } .adventure-hero p[data-v-612a3ab3] { max-width:767px; margin:0; color:#475569; line-height:1.75; } .hero-state[data-v-612a3ab3],.story-card[data-v-612a3ab3],.side-card[data-v-612a3ab3],.world-strip article[data-v-612a3ab3],.journal[data-v-612a3ab3] { border:1px solid rgba(15,23,42,0.12); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 18px 54px rgba(15,23,42,0.09); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); } .hero-state[data-v-612a3ab3] { padding:1rem; } .hero-state span[data-v-612a3ab3] { color:#64748b; font-size:0.82rem; font-weight:900; } .hero-state strong[data-v-612a3ab3] { display:block; margin-top:0.45rem; font-size:2rem; } .adventure-board[data-v-612a3ab3] { display:grid; grid-template-columns:minmax(0,1fr) minmax(280px,340px); gap:1rem; align-items:start; } .story-card[data-v-612a3ab3],.side-card[data-v-612a3ab3],.journal[data-v-612a3ab3] { padding:clamp(1rem,2vw,1.4rem); } .scene-kicker[data-v-612a3ab3] { display:flex; justify-content:space-between; gap:1rem; align-items:center; margin-bottom:1rem; } .scene-kicker b[data-v-612a3ab3] { color:#64748b; } .story-card h2[data-v-612a3ab3] { margin:0 0 0.75rem; font-size:clamp(2rem,4vw,4.3rem); line-height:1; } .story-card > p[data-v-612a3ab3] { max-width:780px; margin:0 0 1.2rem; color:#334155; font-size:clamp(1.05rem,1.4vw,1.3rem); line-height:1.85; } .choice-list[data-v-612a3ab3] { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:0.75rem; } .choice-list button[data-v-612a3ab3],.skill-row button[data-v-612a3ab3],.inventory button[data-v-612a3ab3],.save-row button[data-v-612a3ab3],.ending-box button[data-v-612a3ab3] { min-height:3rem; border:1px solid rgba(15,23,42,0.12); border-radius:8px; background:#fff; color:var(--color-text ); font-weight:900; cursor:pointer; } .choice-list button[data-v-612a3ab3] { padding:0.9rem; text-align:left; } .choice-list button.primary[data-v-612a3ab3] { border-color:transparent; background:var(--color-button ); color:#fff; } .choice-list button[data-v-612a3ab3]:disabled,.skill-row button[data-v-612a3ab3]:disabled { cursor:not-allowed; opacity:0.48; } .choice-list strong[data-v-612a3ab3],.choice-list span[data-v-612a3ab3] { display:block; } .choice-list span[data-v-612a3ab3] { margin-top:0.4rem; color:#64748b; font-size:0.9rem; line-height:1.5; } .choice-list .primary span[data-v-612a3ab3] { color:rgba(255,255,255,0.68); } .stat-grid[data-v-612a3ab3],.skill-row[data-v-612a3ab3],.save-row[data-v-612a3ab3] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0.65rem; } .stat-grid div[data-v-612a3ab3] { padding:0.85rem; border-radius:8px; background:var(--color-bg-soft ); } .stat-grid span[data-v-612a3ab3],.stat-grid strong[data-v-612a3ab3] { display:block; } .stat-grid span[data-v-612a3ab3] { color:#64748b; font-size:0.8rem; font-weight:900; } .stat-grid strong[data-v-612a3ab3] { margin-top:0.35rem; font-size:1.25rem; } .skill-row[data-v-612a3ab3],.save-row[data-v-612a3ab3] { margin-top:0.75rem; } .inventory[data-v-612a3ab3] { margin-top:1rem; } .inventory h3[data-v-612a3ab3],.quest-panel h3[data-v-612a3ab3] { margin:0 0 0.65rem; font-size:1.1rem; } .inventory button[data-v-612a3ab3] { display:grid; width:100%; min-height:3.8rem; margin-bottom:0.55rem; padding:0.65rem; text-align:left; } .inventory small[data-v-612a3ab3] { margin-top:0.2rem; color:#64748b; } .inventory p[data-v-612a3ab3] { margin:0; color:#64748b; } .quest-panel[data-v-612a3ab3] { margin-top:1rem; } .quest-panel article[data-v-612a3ab3] { padding:0.7rem; border:1px solid rgba(15,23,42,0.08); border-radius:8px; background:rgba(15,23,42,0.04); margin-bottom:0.55rem; } .quest-panel article.done[data-v-612a3ab3] { border-color:rgba(15,159,154,0.22); background:rgba(15,159,154,0.08); } .quest-panel strong[data-v-612a3ab3],.quest-panel span[data-v-612a3ab3] { display:block; } .quest-panel strong[data-v-612a3ab3] { font-size:0.92rem; } .quest-panel span[data-v-612a3ab3] { margin-top:0.28rem; color:#64748b; font-size:0.84rem; line-height:1.45; } .world-strip[data-v-612a3ab3] { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:0.75rem; margin:1rem 0; } .world-strip article[data-v-612a3ab3] { padding:0.85rem; cursor:pointer; transition:transform 0.2s ease,border-color 0.2s ease; } .world-strip article[data-v-612a3ab3]:hover,.world-strip article.active[data-v-612a3ab3] { transform:translateY(-3px); border-color:rgba(15,159,154,0.45); } .world-strip span[data-v-612a3ab3] { display:grid; place-items:center; width:2.3rem; height:2.3rem; border-radius:50%; color:#fff; background:var(--color-button ); font-weight:900; } .world-strip strong[data-v-612a3ab3] { display:block; margin-top:0.75rem; font-size:1.1rem; } .world-strip p[data-v-612a3ab3] { margin:0.35rem 0 0; color:#64748b; font-size:0.9rem; line-height:1.45; } .ending-box[data-v-612a3ab3] { padding:1rem; border-radius:8px; background:var(--gradient-soft ); } .ending-box.bad[data-v-612a3ab3] { background:rgba(220,38,38,0.1); } .ending-box strong[data-v-612a3ab3] { display:block; margin-top:0.35rem; font-size:1.5rem; } .ending-box p[data-v-612a3ab3] { color:#334155; } .ending-box button[data-v-612a3ab3] { padding:0 1rem; color:#fff; background:var(--color-button ); } .journal h2[data-v-612a3ab3] { margin:0 0 0.8rem; } .journal p[data-v-612a3ab3] { margin:0.45rem 0 0; color:#475569; line-height:1.55; } @media (max-width:960px) { .adventure-hero[data-v-612a3ab3],.adventure-board[data-v-612a3ab3] { grid-template-columns:1fr; } } @media (max-width:767px) { .adventure-shell[data-v-612a3ab3] { width:min(100% - 20px,1760px); padding-top:42px; } .adventure-hero h1[data-v-612a3ab3] { font-size:2.35rem; } .stat-grid[data-v-612a3ab3],.skill-row[data-v-612a3ab3],.save-row[data-v-612a3ab3] { grid-template-columns:1fr; } } .life-page[data-v-eb213e02] { min-height:100vh; color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); } .life-shell[data-v-eb213e02] { width:min(1760px,calc(100% - 32px)); margin:0 auto; padding:clamp(52px,6vw,84px) 0 clamp(36px,5vw,70px); } .life-hero[data-v-eb213e02] { display:flex; justify-content:space-between; gap:18px; align-items:flex-end; margin-bottom:18px; } .eyebrow[data-v-eb213e02],.memory-head span[data-v-eb213e02],.scene-label span[data-v-eb213e02] { display:block; color:#0f9f9a; font-size:12px; font-weight:900; text-transform:uppercase; } .hero-copy h1[data-v-eb213e02] { margin:8px 0 10px; font-size:clamp(42px,5vw,82px); line-height:0.98; letter-spacing:0; } .hero-copy p[data-v-eb213e02] { max-width:680px; margin:0; color:#475569; font-size:clamp(15px,1.15vw,18px); line-height:1.75; } .restart-button[data-v-eb213e02],.memory-head button[data-v-eb213e02],.ending-box button[data-v-eb213e02] { min-height:42px; padding:0 16px; border:0; border-radius:999px; background:var(--color-button ); color:#fff; font-weight:900; cursor:pointer; } .life-layout[data-v-eb213e02] { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,420px); gap:16px; align-items:start; } .story-column[data-v-eb213e02] { display:grid; gap:14px; } .scene-panel[data-v-eb213e02],.memory-panel[data-v-eb213e02],.ending-box[data-v-eb213e02] { border:1px solid rgba(15,23,42,0.12); border-radius:8px; box-shadow:0 22px 60px rgba(15,23,42,0.1); } .scene-panel[data-v-eb213e02] { position:relative; display:flex; min-height:clamp(460px,56vh,680px); padding:clamp(22px,4vw,48px); overflow:hidden; flex-direction:column; justify-content:flex-end; color:#fff; background-color:var(--color-text ); background-position:center; background-size:cover; isolation:isolate; } .scene-panel[data-v-eb213e02]::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,rgba(17,24,39,0.86),rgba(17,24,39,0.24) 58%,rgba(17,24,39,0.74)),radial-gradient(circle at 18% 18%,var(--scene-soft ),transparent 28rem); } .scene-label[data-v-eb213e02] { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:14px; } .scene-label span[data-v-eb213e02] { display:inline-flex; width:-moz-fit-content; width:fit-content; min-height:28px; align-items:center; padding:0 10px; border-radius:999px; color:rgba(255,255,255,0.9); background:rgba(255,255,255,0.14); } .scene-panel h2[data-v-eb213e02] { max-width:991px; margin:0 0 14px; font-size:clamp(34px,5vw,72px); line-height:0.98; letter-spacing:0; } .scene-panel p[data-v-eb213e02] { max-width:900px; margin:0; color:rgba(255,255,255,0.86); font-size:clamp(17px,1.35vw,23px); line-height:1.75; } .choice-list[data-v-eb213e02] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .choice-list button[data-v-eb213e02] { position:relative; display:grid; min-height:118px; grid-template-columns:46px minmax(0,1fr); gap:6px 12px; align-content:center; padding:18px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 16px 42px rgba(15,23,42,0.08); color:var(--color-text ); cursor:pointer; text-align:left; transition:transform 0.22s ease,border-color 0.22s ease,box-shadow 0.22s ease; } .choice-list button[data-v-eb213e02]:hover { transform:translateY(-3px); border-color:var(--scene-tone,#0f9f9a); box-shadow:0 24px 56px rgba(15,23,42,0.14); } .choice-index[data-v-eb213e02] { grid-row:1/3; display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:var(--scene-soft,rgba(25,201,154,0.16)); color:var(--color-text ); font-weight:900; } .choice-list strong[data-v-eb213e02],.choice-list small[data-v-eb213e02] { display:block; } .choice-list strong[data-v-eb213e02] { font-size:clamp(16px,1.3vw,20px); line-height:1.35; } .choice-list small[data-v-eb213e02] { color:#64748b; font-size:13px; line-height:1.55; } .memory-panel[data-v-eb213e02] { position:sticky; top:18px; max-height:calc(100vh - 36px); overflow:hidden; background:rgba(255,255,255,0.86); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .memory-head[data-v-eb213e02] { display:flex; justify-content:space-between; gap:12px; align-items:center; padding:16px; border-bottom:1px solid rgba(15,23,42,0.08); } .memory-head h2[data-v-eb213e02] { margin:5px 0 0; font-size:24px; } .memory-head button[data-v-eb213e02] { min-height:36px; padding:0 12px; border-radius:8px; } .memory-list[data-v-eb213e02] { display:grid; gap:10px; max-height:calc(100vh - 130px); overflow:auto; padding:14px; } .memory-list[data-v-eb213e02]::-webkit-scrollbar { width:6px; } .memory-list[data-v-eb213e02]::-webkit-scrollbar-thumb { border-radius:999px; background:rgba(15,23,42,0.18); } .memory-list article[data-v-eb213e02] { display:grid; gap:7px; padding:13px; border-radius:8px; background:var(--color-bg-soft ); border:1px solid transparent; } .memory-list article.active[data-v-eb213e02] { border-color:rgba(15,159,154,0.32); background:var(--gradient-soft ); } .memory-meta[data-v-eb213e02] { display:flex; justify-content:space-between; gap:8px; align-items:center; } .memory-meta b[data-v-eb213e02],.memory-meta span[data-v-eb213e02] { display:inline-flex; min-height:24px; align-items:center; padding:0 8px; border-radius:999px; font-size:12px; font-weight:900; } .memory-meta b[data-v-eb213e02] { color:#fff; background:var(--color-button ); } .memory-meta span[data-v-eb213e02] { color:#0f766e; background:var(--gradient-soft ); } .memory-list strong[data-v-eb213e02] { color:var(--color-text ); font-size:16px; line-height:1.45; } .memory-list small[data-v-eb213e02] { color:#64748b; font-size:12px; font-weight:800; } .memory-list p[data-v-eb213e02] { margin:0; color:#475569; font-size:13px; line-height:1.55; } .ending-box[data-v-eb213e02] { display:grid; gap:10px; padding:18px; background:rgba(255,255,255,0.84); } .ending-box strong[data-v-eb213e02] { font-size:24px; } .ending-box span[data-v-eb213e02] { color:#475569; line-height:1.7; } .ending-box button[data-v-eb213e02] { width:-moz-fit-content; width:fit-content; border-radius:8px; } @media (max-width:1199px) { .life-layout[data-v-eb213e02] { grid-template-columns:1fr; } .memory-panel[data-v-eb213e02] { position:relative; top:0; max-height:none; } .memory-list[data-v-eb213e02] { max-height:520px; } } @media (max-width:720px) { .life-shell[data-v-eb213e02] { width:min(100% - 20px,1760px); padding-top:42px; } .life-hero[data-v-eb213e02] { display:grid; align-items:stretch; } .restart-button[data-v-eb213e02] { width:100%; } .hero-copy h1[data-v-eb213e02] { font-size:40px; } .scene-panel[data-v-eb213e02] { min-height:430px; padding:18px; } .scene-panel h2[data-v-eb213e02] { font-size:34px; } .choice-list[data-v-eb213e02] { grid-template-columns:1fr; } .choice-list button[data-v-eb213e02] { min-height:108px; padding:15px; } } .farm-page[data-v-d60d298c] { min-height:100vh; color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); } .farm-shell[data-v-d60d298c] { width:min(1760px,calc(100% - 32px)); margin:0 auto; padding:clamp(54px,6vw,86px) 0 clamp(36px,5vw,70px); } .farm-hero[data-v-d60d298c] { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,420px); gap:clamp(18px,3vw,34px); align-items:flex-end; margin-bottom:16px; } .eyebrow[data-v-d60d298c],.panel-head span[data-v-d60d298c],.field-header span[data-v-d60d298c],.log-panel > span[data-v-d60d298c],.hero-panel span[data-v-d60d298c],.upgrade-card span[data-v-d60d298c],.weather-card span[data-v-d60d298c],.crop-guide > span[data-v-d60d298c],.stats-list span[data-v-d60d298c] { display:block; color:#0f9f9a; font-size:12px; font-weight:900; text-transform:uppercase; } .hero-copy h1[data-v-d60d298c] { margin:8px 0 12px; font-size:clamp(42px,5vw,78px); line-height:0.98; letter-spacing:0; } .hero-copy p[data-v-d60d298c] { max-width:820px; margin:0; color:#475569; font-size:clamp(15px,1.2vw,18px); line-height:1.75; } .farm-panel[data-v-d60d298c],.field-panel[data-v-d60d298c],.hero-panel[data-v-d60d298c] { border:1px solid rgba(15,23,42,0.12); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 22px 60px rgba(15,23,42,0.1); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-panel[data-v-d60d298c] { padding:20px; } .hero-panel strong[data-v-d60d298c] { display:block; margin:8px 0 14px; font-size:clamp(28px,2.4vw,38px); } .hero-panel small[data-v-d60d298c] { display:block; margin-top:8px; color:#64748b; font-weight:800; } .xp-track[data-v-d60d298c] { height:9px; border-radius:999px; background:rgba(15,23,42,0.1); overflow:hidden; } .xp-fill[data-v-d60d298c] { height:100%; border-radius:inherit; background:linear-gradient(90deg,#19c99a,#ffcf45); } .farm-layout[data-v-d60d298c] { display:grid; grid-template-columns:minmax(280px,340px) minmax(0,1fr) minmax(280px,340px); gap:16px; align-items:start; } .farm-panel[data-v-d60d298c],.field-panel[data-v-d60d298c] { padding:16px; } .side-panel[data-v-d60d298c] { position:sticky; top:16px; max-height:calc(100vh - 32px); overflow-y:auto; } .field-panel[data-v-d60d298c] { max-height:calc(100vh - 32px); overflow-y:auto; } .side-panel[data-v-d60d298c]::-webkit-scrollbar,.field-panel[data-v-d60d298c]::-webkit-scrollbar { width:8px; } .side-panel[data-v-d60d298c]::-webkit-scrollbar-thumb,.field-panel[data-v-d60d298c]::-webkit-scrollbar-thumb { border-radius:999px; background:rgba(15,23,42,0.18); } .panel-head[data-v-d60d298c],.field-header[data-v-d60d298c] { display:flex; justify-content:space-between; gap:12px; align-items:center; margin-bottom:14px; } .panel-head h2[data-v-d60d298c],.field-header h2[data-v-d60d298c] { margin:5px 0 0; font-size:22px; } .panel-head button[data-v-d60d298c],.action-stack button[data-v-d60d298c] { min-height:40px; padding:0 12px; border:1px solid rgba(15,23,42,0.12); border-radius:8px; color:#ffffff; background:var(--color-button ); font-weight:900; cursor:pointer; } .resource-grid[data-v-d60d298c],.stats-list[data-v-d60d298c] { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; } .resource-grid div[data-v-d60d298c],.weather-card[data-v-d60d298c],.upgrade-card[data-v-d60d298c],.log-panel[data-v-d60d298c],.crop-guide[data-v-d60d298c],.stats-list article[data-v-d60d298c] { border-radius:8px; background:var(--color-bg-soft ); padding:12px; } .resource-grid span[data-v-d60d298c],.resource-grid strong[data-v-d60d298c],.stats-list span[data-v-d60d298c],.stats-list strong[data-v-d60d298c] { display:block; } .resource-grid span[data-v-d60d298c] { color:#64748b; font-size:12px; font-weight:900; } .resource-grid strong[data-v-d60d298c],.stats-list strong[data-v-d60d298c] { margin-top:5px; font-size:24px; } .weather-card[data-v-d60d298c] { margin-top:14px; } .weather-card strong[data-v-d60d298c],.upgrade-card strong[data-v-d60d298c] { display:block; margin-top:6px; font-size:28px; } .weather-card p[data-v-d60d298c],.upgrade-card p[data-v-d60d298c] { margin:8px 0; color:#64748b; line-height:1.55; } .weather-card small[data-v-d60d298c] { color:#475569; line-height:1.55; } .seed-list[data-v-d60d298c],.action-stack[data-v-d60d298c],.crop-guide[data-v-d60d298c],.log-panel[data-v-d60d298c] { display:grid; gap:8px; margin-top:14px; } .seed-list button[data-v-d60d298c] { display:grid; grid-template-columns:62px minmax(0,1fr) auto; gap:10px; align-items:center; min-height:68px; padding:8px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:rgba(255,255,255,0.72); color:var(--color-text ); text-align:left; cursor:pointer; } .seed-list button.active[data-v-d60d298c] { border-color:rgba(15,159,154,0.5); background:var(--gradient-soft ); } .seed-list button.locked[data-v-d60d298c] { opacity:0.48; cursor:not-allowed; } .seed-icon[data-v-d60d298c] { display:grid; place-items:center; width:62px; height:48px; border-radius:8px; color:var(--color-text ); font-size:13px; font-weight:1000; text-align:center; } .seed-list strong[data-v-d60d298c],.seed-list span[data-v-d60d298c],.crop-guide strong[data-v-d60d298c],.crop-guide small[data-v-d60d298c] { display:block; } .seed-list strong[data-v-d60d298c] { font-size:15px; } .seed-list span[data-v-d60d298c],.crop-guide small[data-v-d60d298c] { margin-top:4px; color:#64748b; font-size:12px; line-height:1.35; } .seed-list b[data-v-d60d298c] { color:#0f766e; white-space:nowrap; } .action-stack[data-v-d60d298c] { grid-template-columns:1fr; } .action-stack button[data-v-d60d298c]:disabled { cursor:not-allowed; opacity:0.48; } .field-header p[data-v-d60d298c] { max-width:440px; margin:0; color:#64748b; line-height:1.6; text-align:right; } .plot-grid[data-v-d60d298c] { display:grid; grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:clamp(7px,1vw,12px); align-content:start; } .plot[data-v-d60d298c] { position:relative; aspect-ratio:1; min-height:92px; border:1px solid rgba(84,66,33,0.28); border-radius:8px; background:linear-gradient(90deg,rgba(86,53,23,0.12) 1px,transparent 1px),linear-gradient(180deg,rgba(86,53,23,0.12) 1px,transparent 1px),#b9814b; background-size:16px 16px; box-shadow:inset 0 0 0 5px rgba(71,43,20,0.12); cursor:pointer; overflow:hidden; transition:transform 0.18s ease,box-shadow 0.18s ease,filter 0.18s ease; } .plot[data-v-d60d298c]:hover { transform:translateY(-2px); box-shadow:inset 0 0 0 5px rgba(71,43,20,0.12),0 12px 26px rgba(15,23,42,0.12); } .plot.growing[data-v-d60d298c] { background:radial-gradient(circle at 50% 45%,rgba(25,201,154,0.3),transparent 34%),#9f7741; } .plot.mature[data-v-d60d298c] { background:radial-gradient(circle at 50% 42%,rgba(255,207,69,0.48),transparent 36%),#8f6b38; } .plot.cared[data-v-d60d298c] { box-shadow:inset 0 0 0 5px rgba(25,201,154,0.16),0 0 0 2px rgba(25,201,154,0.18); } .empty-mark[data-v-d60d298c],.crop-name[data-v-d60d298c],.plot i[data-v-d60d298c],.plot b[data-v-d60d298c],.plot em[data-v-d60d298c] { position:absolute; left:50%; transform:translateX(-50%); font-weight:1000; } .empty-mark[data-v-d60d298c] { top:50%; color:rgba(17,24,39,0.62); transform:translate(-50%,-50%); } .crop-name[data-v-d60d298c] { top:17%; display:grid; place-items:center; width:76%; min-height:30px; padding:0 4px; border-radius:999px; color:var(--color-text ); background:rgba(255,255,255,0.76); font-size:clamp(12px,1vw,15px); white-space:nowrap; } .plot i[data-v-d60d298c] { bottom:34%; color:rgba(255,255,255,0.92); font-style:normal; font-size:12px; } .plot b[data-v-d60d298c] { bottom:14%; color:#ffffff; font-size:12px; white-space:nowrap; } .plot em[data-v-d60d298c] { top:5px; right:5px; left:auto; transform:none; padding:3px 6px; border-radius:999px; color:#064e3b; background:rgba(209,250,229,0.88); font-size:10px; font-style:normal; } .stats-list[data-v-d60d298c] { margin:14px 0; } .crop-guide article[data-v-d60d298c] { padding:10px; border-radius:8px; background:rgba(255,255,255,0.64); } .log-panel p[data-v-d60d298c] { margin:0; color:#475569; font-size:13px; line-height:1.45; } @media (max-width:1160px) { .farm-layout[data-v-d60d298c] { grid-template-columns:minmax(280px,340px) minmax(0,1fr); } .farm-layout > .farm-panel[data-v-d60d298c]:last-child { grid-column:1/-1; position:relative; top:0; max-height:none; } } @media (max-width:900px) { .farm-hero[data-v-d60d298c],.farm-layout[data-v-d60d298c] { grid-template-columns:1fr; } .side-panel[data-v-d60d298c],.field-panel[data-v-d60d298c] { position:relative; top:0; max-height:none; } } @media (max-width:767px) { .farm-shell[data-v-d60d298c] { width:min(100% - 20px,1760px); padding-top:42px; } .hero-copy h1[data-v-d60d298c] { font-size:38px; } .field-header[data-v-d60d298c] { align-items:flex-start; flex-direction:column; } .field-header p[data-v-d60d298c] { text-align:left; } .plot-grid[data-v-d60d298c] { grid-template-columns:repeat(auto-fill,minmax(78px,1fr)); gap:6px; } .plot[data-v-d60d298c] { min-height:78px; } .resource-grid[data-v-d60d298c],.stats-list[data-v-d60d298c] { grid-template-columns:1fr 1fr; } } .idle-page[data-v-5e45e914] { min-height:100vh; padding:clamp(26px,4vw,64px); color:var(--color-text ); background:linear-gradient(135deg,rgba(255,255,255,0.36),transparent 34%),var(--color-bg ); } .idle-hero[data-v-5e45e914],.estate-overview[data-v-5e45e914],.idle-layout[data-v-5e45e914] { width:min(1760px,100%); margin:0 auto; } .idle-hero[data-v-5e45e914] { display:grid; grid-template-columns:minmax(0,1fr) minmax(320px,460px); gap:18px; align-items:stretch; } .hero-copy[data-v-5e45e914],.hero-panel[data-v-5e45e914],.estate-overview article[data-v-5e45e914],.side-panel[data-v-5e45e914],.estate-panel[data-v-5e45e914],.offline-modal article[data-v-5e45e914] { border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:rgba(255,255,255,0.86); box-shadow:0 24px 70px rgba(15,23,42,0.09); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); } .hero-copy[data-v-5e45e914] { padding:clamp(28px,5vw,58px); } .eyebrow[data-v-5e45e914],.hero-panel span[data-v-5e45e914],.estate-overview span[data-v-5e45e914],.panel-head span[data-v-5e45e914],.worker-card span[data-v-5e45e914],.bottleneck-card span[data-v-5e45e914],.chain-list > span[data-v-5e45e914],.estate-head span[data-v-5e45e914],.area-top span[data-v-5e45e914],.building-list span[data-v-5e45e914],.section-title span[data-v-5e45e914],.achievement-list > span[data-v-5e45e914],.log-panel > span[data-v-5e45e914],.offline-modal span[data-v-5e45e914] { color:#0f9f9a; font-size:12px; font-weight:900; letter-spacing:0; text-transform:uppercase; } .hero-copy h1[data-v-5e45e914] { margin:10px 0 10px; font-size:clamp(46px,7vw,108px); line-height:1.05; } .hero-copy p[data-v-5e45e914],.estate-head p[data-v-5e45e914],.worker-card p[data-v-5e45e914],.building-list p[data-v-5e45e914],.bottleneck-card p[data-v-5e45e914],.order-board p[data-v-5e45e914] { margin:0; color:#526173; line-height:1.72; } .hero-copy p[data-v-5e45e914] { max-width:860px; font-size:clamp(16px,1.25vw,20px); } .hero-panel[data-v-5e45e914] { display:grid; align-content:center; gap:13px; padding:24px; } .hero-panel > strong[data-v-5e45e914] { font-size:clamp(34px,4vw,58px); line-height:1; } .level-row[data-v-5e45e914],.income-line[data-v-5e45e914] { display:grid; gap:8px; padding:14px; border-radius:8px; background:var(--gradient-soft ); } .level-row div[data-v-5e45e914]:first-child { display:flex; justify-content:space-between; gap:10px; } .level-row small[data-v-5e45e914],.income-line small[data-v-5e45e914] { color:#64748b; } .level-bar[data-v-5e45e914],.bar[data-v-5e45e914] { height:10px; border-radius:999px; background:rgba(15,23,42,0.1); overflow:hidden; } .level-bar i[data-v-5e45e914],.bar i[data-v-5e45e914] { display:block; height:100%; border-radius:inherit; } .level-bar i[data-v-5e45e914] { background:linear-gradient(90deg,#19c99a,#ffcf45); } .estate-overview[data-v-5e45e914] { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:18px; } .estate-overview article[data-v-5e45e914] { display:grid; gap:5px; padding:16px; } .estate-overview strong[data-v-5e45e914] { font-size:clamp(22px,2vw,32px); line-height:1; } .estate-overview small[data-v-5e45e914] { color:#64748b; } .idle-layout[data-v-5e45e914] { display:grid; grid-template-columns:minmax(290px,350px) minmax(0,1fr) minmax(320px,400px); gap:16px; margin-top:18px; align-items:start; } .side-panel[data-v-5e45e914],.estate-panel[data-v-5e45e914] { padding:16px; } .side-panel[data-v-5e45e914] { position:sticky; top:16px; max-height:calc(100vh - 32px); overflow-y:auto; } .panel-head[data-v-5e45e914],.estate-head[data-v-5e45e914],.area-top[data-v-5e45e914],.section-title[data-v-5e45e914] { display:flex; justify-content:space-between; gap:12px; align-items:center; } .panel-head h2[data-v-5e45e914],.estate-head h2[data-v-5e45e914] { margin:5px 0 0; font-size:24px; } .panel-head button[data-v-5e45e914],.action-stack button[data-v-5e45e914],.worker-card button[data-v-5e45e914],.area-actions button[data-v-5e45e914],.building-list button[data-v-5e45e914],.order-board button[data-v-5e45e914],.achievement-list button[data-v-5e45e914],.offline-modal button[data-v-5e45e914] { min-height:40px; padding:0 13px; border:0; border-radius:8px; color:#fff; background:var(--color-button ); font-weight:900; cursor:pointer; } button[data-v-5e45e914]:disabled { cursor:not-allowed; opacity:0.46; } .save-state[data-v-5e45e914] { padding:7px 9px; border-radius:999px; color:#64748b; background:var(--color-bg-soft ); font-size:12px; font-weight:900; } .coin-button[data-v-5e45e914] { display:grid; place-items:center; width:100%; min-height:190px; margin-top:14px; border:0; border-radius:8px; color:#3c2600; background:radial-gradient(circle at 35% 28%,rgba(255,255,255,0.84),transparent 25%),radial-gradient(circle at 65% 68%,rgba(255,238,158,0.52),transparent 30%),linear-gradient(135deg,#ffe071,#ffb629); box-shadow:inset 0 -12px 0 rgba(120,70,0,0.12),0 18px 40px rgba(255,183,41,0.26); cursor:pointer; transition:transform 0.16s ease,box-shadow 0.16s ease; } .coin-button[data-v-5e45e914]:hover { transform:translateY(-2px); } .coin-button[data-v-5e45e914]:active { transform:translateY(2px) scale(0.99); } .coin-button span[data-v-5e45e914],.coin-button small[data-v-5e45e914] { font-weight:900; } .coin-button strong[data-v-5e45e914] { font-size:clamp(42px,5vw,74px); line-height:1; } .buy-mode[data-v-5e45e914] { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; margin-top:12px; } .buy-mode button[data-v-5e45e914] { min-height:36px; border:1px solid rgba(15,23,42,0.1); border-radius:8px; background:rgba(255,255,255,0.7); color:#334155; font-weight:900; cursor:pointer; } .buy-mode button.active[data-v-5e45e914] { border-color:var(--color-text ); background:var(--color-button ); color:#fff; } .worker-card[data-v-5e45e914],.bottleneck-card[data-v-5e45e914],.chain-list[data-v-5e45e914],.building-list article[data-v-5e45e914],.order-board article[data-v-5e45e914],.achievement-list article[data-v-5e45e914],.log-panel[data-v-5e45e914],.area-card[data-v-5e45e914] { border-radius:8px; background:var(--color-bg-soft ); } .worker-card[data-v-5e45e914],.bottleneck-card[data-v-5e45e914] { display:grid; gap:12px; margin-top:14px; padding:14px; } .action-stack[data-v-5e45e914],.building-list[data-v-5e45e914],.order-board[data-v-5e45e914],.achievement-list[data-v-5e45e914],.log-panel[data-v-5e45e914],.chain-list[data-v-5e45e914] { display:grid; gap:8px; margin-top:14px; } .action-stack[data-v-5e45e914] { grid-template-columns:repeat(3,minmax(0,1fr)); } .action-stack .danger[data-v-5e45e914] { background:#ef4444; } .bottleneck-card.good[data-v-5e45e914] { background:var(--gradient-soft ); } .bottleneck-card.warn[data-v-5e45e914] { background:rgba(255,207,69,0.18); } .bottleneck-card.danger[data-v-5e45e914] { background:rgba(239,68,68,0.12); } .bottleneck-card strong[data-v-5e45e914] { font-size:20px; } .chain-list[data-v-5e45e914] { padding:12px; } .chain-list article[data-v-5e45e914] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 10px; align-items:center; padding:10px 0; border-top:1px solid rgba(15,23,42,0.08); } .chain-list article[data-v-5e45e914]:first-of-type { border-top:0; } .chain-list small[data-v-5e45e914] { grid-column:1/-1; color:#64748b; } .estate-head[data-v-5e45e914] { margin-bottom:14px; } .area-grid[data-v-5e45e914] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; } .area-card[data-v-5e45e914] { position:relative; display:grid; gap:12px; min-height:300px; padding:16px; overflow:hidden; } .area-card[data-v-5e45e914]::before { content:""; position:absolute; inset:0; background:linear-gradient(135deg,var(--area-color ),transparent 54%); opacity:0.2; pointer-events:none; } .area-card.locked[data-v-5e45e914] { filter:grayscale(0.22); } .area-top[data-v-5e45e914],.area-card p[data-v-5e45e914],.area-bars[data-v-5e45e914],.area-actions[data-v-5e45e914],.resource-badge[data-v-5e45e914] { position:relative; z-index:1; } .area-title[data-v-5e45e914] { min-width:0; } .area-top h3[data-v-5e45e914] { margin:4px 0 0; font-size:30px; line-height:1; } .area-top strong[data-v-5e45e914] { flex:0 0 auto; padding:8px 10px; border-radius:999px; background:rgba(255,255,255,0.72); } .area-card p[data-v-5e45e914] { color:#526173; line-height:1.6; } .resource-badge[data-v-5e45e914] { display:flex; justify-content:space-between; gap:10px; align-items:center; padding:11px 12px; border-radius:8px; background:rgba(255,255,255,0.68); } .resource-badge b[data-v-5e45e914] { font-size:20px; } .resource-badge small[data-v-5e45e914] { color:#475569; font-weight:800; } .area-bars[data-v-5e45e914] { display:grid; gap:8px; } .area-bars div[data-v-5e45e914]:not(.bar) { display:flex; justify-content:space-between; gap:10px; color:#334155; font-size:13px; font-weight:800; } .bar i[data-v-5e45e914] { background:var(--area-color ); } .area-actions[data-v-5e45e914] { align-self:end; } .area-actions button[data-v-5e45e914] { width:100%; background:var(--area-color ); color:var(--color-text ); } .building-list article[data-v-5e45e914],.order-board article[data-v-5e45e914],.achievement-list article[data-v-5e45e914] { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; align-items:center; padding:12px; } .building-list strong[data-v-5e45e914],.order-board strong[data-v-5e45e914],.achievement-list strong[data-v-5e45e914] { display:block; } .building-list p[data-v-5e45e914],.order-board p[data-v-5e45e914],.achievement-list small[data-v-5e45e914] { display:block; margin-top:4px; color:#64748b; font-size:12px; line-height:1.45; } .section-title[data-v-5e45e914] { margin-bottom:2px; } .section-title button[data-v-5e45e914] { min-height:34px; background:var(--color-primary ); } .order-board small[data-v-5e45e914] { display:block; margin-top:6px; color:#0f766e; font-weight:900; } .order-board article[data-v-5e45e914] { background:rgba(25,201,154,0.09); } .order-board article button[data-v-5e45e914] { background:var(--color-primary ); } .achievement-list article.done[data-v-5e45e914] { background:var(--gradient-soft ); } .achievement-list article.claimed[data-v-5e45e914] { opacity:0.68; } .achievement-list button[data-v-5e45e914] { min-width:76px; background:var(--color-button ); } .log-panel[data-v-5e45e914] { padding:12px; } .log-panel p[data-v-5e45e914] { margin:0; color:#475569; font-size:13px; line-height:1.45; } .offline-modal[data-v-5e45e914] { position:fixed; inset:0; z-index:100; display:grid; place-items:center; padding:20px; background:rgba(15,23,42,0.42); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); } .offline-modal article[data-v-5e45e914] { width:min(520px,100%); padding:24px; } .offline-modal h2[data-v-5e45e914] { margin:8px 0; font-size:36px; } .offline-modal p[data-v-5e45e914] { color:#64748b; line-height:1.7; } .offline-grid[data-v-5e45e914] { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:18px 0; } .offline-grid div[data-v-5e45e914] { padding:14px; border-radius:8px; background:var(--color-bg-soft ); text-align:center; } .offline-grid strong[data-v-5e45e914],.offline-grid small[data-v-5e45e914] { display:block; } .offline-grid strong[data-v-5e45e914] { font-size:24px; } .offline-grid small[data-v-5e45e914] { margin-top:5px; color:#64748b; } @media (max-width:1360px) { .idle-layout[data-v-5e45e914] { grid-template-columns:minmax(290px,350px) minmax(0,1fr); } .idle-layout > .side-panel[data-v-5e45e914]:last-child { grid-column:1/-1; position:relative; top:0; max-height:none; } .progress-panel[data-v-5e45e914] { grid-template-columns:repeat(2,minmax(0,1fr)); } } @media (max-width:991px) { .idle-page[data-v-5e45e914] { padding:18px 14px; } .idle-hero[data-v-5e45e914],.idle-layout[data-v-5e45e914],.area-grid[data-v-5e45e914],.estate-overview[data-v-5e45e914] { grid-template-columns:1fr; } .side-panel[data-v-5e45e914] { position:relative; top:0; max-height:none; } } @media (max-width:575px) { .hero-copy[data-v-5e45e914],.hero-panel[data-v-5e45e914],.side-panel[data-v-5e45e914],.estate-panel[data-v-5e45e914],.estate-overview article[data-v-5e45e914] { padding:14px; } .hero-copy h1[data-v-5e45e914] { font-size:44px; } .offline-grid[data-v-5e45e914],.action-stack[data-v-5e45e914],.buy-mode[data-v-5e45e914],.building-list article[data-v-5e45e914],.order-board article[data-v-5e45e914],.achievement-list article[data-v-5e45e914] { grid-template-columns:1fr; } .building-list button[data-v-5e45e914],.order-board button[data-v-5e45e914],.achievement-list button[data-v-5e45e914] { width:100%; } } .container[data-v-697828c4] { display:flex; flex-direction:column; align-items:center; padding:30px 20px; background:#f7f7f7; min-height:100vh; } .logoBg[data-v-697828c4] { width:90%; max-width:320px; aspect-ratio:1/1; border-radius:20px; display:flex; justify-content:center; align-items:center; box-shadow:0 8px 24px rgba(0,0,0,0.08); transition:background 0.3s ease; } .logoBg2 img[data-v-697828c4] { width:50%; } .controls[data-v-697828c4] { width:100%; max-width:500px; margin-top:30px; background:#ffffff; padding:20px; border-radius:16px; box-shadow:0 6px 20px rgba(0,0,0,0.06); display:flex; flex-direction:column; gap:20px; } .control-group[data-v-697828c4],.color-control[data-v-697828c4] { display:flex; flex-wrap:wrap; align-items:center; gap:16px; } label[data-v-697828c4] { font-size:15px; color:#333; display:flex; align-items:center; gap:8px; } input[type="color"][data-v-697828c4] { border:none; width:40px; height:40px; padding:0; cursor:pointer; } input[type="range"][data-v-697828c4] { width:120px; accent-color:#007bff; } select[data-v-697828c4] { padding:8px 14px; border-radius:8px; border:1px solid #ccc; font-size:14px; cursor:pointer; background:#fff; } .rgba-text[data-v-697828c4] { font-family:monospace; font-size:13px; color:#555; } @media (max-width:575px) { .logoBg[data-v-697828c4] { width:100%; } input[type="range"][data-v-697828c4] { width:100px; } select[data-v-697828c4] { width:100%; } .controls[data-v-697828c4] { padding:15px; } .control-group[data-v-697828c4],.color-control[data-v-697828c4] { flex-direction:column; align-items:flex-start; } label[data-v-697828c4] { width:100%; } } .seal-generator-app[data-v-7946beff]{--page-bg:#F1DDDF;--panel:#FFF9F7;--ink:#1A1A1D;--red:#E72D48;--green:#2FA84F;min-height:100vh;background:var(--page-bg );color:var(--ink );padding:28px 18px 70px;box-sizing:border-box;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;overflow-x:hidden}.seal-shell[data-v-7946beff]{width:min(1440px,100%);margin:0 auto}.panel-primary[data-v-7946beff],.panel-card[data-v-7946beff]{background:var(--panel );border:3px solid var(--ink );box-shadow:8px 8px 0 var(--red );box-sizing:border-box}.seal-hero[data-v-7946beff]{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:24px;align-items:stretch;padding:34px;position:relative;overflow:hidden}.seal-hero[data-v-7946beff]::after{content:"";position:absolute;right:26px;bottom:22px;width:132px;height:132px;background-image:radial-gradient(var(--red ) 3px,transparent 3px);background-size:16px 16px;opacity:.12}.sticker[data-v-7946beff]{display:inline-flex;padding:8px 14px;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:4px 4px 0 var(--ink );font-weight:1000;transform:rotate(-2deg)}h1[data-v-7946beff],h2[data-v-7946beff],h3[data-v-7946beff],p[data-v-7946beff]{margin:0}.seal-hero h1[data-v-7946beff]{margin-top:18px;font-size:clamp(40px,6vw,78px);line-height:1;font-weight:1000;letter-spacing:-3px}.seal-hero p[data-v-7946beff]{margin-top:18px;max-width:720px;font-size:18px;line-height:1.8;font-weight:800}.seal-summary[data-v-7946beff]{position:relative;z-index:1;background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:6px 6px 0 var(--ink );padding:22px;display:flex;flex-direction:column;justify-content:center;gap:12px}.seal-summary span[data-v-7946beff],.seal-summary small[data-v-7946beff]{font-weight:1000}.seal-summary strong[data-v-7946beff]{font-size:28px;line-height:1.2;word-break:break-word}.editor-layout[data-v-7946beff]{display:grid;grid-template-columns:460px minmax(0,1fr);gap:24px;margin-top:28px;align-items:start}.preview-panel[data-v-7946beff]{padding:26px;position:sticky;top:24px}.panel-head[data-v-7946beff]{display:flex;justify-content:space-between;gap:16px;margin-bottom:18px}.panel-head span[data-v-7946beff],.card-header span[data-v-7946beff]{display:block;color:var(--red );font-size:13px;font-weight:1000;letter-spacing:.08em}.panel-head h2[data-v-7946beff]{margin-top:6px;font-size:34px;line-height:1.05;font-weight:1000}.canvas-container[data-v-7946beff]{display:grid;place-items:center;background:#fff;border:3px solid var(--ink );box-shadow:6px 6px 0 rgba(26,26,29,.18);padding:20px;box-sizing:border-box}canvas[data-v-7946beff]{width:min(100%,400px);height:auto;cursor:grab;touch-action:none}.is-dragging[data-v-7946beff]{cursor:grabbing}.drag-tip[data-v-7946beff]{margin:18px 0 0;font-weight:800;line-height:1.6}.action-buttons[data-v-7946beff]{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.btn[data-v-7946beff]{min-height:54px;border:3px solid var(--ink );box-shadow:5px 5px 0 var(--ink );font-size:15px;font-weight:1000;cursor:pointer}.btn-primary[data-v-7946beff]{background:var(--red );color:var(--panel )}.btn-secondary[data-v-7946beff]{background:var(--panel );color:var(--ink )}.btn[data-v-7946beff]:active{transform:translate(3px,3px);box-shadow:2px 2px 0 var(--ink )}.controls-panel[data-v-7946beff]{display:grid;gap:22px}.control-card[data-v-7946beff]{padding:24px}.card-header[data-v-7946beff]{display:flex;align-items:center;gap:12px;margin-bottom:20px}.card-header span[data-v-7946beff]{background:var(--red );color:var(--panel );border:3px solid var(--ink );box-shadow:4px 4px 0 var(--ink );padding:6px 10px}.card-header h3[data-v-7946beff]{font-size:28px;font-weight:1000}.card-body[data-v-7946beff]{display:grid;gap:18px}.form-row[data-v-7946beff]{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-group[data-v-7946beff]{display:grid;gap:8px}.form-group label[data-v-7946beff]{font-size:14px;font-weight:1000}.form-group label span[data-v-7946beff]{color:var(--red )}input[type="text"][data-v-7946beff],select[data-v-7946beff]{width:100%;min-height:50px;border:3px solid var(--ink );background:var(--panel );color:var(--ink );padding:0 14px;font-size:15px;font-weight:800;box-sizing:border-box;outline:none}input[type="range"][data-v-7946beff]{width:100%;accent-color:var(--red )}input[data-v-7946beff]:focus,select[data-v-7946beff]:focus{box-shadow:4px 4px 0 var(--red )}@media(max-width:1100px){.seal-hero[data-v-7946beff],.editor-layout[data-v-7946beff]{grid-template-columns:1fr}.preview-panel[data-v-7946beff]{position:relative;top:auto}.seal-summary[data-v-7946beff]{min-height:150px}}@media(max-width:640px){.seal-generator-app[data-v-7946beff]{padding:16px 16px 80px}.seal-hero[data-v-7946beff],.preview-panel[data-v-7946beff],.control-card[data-v-7946beff]{padding:20px}.seal-hero h1[data-v-7946beff]{letter-spacing:-2px}.form-row[data-v-7946beff],.action-buttons[data-v-7946beff]{grid-template-columns:1fr}.canvas-container[data-v-7946beff]{padding:10px}.card-header h3[data-v-7946beff]{font-size:24px}} .page { --bg:#f6f4ee; --surface:rgba(255,255,255,0.78); --surface-strong:rgba(255,255,255,0.94); --ink:#22252d; --muted:#747782; --line:rgba(38,42,52,0.1); --brand:#246bfe; --brand-2:#10a37f; --rose:#e64a6a; --amber:#d88a1d; --shadow:0 18px 55px rgba(49,55,73,0.13); --soft-shadow:0 10px 30px rgba(49,55,73,0.1); min-height:100vh; color:var(--ink ); background:radial-gradient(circle at 10% 0%,rgba(36,107,254,0.13),transparent 30%),radial-gradient(circle at 95% 18%,rgba(16,163,127,0.13),transparent 28%),linear-gradient(135deg,#f8f6f0 0%,#eef3f7 48%,#f7f1f4 100%); overflow-x:hidden; scroll-behavior:smooth; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; } .page *,.page *::before,.page *::after { box-sizing:border-box; } button,input { font:inherit; } button { border:0; }::-webkit-scrollbar { width:9px; height:9px; }::-webkit-scrollbar-track { background:rgba(38,42,52,0.04); }::-webkit-scrollbar-thumb { background:rgba(38,42,52,0.18); border:2px solid transparent; border-radius:999px; background-clip:content-box; }::-webkit-scrollbar-thumb:hover { background:rgba(38,42,52,0.34); border:2px solid transparent; background-clip:content-box; } .fixed-ui-layer { position:fixed; top:0; left:0; z-index:1000; width:100%; pointer-events:none; } .navigation-bar { pointer-events:auto; padding:14px clamp(14px,3vw,42px) 0; background:rgba(255,255,255,0.72); border-bottom:1px solid rgba(38,42,52,0.08); box-shadow:0 12px 40px rgba(56,65,91,0.08); backdrop-filter:blur(24px) saturate(170%); -webkit-backdrop-filter:blur(24px) saturate(170%); transition:background 0.28s ease,box-shadow 0.28s ease; } .fixed-ui-layer.search-active-layer .navigation-bar { background:rgba(255,255,255,0.5); box-shadow:none; } .fixed-ui-layer.search-active-layer { z-index:1100; } .logo-header { display:flex; align-items:center; justify-content:space-between; gap:20px; min-height:48px; } .header-left { display:flex; align-items:center; min-width:0; } .logo { width:auto; height:46px; max-width:min(180px,38vw); -o-object-fit:contain; object-fit:contain; filter:drop-shadow(0 6px 12px rgba(36,107,254,0.12)); transition:transform 0.24s ease,filter 0.24s ease; } .logo:hover { transform:translateY(-1px); filter:drop-shadow(0 10px 18px rgba(36,107,254,0.18)); } .header-right { display:flex; align-items:center; justify-content:flex-end; gap:8px; flex-wrap:wrap; padding:4px; border:1px solid rgba(255,255,255,0.62); border-radius:18px; background:rgba(255,255,255,0.38); box-shadow:inset 0 1px 0 rgba(255,255,255,0.68),0 10px 26px rgba(48,55,76,0.08); } .header-right-bottom { --btn-accent:var(--brand ); --btn-accent-soft:rgba(36,107,254,0.14); position:relative; display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; flex:0 0 40px; border:1px solid rgba(255,255,255,0.72); border-radius:14px; color:var(--btn-accent ); cursor:pointer; -webkit-user-select:none; -moz-user-select:none; user-select:none; overflow:hidden; background:linear-gradient(145deg,rgba(255,255,255,0.95),rgba(255,255,255,0.62)),linear-gradient(145deg,var(--btn-accent-soft ),transparent); box-shadow:0 9px 18px rgba(39,46,65,0.09),inset 0 1px 0 rgba(255,255,255,0.84); transition:transform 0.22s ease,box-shadow 0.22s ease,border-color 0.22s ease,color 0.22s ease,background 0.22s ease; } .header-right-bottom::before { content:""; position:absolute; inset:5px; border-radius:11px; background:var(--btn-accent-soft ); opacity:0; transform:scale(0.74); transition:opacity 0.22s ease,transform 0.22s ease; } .header-right-bottom::after { content:""; position:absolute; top:-55%; left:-35%; width:70%; height:140%; background:linear-gradient(90deg,transparent,rgba(255,255,255,0.6),transparent); transform:rotate(24deg) translateX(-130%); pointer-events:none; transition:transform 0.45s ease; } .header-right-bottom:hover { transform:translateY(-2px); border-color:rgba(255,255,255,0.95); box-shadow:0 16px 30px rgba(39,46,65,0.14),inset 0 1px 0 rgba(255,255,255,0.94); } .header-right-bottom:hover::before,.header-right-bottom.view-active::before,.header-right-bottom.edit-active::before { opacity:1; transform:scale(1); } .header-right-bottom:hover::after { transform:rotate(24deg) translateX(220%); } .header-right-bottom:active { transform:translateY(0) scale(0.96); } .header-right-bottom:focus-visible,.category-tag:focus-visible,.search-enter-btn:focus-visible,.search-clear-btn:focus-visible,.back-btn:focus-visible,.summary-clear:focus-visible,.modal-close:focus-visible,.btn-cancel:focus-visible,.btn-confirm:focus-visible,.segmented-control button:focus-visible { outline:3px solid rgba(36,107,254,0.24); outline-offset:3px; } .add { --btn-accent:#0f9968; --btn-accent-soft:rgba(16,163,127,0.15); font-size:25px; font-weight:500; line-height:1; } .toggle { --btn-accent:#315fd8; --btn-accent-soft:rgba(49,95,216,0.14); font-size:22px; font-weight:900; } .toggle.view-active { --btn-accent:#5b4fc7; --btn-accent-soft:rgba(91,79,199,0.17); color:#4b3fb6; } .edit { --btn-accent:#bd7420; --btn-accent-soft:rgba(216,138,29,0.16); font-size:16px; font-weight:900; } .edit.edit-active { --btn-accent:#df3f62; --btn-accent-soft:rgba(230,74,106,0.16); color:#d73258; } .edit.edit-active { animation:activeButtonBreath 1.8s ease-in-out infinite; } @keyframes activeButtonBreath { 0%,100% { box-shadow:0 9px 18px rgba(39,46,65,0.09),0 0 0 0 rgba(230,74,106,0.22),inset 0 1px 0 rgba(255,255,255,0.9); } 50% { box-shadow:0 15px 26px rgba(39,46,65,0.13),0 0 0 7px rgba(230,74,106,0.06),inset 0 1px 0 rgba(255,255,255,0.95); } } .symbol-icon { position:relative; z-index:1; } .header-right-bottom span,.header-right-bottom > * { position:relative; z-index:1; } .nsfw-container { display:flex; align-items:center; gap:8px; min-height:38px; margin-left:4px; padding:5px 10px; border:1px solid rgba(38,42,52,0.08); border-radius:999px; background:rgba(255,255,255,0.48); } .nsfw-text { font-size:13px; color:var(--muted ); font-weight:700; white-space:nowrap; -webkit-user-select:none; -moz-user-select:none; user-select:none; } .switch-wrapper { position:relative; width:46px; height:26px; flex:0 0 46px; } .switch-input { position:absolute; opacity:0; pointer-events:none; } .switch-label { position:relative; display:block; width:46px; height:26px; cursor:pointer; border-radius:999px; background:rgba(38,42,52,0.14); box-shadow:inset 0 2px 4px rgba(38,42,52,0.08); transition:background 0.24s ease; } .switch-button { position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#fff; box-shadow:0 4px 10px rgba(38,42,52,0.22); transition:transform 0.24s cubic-bezier(0.2,0.9,0.3,1.2); } .switch-input:checked + .switch-label { background:linear-gradient(135deg,#e64a6a,#f06f46); } .switch-input:checked + .switch-label .switch-button { transform:translateX(20px); } .category-wrapper { position:relative; padding:12px 0 6px; } .category { display:flex; flex-wrap:wrap; gap:9px; max-height:80px; overflow:hidden; transition:max-height 0.35s cubic-bezier(0.16,1,0.3,1); } .category-wrapper.is-expanded .category { max-height:420px; } .category-tag { display:inline-flex; align-items:center; max-width:220px; min-height:31px; padding:6px 13px; border:1px solid rgba(255,255,255,0.56); border-radius:999px; cursor:pointer; font-size:13px; font-weight:800; line-height:1.1; box-shadow:inset 0 1px 0 rgba(255,255,255,0.5); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:transform 0.2s ease,box-shadow 0.2s ease,filter 0.2s ease; } .category-tag:hover,.category-tag.category-active { transform:translateY(-2px); filter:saturate(1.05) brightness(0.98); box-shadow:0 8px 20px rgba(38,42,52,0.11),inset 0 1px 0 rgba(255,255,255,0.58); } .category-tag.category-active { outline:2px solid rgba(36,107,254,0.22); } .category-tag small { display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:19px; margin-left:7px; padding:0 6px; border-radius:999px; background:rgba(255,255,255,0.58); font-size:11px; font-weight:900; } .category-expand-btn { position:fixed; left:50%; transform:translateX(-50%); z-index:2; margin-top:6px; padding:4px 13px; border:1px solid rgba(36,107,254,0.14); border-radius:999px; background:rgba(255,255,255,0.86); color:var(--brand ); cursor:pointer; font-size:12px; font-weight:800; box-shadow:0 8px 18px rgba(49,55,73,0.08); } .category-expand-btn:hover { background:#fff; } .header-line { height:1px; margin-top:6px; background:linear-gradient(90deg,transparent,rgba(38,42,52,0.12),transparent); } .search-overlay { position:fixed; top:clamp(132px,40vh,calc(100vh - 92px)); top:clamp(132px,40svh,calc(100svh - 92px)); left:0; z-index:1040; width:100%; height:clamp(116px,22vh,178px); height:clamp(116px,22svh,178px); border:0; border-radius:0; background:linear-gradient(180deg,transparent 0%,rgba(255,255,255,0.36) 18%,rgba(255,255,255,0.76) 50%,rgba(255,255,255,0.36) 82%,transparent 100%),linear-gradient(90deg,rgba(36,107,254,0.05),rgba(16,163,127,0.1) 46%,rgba(230,74,106,0.06)); box-shadow:0 18px 55px rgba(31,35,45,0.1); backdrop-filter:blur(12px) saturate(132%); -webkit-backdrop-filter:blur(12px) saturate(132%); transform:translateY(-50%); mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 78%,transparent 100%); -webkit-mask-image:linear-gradient(180deg,transparent 0%,#000 22%,#000 78%,transparent 100%); } .fade-blur-enter-active,.fade-blur-leave-active { transition:opacity 0.22s ease; } .fade-blur-enter,.fade-blur-leave-to { opacity:0; } .main-search-container { position:relative; z-index:1100; width:100%; padding:26px 0 18px; pointer-events:none; } .search-wrapper { display:flex; justify-content:center; width:100%; padding:0 clamp(14px,4vw,56px); } .main-search-container.is-active .search-wrapper { position:fixed; top:clamp(132px,40vh,calc(100vh - 92px)); top:clamp(132px,40svh,calc(100svh - 92px)); left:0; z-index:1120; padding-inline:clamp(14px,5vw,70px); transform:translateY(-50%); animation:searchFloatIn 0.28s cubic-bezier(0.16,1,0.3,1) both; pointer-events:none; } @keyframes searchFloatIn { from { opacity:0; transform:translateY(calc(-50% - 18px)) scale(0.96); } to { opacity:1; transform:translateY(-50%) scale(1); } } .search-capsule { pointer-events:auto; display:flex; align-items:center; width:min(540px,100%); height:54px; padding:0 8px 0 18px; border:1px solid rgba(255,255,255,0.7); border-radius:18px; background:rgba(255,255,255,0.78); box-shadow:0 12px 32px rgba(49,55,73,0.11),inset 0 1px 0 rgba(255,255,255,0.66); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); transition:width 0.32s cubic-bezier(0.16,1,0.3,1),border-color 0.22s ease,box-shadow 0.22s ease,background 0.22s ease; } .main-search-container.is-active .search-capsule { width:min(820px,100%); border-color:rgba(36,107,254,0.28); background:rgba(255,255,255,0.96); box-shadow:0 30px 80px rgba(31,35,45,0.22),0 0 0 6px rgba(36,107,254,0.1),inset 0 1px 0 rgba(255,255,255,0.96); } .search-icon { flex:0 0 auto; margin-right:10px; color:var(--muted ); font-size:23px; font-style:normal; line-height:1; } .main-search-input { width:100%; min-width:0; height:100%; border:0; outline:0; background:transparent; color:var(--ink ); font-size:16px; font-weight:650; } .main-search-input::-moz-placeholder { color:rgba(116,119,130,0.74); } .main-search-input::placeholder { color:rgba(116,119,130,0.74); } .search-clear-btn { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; flex:0 0 30px; margin-left:6px; border-radius:10px; background:rgba(38,42,52,0.08); color:var(--muted ); cursor:pointer; font-size:21px; line-height:1; transition:background 0.2s ease,color 0.2s ease; } .search-clear-btn:hover { background:rgba(230,74,106,0.13); color:var(--rose ); } .search-enter-btn { height:38px; flex:0 0 auto; margin-left:8px; padding:0 18px; border-radius:13px; background:linear-gradient(135deg,var(--brand ),#173fc2); color:#fff; cursor:pointer; font-size:14px; font-weight:850; box-shadow:0 10px 20px rgba(36,107,254,0.25); opacity:0; pointer-events:none; transform:translateX(8px) scale(0.94); transition:opacity 0.22s ease,transform 0.22s ease,box-shadow 0.22s ease; } .main-search-container.is-active .search-enter-btn,.search-capsule:focus-within .search-enter-btn { opacity:1; pointer-events:auto; transform:translateX(0) scale(1); } .search-enter-btn:hover { box-shadow:0 14px 28px rgba(36,107,254,0.34); } .bookmark-window { padding:0 clamp(14px,4vw,62px) 54px; } .bookmark-container { width:min(1680px,100%); margin:0 auto; } .bookmark-summary { display:flex; align-items:center; justify-content:space-between; gap:16px; min-height:54px; margin-bottom:20px; padding:0 4px; } .bookmark-summary div { display:flex; align-items:baseline; gap:10px; min-width:0; } .bookmark-summary strong { color:var(--ink ); font-size:20px; font-weight:900; } .bookmark-summary span { color:var(--muted ); font-size:14px; font-weight:700; } .summary-clear { flex:0 0 auto; padding:8px 13px; border-radius:999px; background:rgba(36,107,254,0.1); color:var(--brand ); cursor:pointer; font-size:13px; font-weight:850; } .summary-clear:hover { background:rgba(36,107,254,0.15); } .view-tree { margin-top:4px; } .folder-section { margin-bottom:34px; animation:sectionIn 0.35s ease both; } @keyframes sectionIn { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:translateY(0); } } .folder-header { position:relative; display:flex; align-items:center; width:100%; min-height:42px; margin:0 0 15px; color:var(--ink ); cursor:pointer; font-size:18px; font-weight:900; -webkit-user-select:none; -moz-user-select:none; user-select:none; } .folder-header:hover { color:var(--brand ); } .collapse-arrow { width:21px; height:21px; flex:0 0 21px; margin-right:9px; color:var(--muted ); transition:transform 0.22s ease,color 0.22s ease; } .collapse-arrow.is-collapsed { transform:rotate(-90deg); color:rgba(116,119,130,0.52); } .folder-title-text { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .collapse-line { height:1px; flex:1; min-width:24px; margin-left:16px; background:linear-gradient(90deg,rgba(38,42,52,0.14),transparent); } .collapse-enter-active,.collapse-leave-active { transition:opacity 0.22s ease,transform 0.22s ease; } .collapse-enter,.collapse-leave-to { opacity:0; transform:translateY(-8px); } .bookmark-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(96px,1fr)); gap:18px 14px; align-items:start; } .grid-item { min-width:0; } .tree-grid { grid-template-columns:repeat(auto-fill,minmax(104px,1fr)); gap:20px 16px; grid-auto-flow:row dense; } .tree-cell { display:flex; min-width:0; min-height:112px; } .tree-cell > .bookmark-card { width:100%; height:100%; } .bookmark-card { position:relative; display:flex; align-items:center; flex-direction:column; min-width:0; min-height:106px; padding:10px 7px 8px; border:1px solid transparent; border-radius:14px; color:inherit; text-decoration:none; cursor:pointer; background:transparent; transform:translateZ(0); transition:transform 0.2s ease,background 0.2s ease,border-color 0.2s ease,box-shadow 0.2s ease; } .bookmark-card:hover,.folder-active { transform:translateY(-4px); border-color:rgba(255,255,255,0.78); background:rgba(255,255,255,0.48); box-shadow:0 14px 26px rgba(49,55,73,0.1); } .bookmark-card:active { transform:translateY(-1px) scale(0.97); } .icon { width:62px; height:62px; flex:0 0 62px; margin-bottom:8px; border:1px solid rgba(255,255,255,0.75); border-radius:17px; -o-object-fit:cover; object-fit:cover; background:#fff; box-shadow:0 10px 22px rgba(49,55,73,0.13),inset 0 1px 0 rgba(255,255,255,0.75); transition:transform 0.22s ease,box-shadow 0.22s ease; } .bookmark-card:hover .icon { transform:scale(1.05); box-shadow:0 16px 30px rgba(49,55,73,0.18),0 0 0 4px rgba(36,107,254,0.08); } .safari-folder-icon { position:relative; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(2,minmax(0,1fr)); gap:4px; width:66px; height:66px; flex:0 0 66px; margin-bottom:8px; padding:8px; border:1px solid rgba(255,255,255,0.82); border-radius:18px; background:linear-gradient(145deg,#ffffff,#f0f5f2); box-shadow:0 12px 24px rgba(49,55,73,0.12),inset 0 1px 0 rgba(255,255,255,0.9); transition:transform 0.22s ease,box-shadow 0.22s ease; overflow:visible; } .safari-folder-icon::before { content:""; position:absolute; top:-7px; left:12px; z-index:-1; width:28px; height:10px; border:1px solid rgba(255,255,255,0.82); border-bottom:0; border-radius:8px 8px 0 0; background:linear-gradient(145deg,#ffffff,#f0f5f2); } .safari-folder-icon span,.folder-mini-icon { display:block; width:100%; height:100%; min-width:0; min-height:0; max-width:100%; max-height:100%; aspect-ratio:1/1; border-radius:6px; overflow:hidden; } .safari-folder-icon > * { align-self:stretch; justify-self:stretch; } .safari-folder-icon span { background:rgba(36,107,254,0.08); } .folder-mini-icon { -o-object-fit:cover; object-fit:cover; -o-object-position:center; object-position:center; background:#fff; box-shadow:0 1px 3px rgba(49,55,73,0.08); } .bookmark-card.folder:hover .safari-folder-icon,.folder-active .safari-folder-icon { transform:scale(1.05); box-shadow:0 17px 30px rgba(49,55,73,0.17),0 0 0 4px rgba(16,163,127,0.1); } .name { display:block; width:100%; min-height:32px; padding:0 2px; color:var(--ink ); font-size:13px; font-weight:760; line-height:16px; text-align:center; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow-wrap:break-word; } .bookmark-card:hover .name { color:var(--brand ); } .expanded-folder-area { grid-column:1/-1; width:100%; margin:0 0 16px; padding:20px; border:1px solid rgba(255,255,255,0.65); border-radius:18px; background:rgba(255,255,255,0.42); box-shadow:inset 0 1px 0 rgba(255,255,255,0.5); animation:expandIn 0.24s ease both; } .tree-expanded-panel { position:relative; z-index:1; min-width:0; margin-top:-4px; padding:22px; border-color:rgba(255,255,255,0.72); background:linear-gradient(135deg,rgba(255,255,255,0.66),rgba(255,255,255,0.38)),linear-gradient(90deg,rgba(36,107,254,0.06),rgba(16,163,127,0.07)); box-shadow:inset 0 1px 0 rgba(255,255,255,0.62),0 14px 34px rgba(49,55,73,0.08); overflow:visible; } .tree-expanded-panel::before { content:""; position:absolute; top:-8px; left:clamp(24px,8vw,96px); width:18px; height:18px; border-top:1px solid rgba(255,255,255,0.72); border-left:1px solid rgba(255,255,255,0.72); background:rgba(255,255,255,0.58); transform:rotate(45deg); } @keyframes expandIn { from { opacity:0; transform:translateY(-8px); } to { opacity:1; transform:translateY(0); } } .inner-grid { grid-template-columns:repeat(auto-fill,minmax(86px,1fr)); gap:13px 10px; } .tree-grid.inner-grid { grid-template-columns:repeat(auto-fill,minmax(90px,1fr)); gap:14px 12px; } .empty-hint { grid-column:1/-1; padding:16px; color:var(--muted ); font-size:14px; font-weight:700; text-align:center; } .tree-nav { display:flex; align-items:center; gap:12px; min-height:44px; margin-bottom:20px; } .back-btn { display:inline-flex; align-items:center; gap:7px; height:38px; padding:0 14px; border:1px solid rgba(36,107,254,0.14); border-radius:13px; background:rgba(255,255,255,0.72); color:var(--brand ); cursor:pointer; font-size:14px; font-weight:850; box-shadow:0 8px 18px rgba(49,55,73,0.08); transition:transform 0.2s ease,background 0.2s ease,box-shadow 0.2s ease; } .back-btn:hover { transform:translateY(-2px); background:#fff; box-shadow:0 14px 24px rgba(49,55,73,0.12); } .back-icon { width:17px; height:17px; } .path-hint { min-width:0; color:var(--muted ); font-size:14px; font-weight:800; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } @keyframes jiggle { 0%,100% { transform:rotate(-0.8deg); } 50% { transform:rotate(0.8deg); } } .is-edit-mode .bookmark-card { animation:jiggle 0.34s ease-in-out infinite; cursor:cell; } .is-edit-mode .bookmark-card.folder { animation:none; } .is-edit-mode .bookmark-card.folder .safari-folder-icon { animation:jiggle 0.34s ease-in-out infinite; } .edit-badge,.edit-badge-inline { display:inline-flex; align-items:center; justify-content:center; color:#fff; background:linear-gradient(135deg,#e64a6a,#f06f46); box-shadow:0 8px 16px rgba(230,74,106,0.28),inset 0 1px 0 rgba(255,255,255,0.35); } .edit-badge { position:absolute; top:2px; right:2px; z-index:4; width:25px; height:25px; border:2px solid #fff; border-radius:10px; font-size:13px; font-weight:900; pointer-events:none; } .edit-badge-inline { width:24px; height:24px; flex:0 0 24px; margin-left:8px; border-radius:9px; font-size:12px; } .state-panel { display:flex; align-items:center; justify-content:center; flex-direction:column; min-height:220px; padding:28px; border:1px solid rgba(255,255,255,0.68); border-radius:20px; background:rgba(255,255,255,0.46); color:var(--muted ); text-align:center; box-shadow:inset 0 1px 0 rgba(255,255,255,0.55); } .state-panel strong { margin-bottom:7px; color:var(--ink ); font-size:18px; font-weight:900; } .state-panel p { margin:0; font-size:14px; font-weight:650; } .state-panel button { margin-top:16px; padding:9px 16px; border-radius:12px; background:var(--brand ); color:#fff; cursor:pointer; font-weight:850; } .state-loader { width:36px; height:36px; margin-bottom:14px; border:4px solid rgba(36,107,254,0.16); border-top-color:var(--brand ); border-radius:50%; animation:spin 0.8s linear infinite; } @keyframes spin { to { transform:rotate(360deg); } } .state-error { border-color:rgba(230,74,106,0.25); background:rgba(255,245,246,0.62); } .modal-mask { position:fixed; inset:0; z-index:2000; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(31,35,45,0.36); backdrop-filter:blur(14px) saturate(140%); -webkit-backdrop-filter:blur(14px) saturate(140%); } .modal-fade-enter-active,.modal-fade-leave-active { transition:opacity 0.22s ease; } .modal-fade-enter-active .modal-window,.modal-fade-leave-active .modal-window { transition:transform 0.22s ease,opacity 0.22s ease; } .modal-fade-enter,.modal-fade-leave-to { opacity:0; } .modal-fade-enter .modal-window,.modal-fade-leave-to .modal-window { opacity:0; transform:translateY(14px) scale(0.97); } .glass-modal { width:min(440px,100%); max-height:calc(100vh - 40px); overflow:hidden; border:1px solid rgba(255,255,255,0.78); border-radius:24px; background:linear-gradient(180deg,rgba(255,255,255,0.96),rgba(248,250,249,0.93)),radial-gradient(circle at 0% 0%,rgba(36,107,254,0.08),transparent 42%); box-shadow:0 30px 80px rgba(31,35,45,0.25),inset 0 1px 0 rgba(255,255,255,0.88); backdrop-filter:blur(30px) saturate(170%); -webkit-backdrop-filter:blur(30px) saturate(170%); } .modal-header { display:flex; align-items:center; justify-content:space-between; gap:14px; min-height:62px; padding:0 22px; border-bottom:1px solid rgba(38,42,52,0.08); background:linear-gradient(135deg,rgba(36,107,254,0.08),rgba(16,163,127,0.07)); color:var(--ink ); font-size:17px; font-weight:900; } .modal-close { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; flex:0 0 32px; border-radius:11px; background:rgba(38,42,52,0.07); color:var(--muted ); cursor:pointer; font-size:22px; line-height:1; transition:transform 0.2s ease,background 0.2s ease,color 0.2s ease; } .modal-close:hover { transform:rotate(90deg); background:rgba(230,74,106,0.12); color:var(--rose ); } .modal-body { display:flex; flex-direction:column; gap:14px; max-height:calc(100vh - 170px); padding:20px; overflow-y:auto; } .form-group { position:relative; display:flex; flex-direction:column; gap:9px; padding:13px; border:1px solid rgba(38,42,52,0.07); border-radius:17px; background:rgba(255,255,255,0.58); box-shadow:inset 0 1px 0 rgba(255,255,255,0.72); transition:border-color 0.2s ease,box-shadow 0.2s ease,background 0.2s ease; } .form-group::before { content:""; position:absolute; top:13px; left:0; width:3px; height:18px; border-radius:0 999px 999px 0; background:linear-gradient(180deg,var(--brand ),var(--brand-2 )); opacity:0.54; } .form-group:focus-within { border-color:rgba(36,107,254,0.2); background:rgba(255,255,255,0.82); box-shadow:0 12px 26px rgba(49,55,73,0.08),inset 0 1px 0 rgba(255,255,255,0.86); } .form-group label { display:inline-flex; align-items:center; width:-moz-fit-content; width:fit-content; min-height:22px; padding:0 8px; border-radius:999px; background:rgba(36,107,254,0.08); color:#354052; font-size:12px; font-weight:900; letter-spacing:0; } .glass-input { width:100%; height:48px; padding:0 14px; border:1px solid rgba(38,42,52,0.08); border-radius:15px; outline:none; background:rgba(246,248,249,0.72); color:var(--ink ); font-size:15px; font-weight:700; box-shadow:inset 0 1px 2px rgba(38,42,52,0.03); transition:border-color 0.2s ease,box-shadow 0.2s ease,background 0.2s ease; } .glass-input:focus { border-color:rgba(36,107,254,0.38); background:#fff; box-shadow:0 0 0 4px rgba(36,107,254,0.09),inset 0 1px 0 rgba(255,255,255,0.9); } .glass-input::-moz-placeholder { color:rgba(116,119,130,0.58); font-weight:650; } .glass-input::placeholder { color:rgba(116,119,130,0.58); font-weight:650; } .nsfw-group { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; row-gap:0; } .segmented-control { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px; padding:5px; border:1px solid rgba(38,42,52,0.06); border-radius:16px; background:rgba(38,42,52,0.055); } .segmented-control button { position:relative; height:40px; border-radius:13px; background:transparent; color:var(--muted ); cursor:pointer; font-weight:900; overflow:hidden; transition:background 0.2s ease,color 0.2s ease,box-shadow 0.2s ease,transform 0.2s ease; } .segmented-control button:hover { color:var(--brand ); } .segmented-control button.active { background:linear-gradient(135deg,#fff,rgba(255,255,255,0.82)); color:var(--brand ); box-shadow:0 10px 20px rgba(49,55,73,0.11),inset 0 1px 0 rgba(255,255,255,0.88); } .segmented-control button.active::after { content:""; position:absolute; left:16px; right:16px; bottom:6px; height:3px; border-radius:999px; background:linear-gradient(90deg,var(--brand ),var(--brand-2 )); } .modal-footer { display:flex; justify-content:flex-end; gap:10px; padding:16px 20px 20px; border-top:1px solid rgba(38,42,52,0.08); background:rgba(255,255,255,0.48); } .btn-cancel,.btn-confirm { min-width:88px; height:42px; padding:0 19px; border-radius:14px; cursor:pointer; font-size:14px; font-weight:900; transition:transform 0.2s ease,box-shadow 0.2s ease,background 0.2s ease; } .btn-cancel { border:1px solid rgba(38,42,52,0.06); background:rgba(255,255,255,0.72); color:var(--muted ); box-shadow:inset 0 1px 0 rgba(255,255,255,0.74); } .btn-cancel:hover { color:var(--ink ); background:#fff; } .btn-confirm { background:linear-gradient(135deg,var(--brand ),#315fd8 52%,var(--brand-2 )); color:#fff; box-shadow:0 14px 24px rgba(36,107,254,0.24),inset 0 1px 0 rgba(255,255,255,0.28); } .btn-confirm:hover:not(:disabled) { transform:translateY(-1px); box-shadow:0 16px 28px rgba(36,107,254,0.3); } .btn-confirm:disabled { cursor:wait; opacity:0.65; } .custom-context-menu { position:fixed; z-index:3000; min-width:136px; padding:6px; border:1px solid rgba(38,42,52,0.1); border-radius:14px; background:rgba(255,255,255,0.94); box-shadow:0 18px 42px rgba(31,35,45,0.18); backdrop-filter:blur(18px) saturate(160%); -webkit-backdrop-filter:blur(18px) saturate(160%); animation:menuIn 0.16s ease both; } @keyframes menuIn { from { opacity:0; transform:scale(0.96); } to { opacity:1; transform:scale(1); } } .menu-item { padding:10px 12px; border-radius:10px; color:var(--ink ); cursor:pointer; font-size:14px; font-weight:800; transition:background 0.18s ease,color 0.18s ease; } .menu-item:hover { background:rgba(36,107,254,0.09); color:var(--brand ); } .menu-item.delete { color:var(--rose ); } .menu-item.delete:hover { background:rgba(230,74,106,0.1); } @media (min-width:1440px) { .bookmark-container { width:min(2100px,100%); } .bookmark-grid { grid-template-columns:repeat(auto-fill,minmax(112px,1fr)); gap:24px 18px; } .bookmark-card { min-height:128px; } .icon,.safari-folder-icon { width:78px; height:78px; flex-basis:78px; border-radius:21px; } } @media (max-width:1024px) { .navigation-bar { padding-inline:18px; } .logo-header { align-items:flex-start; } .header-right { gap:8px; } .bookmark-grid { grid-template-columns:repeat(auto-fill,minmax(88px,1fr)); gap:16px 10px; } .tree-grid { grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:16px 12px; } .tree-cell { min-height:104px; } .bookmark-summary { margin-bottom:14px; } } @media (max-width:720px) { .navigation-bar { padding:10px 12px 0; } .logo-header { gap:10px; } .logo { height:34px; max-width:130px; } .header-right { gap:6px; } .header-right-bottom { width:34px; height:34px; flex-basis:34px; border-radius:12px; } .nsfw-container { width:56px; min-height:34px; padding:4px 5px; margin-left:0; } .nsfw-text { display:none; } .category-wrapper { padding-top:9px; } .category { flex-wrap:nowrap; max-height:none; margin:0 -12px; padding:0 12px 6px; overflow-x:auto; scrollbar-width:none; } .category::-webkit-scrollbar { display:none; } .category-wrapper.is-expanded .category { max-height:none; } .category-tag { flex:0 0 auto; max-width:170px; min-height:30px; padding:6px 11px; font-size:12px; } .category-expand-btn { display:none; } .main-search-container { padding:18px 0 13px; } .search-overlay { top:clamp(96px,34vh,210px); top:clamp(96px,34svh,210px); width:100%; height:clamp(88px,18vh,126px); height:clamp(88px,18svh,126px); } .search-wrapper { padding-inline:12px; } .main-search-container.is-active .search-wrapper { top:clamp(96px,34vh,210px); top:clamp(96px,34svh,210px); padding-inline:12px; } .search-capsule { height:48px; padding-left:14px; border-radius:16px; } .main-search-container.is-active .search-capsule { width:100%; height:54px; border-radius:18px; } .search-enter-btn { height:34px; padding:0 13px; } .bookmark-window { padding-inline:12px; } .bookmark-summary { align-items:flex-start; flex-direction:column; gap:8px; min-height:0; } .bookmark-summary div { flex-direction:column; gap:2px; } .bookmark-summary strong { font-size:18px; } .folder-section { margin-bottom:28px; } .folder-header { min-height:36px; margin-bottom:10px; font-size:16px; } .bookmark-grid { grid-template-columns:repeat(auto-fill,minmax(74px,1fr)); gap:11px 7px; } .tree-grid { grid-template-columns:repeat(auto-fill,minmax(76px,1fr)); gap:12px 8px; } .tree-grid.inner-grid { grid-template-columns:repeat(auto-fill,minmax(72px,1fr)); gap:10px 7px; } .tree-cell { min-height:92px; } .bookmark-card { min-height:92px; padding:8px 4px 6px; border-radius:12px; } .icon,.safari-folder-icon { width:52px; height:52px; flex-basis:52px; margin-bottom:7px; border-radius:15px; } .safari-folder-icon { gap:3px; padding:6px; } .safari-folder-icon::before { top:-6px; left:9px; width:22px; height:8px; } .name { min-height:30px; font-size:12px; line-height:15px; } .expanded-folder-area { padding:12px; border-radius:15px; } .tree-expanded-panel { margin-top:-2px; padding:14px 10px; overflow:hidden; } .tree-expanded-panel::before { left:34px; width:14px; height:14px; } .tree-nav { margin-bottom:12px; } .modal-mask { align-items:flex-end; padding:10px; } .glass-modal { width:100%; border-radius:20px; } .modal-footer { display:grid; grid-template-columns:1fr 1fr; } } @media (max-width:575px) { .logo { max-width:96px; } .header-right-bottom { width:31px; height:31px; flex-basis:31px; } .nsfw-container { width:50px; min-height:31px; } .switch-wrapper,.switch-label { width:40px; height:23px; } .switch-button { width:17px; height:17px; } .switch-input:checked + .switch-label .switch-button { transform:translateX(17px); } .search-enter-btn { padding:0 10px; font-size:13px; } .bookmark-grid { grid-template-columns:repeat(auto-fill,minmax(67px,1fr)); } .tree-grid { grid-template-columns:repeat(auto-fill,minmax(68px,1fr)); } } @media (hover:none) and (pointer:coarse) { .bookmark-card:hover,.category-tag:hover,.header-right-bottom:hover,.back-btn:hover { transform:none; box-shadow:none; } .bookmark-card:active,.category-tag:active,.header-right-bottom:active,.back-btn:active { transform:scale(0.96); } } @media (prefers-reduced-motion:reduce) { *,*::before,*::after { animation-duration:0.01ms !important; animation-iteration-count:1 !important; scroll-behavior:auto !important; transition-duration:0.01ms !important; } } .theme-page[data-v-739b3b19] { padding:clamp(72px,9vw,108px) 0 56px; } .theme-page__hero[data-v-739b3b19] { display:grid; gap:14px; margin-bottom:28px; } .theme-page__eyebrow[data-v-739b3b19] { width:-moz-fit-content; width:fit-content; margin:0; padding:6px 10px; border:1px solid var(--color-border ); border-radius:999px; background:var(--gradient-soft ); color:var(--color-primary ); font-size:12px; font-weight:900; } .theme-page__hero h1[data-v-739b3b19],.theme-page__hero p[data-v-739b3b19] { margin:0; } .theme-page__actions[data-v-739b3b19] { display:flex; flex-wrap:wrap; gap:10px; margin-top:8px; } .theme-page__primary[data-v-739b3b19],.theme-page__ghost[data-v-739b3b19],.theme-card__apply[data-v-739b3b19] { min-height:42px; padding:0 18px; border-radius:8px; font-weight:900; } .theme-page__primary[data-v-739b3b19],.theme-card__apply[data-v-739b3b19] { border:1px solid var(--color-button ); background:var(--color-button ); color:var(--color-button-text ); } .theme-page__ghost[data-v-739b3b19] { border:1px solid var(--color-border ); background:var(--color-surface ); color:var(--color-text ); } .theme-page__grid[data-v-739b3b19] { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:18px; } .theme-card[data-v-739b3b19] { display:grid; gap:16px; min-width:0; padding:18px; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); box-shadow:0 16px 42px var(--color-shadow ); } .theme-card.active[data-v-739b3b19] { border-color:var(--color-primary ); } .theme-card__top[data-v-739b3b19] { display:flex; justify-content:space-between; gap:14px; min-width:0; } .theme-card__top h2[data-v-739b3b19] { margin:0; color:var(--color-text ); font-size:clamp(20px,2vw,28px); line-height:1.16; } .theme-card__top p[data-v-739b3b19] { margin:8px 0 0; color:var(--color-text-soft ); font-size:14px; line-height:1.65; } .theme-card__status[data-v-739b3b19] { align-self:flex-start; padding:5px 8px; border-radius:999px; background:var(--gradient-soft ); color:var(--color-primary ); font-size:12px; font-weight:900; } .theme-card__swatches[data-v-739b3b19] { display:grid; grid-template-columns:1fr 1fr; gap:8px; } .theme-card__swatches span[data-v-739b3b19] { min-height:54px; border-radius:8px; box-shadow:inset 0 0 0 1px rgba(255,255,255,0.28); } .theme-card__preview[data-v-739b3b19] { display:grid; gap:10px; padding:12px; border:1px solid; border-radius:8px; } .theme-card__preview-card[data-v-739b3b19] { display:grid; gap:4px; padding:12px; border:1px solid var(--color-border ); border-radius:8px; background:var(--color-surface ); } .theme-card__preview-card strong[data-v-739b3b19] { font-size:14px; } .theme-card__preview-card span[data-v-739b3b19] { color:var(--color-text-soft ); font-size:12px; } .theme-card__preview-row[data-v-739b3b19] { display:flex; align-items:center; justify-content:space-between; gap:10px; } .theme-card__preview-row span[data-v-739b3b19] { padding:5px 9px; border-radius:999px; background:var(--gradient-soft ); color:var(--color-primary ); font-size:12px; font-weight:900; } .theme-card__preview-row button[data-v-739b3b19] { min-height:34px; padding:0 12px; border:1px solid var(--color-button ); border-radius:8px; background:var(--color-button ); color:var(--color-button-text ); font-weight:900; } .theme-card__apply[data-v-739b3b19] { width:100%; } @media (max-width:767px) { .theme-page[data-v-739b3b19] { padding:72px 0 72px; } .theme-page__actions[data-v-739b3b19] { flex-direction:column; } .theme-page__primary[data-v-739b3b19],.theme-page__ghost[data-v-739b3b19] { width:100%; } }