@layer base{:root{--color-bg:#fff;--color-text:#fff;--color-primary:#ffe600;--color-accent:#e64c3c;--color-text-dark:#000;--color-bg-light:#f2f2f2}body{background-color:#e5e7eb;font-family:Noto Sans SC,Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}}@layer components{.slide-container{@apply mx-auto my-8 flex w-full max-w-[450px] min-w-[400px] flex-col rounded p-4 shadow-2xl;background-color:var(--color-bg);color:var(--color-text-dark);font-weight:700;gap:.25rem}.body-container,.footer-container,.header-container{@apply flex w-full flex-col;gap:.25rem}.grid-container{display:grid;gap:.25rem}.row-container{@apply flex flex-col;gap:.25rem}.row-item{@apply flex items-stretch;gap:.25rem}.row-container.pattern-icon-info{gap:.25rem}.row-container.pattern-icon-info .row-item{align-items:stretch;display:grid;gap:0;grid-template-columns:1fr .25rem 2fr}.row-container.pattern-icon-info .icon-box-h{grid-column:1}.row-container.pattern-icon-info .resize-handle-v{grid-column:2}.row-container.pattern-icon-info .info-box{grid-column:3}.row-container.pattern-icon-detail{@apply flex-row flex-wrap;align-content:flex-start;gap:.25rem}.row-container.pattern-icon-detail>.icon-box-detail{flex-grow:0;flex-shrink:1;min-width:0}.row-container.pattern-icon-detail.items-1>.icon-box-detail{flex-basis:100%;max-width:100%}.row-container.pattern-icon-detail.items-2>.icon-box-detail{flex-basis:calc(50% - 0.125rem);max-width:calc(50% - .125rem)}.row-container.pattern-icon-detail.items-3>.icon-box-detail{flex-basis:calc(33.333% - 0.167rem);max-width:calc(33.333% - .167rem)}.row-container.pattern-icon-vertical .row-item{@apply flex-row flex-wrap;gap:.25rem}.row-container.pattern-icon-vertical .row-item>.icon-box-v{flex:1 1 0%;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;min-width:0;overflow-wrap:break-word;white-space:normal;word-break:normal}.grid-container>.body-container,.grid-container>.footer-container,.grid-container>.header-container,.grid-container>.summary-end,.grid-container>.summary-line{grid-column:1/-1}.resize-handle-v{background-color:transparent;cursor:col-resize;transition:background-color .2s ease}.resize-handle-v:hover{background-color:rgba(0,0,0,.1)}.title-main{@apply text-xl font-bold text-left mb-0;color:var(--color-text-dark)}.summary-line{@apply relative text-base font-semibold}.summary-line .number{@apply absolute -left-2 -top-1 z-10 flex h-5 w-5 items-center justify-center rounded-full border-2 border-[var(--color-bg)] text-sm font-bold;background-color:var(--color-primary);color:var(--color-text-dark)}.summary-line .text{@apply block w-full text-center rounded bg-gray-800 py-0.5 pr-3 pl-4 h-full;color:var(--color-text)}.info-box{@apply p-1 text-base rounded;background-color:var(--color-bg-light);color:var(--color-text-dark);font-weight:300}.info-box ul{@apply m-0 h-full list-none p-0}.info-box li{@apply relative pl-4}.info-box li:before{content:"·";@apply absolute left-0 font-bold}.icon-box-h{@apply flex items-center p-1 rounded text-base font-bold;background-color:var(--color-primary);color:var(--color-text-dark);gap:.25rem}.icon-box-h .icon{@apply text-3xl flex-shrink-0 text-center;width:1em}.icon-box-detail{@apply flex items-center p-2 rounded text-base font-bold;background-color:var(--color-primary);color:var(--color-text-dark);gap:.25rem}.icon-box-detail .icon{@apply text-3xl flex-shrink-0 text-center;width:1em}.icon-box-detail .text{@apply block}.icon-box-detail .detail{@apply block font-light}.icon-box-v{@apply flex flex-col items-center justify-start p-1 rounded text-base font-bold;background-color:var(--color-primary);color:var(--color-text-dark);gap:.25rem;text-align:center}.icon-box-v .icon{@apply text-4xl}.vertical-label{@apply flex items-center justify-center rounded bg-gray-600 px-0.5 text-base font-bold text-white;height:100%;text-orientation:mixed;writing-mode:vertical-rl}.grid-container>.vertical-label{align-self:stretch;flex:0 0 1.3em!important}.vertical-label[data-rows]{grid-row:span var(--rows,1)}.vertical-label[data-rows="1"]{grid-row:span 1}.vertical-label[data-rows="2"]{grid-row:span 2}.vertical-label[data-rows="3"]{grid-row:span 3}.vertical-label[data-rows="4"]{grid-row:span 4}.vertical-label[data-rows="5"]{grid-row:span 5}.grid-container{align-items:stretch}.grid-container .vertical-label{align-items:center;display:flex;justify-content:center}.summary-end{@apply block w-full rounded py-1 text-center text-base font-bold;background-color:var(--color-accent);color:var(--color-text)}[contenteditable]:hover{box-shadow:0 0 0 1px var(--color-primary) inset}[contenteditable]:focus{outline:2px solid var(--color-primary);outline-offset:-2px}[contenteditable=true]{transition:box-shadow .2s ease,outline .2s ease}[contenteditable=true]:hover{box-shadow:0 0 0 1px var(--color-primary) inset}[contenteditable=true]:focus{outline:2px solid var(--color-primary);outline-offset:-2px}}