diff --git a/frontend/src/tools/bestellungen.jsx b/frontend/src/tools/bestellungen.jsx
index bc6c883..16f54e1 100644
--- a/frontend/src/tools/bestellungen.jsx
+++ b/frontend/src/tools/bestellungen.jsx
@@ -444,6 +444,8 @@ function BestellungDetail({ id, toast, onBack }) {
 function ArchivModal({ calcId, onClose }) {
   const [item, setItem] = useState(null);
   const [lightbox, setLightbox] = useState(false);
+  const mobile = window.innerWidth < 768;
+
   useEffect(() => {
     api('/tools/kalkulator3d').then(items => {
       setItem(items.find(i => i.id === calcId) || null);
@@ -457,50 +459,64 @@ function ArchivModal({ calcId, onClose }) {
     </div>
   );
 
+  // Mobile: bottom-sheet, Desktop: centered dialog
+  const overlayStyle = {
+    position:'fixed', inset:0, background:'rgba(0,0,0,0.85)', zIndex:6000,
+    display:'flex',
+    alignItems: mobile ? 'flex-end' : 'center',
+    justifyContent: 'center',
+    padding: mobile ? 0 : 24,
+  };
+  const dialogStyle = mobile ? {
+    background:'#1a1a1e', borderRadius:'16px 16px 0 0', width:'100%', maxWidth:600,
+    maxHeight:'85vh', overflowY:'auto', border:'1px solid rgba(255,255,255,0.1)',
+  } : {
+    background:'#1a1a1e', borderRadius:16, width:'100%', maxWidth:560,
+    maxHeight:'90vh', overflowY:'auto', border:'1px solid rgba(255,255,255,0.15)',
+    boxShadow:'0 24px 80px rgba(0,0,0,0.6)',
+  };
+
   return (
-    <div style={{position:'fixed',inset:0,background:'rgba(0,0,0,0.85)',zIndex:6000,
-      display:'flex',alignItems:'flex-end',justifyContent:'center'}}
-      onClick={e=>e.target===e.currentTarget&&onClose()}>
+    <div style={overlayStyle} onClick={e=>e.target===e.currentTarget&&onClose()}>
       {lightbox && <div style={{position:'fixed',inset:0,background:'rgba(0,0,0,0.95)',zIndex:7000,
         display:'flex',alignItems:'center',justifyContent:'center'}} onClick={()=>setLightbox(false)}>
         <img src={item.image} alt="" style={{maxWidth:'95%',maxHeight:'90vh',borderRadius:10,objectFit:'contain'}}/>
       </div>}
-      <div style={{background:'#1a1a1e',borderRadius:'16px 16px 0 0',width:'100%',maxWidth:600,
-        maxHeight:'85vh',overflowY:'auto',border:'1px solid rgba(255,255,255,0.1)'}}>
-        <div style={{padding:'16px 16px 0'}}>
-          <div style={{width:36,height:4,background:'rgba(255,255,255,0.15)',borderRadius:2,margin:'0 auto 14px'}}/>
-          <div style={{display:'flex',justifyContent:'space-between',alignItems:'flex-start',marginBottom:12}}>
-            <div style={{color:'#fff',fontFamily:"'Space Mono',monospace",fontSize:15,fontWeight:700}}>{item.name}</div>
-            <button onClick={onClose} style={{background:'transparent',border:'none',color:'rgba(255,255,255,0.4)',
-              fontSize:20,cursor:'pointer',padding:'0 4px',lineHeight:1}}>✕</button>
+      <div style={dialogStyle}>
+        <div style={{padding:'16px 20px 0'}}>
+          {mobile && <div style={{width:36,height:4,background:'rgba(255,255,255,0.15)',borderRadius:2,margin:'0 auto 14px'}}/>}
+          <div style={{display:'flex',justifyContent:'space-between',alignItems:'flex-start',marginBottom:14}}>
+            <div style={{color:'#fff',fontFamily:"'Space Mono',monospace",fontSize:mobile?15:17,fontWeight:700}}>{item.name}</div>
+            <button onClick={onClose} style={{background:'rgba(255,255,255,0.06)',border:'1px solid rgba(255,255,255,0.1)',
+              borderRadius:6, color:'rgba(255,255,255,0.6)', fontSize:14, cursor:'pointer', padding:'4px 10px', lineHeight:1, flexShrink:0, marginLeft:12}}>✕</button>
           </div>
         </div>
-        <div style={{padding:'0 16px 24px'}}>
+        <div style={{padding:'0 20px 28px'}}>
           {item.image && (
             <img src={item.image} alt={item.name} onClick={()=>setLightbox(true)}
-              style={{width:'100%',maxHeight:180,objectFit:'cover',borderRadius:8,marginBottom:12,
-                cursor:'pointer',border:'1px solid rgba(255,255,255,0.1)'}}/>
+              style={{width:'100%', maxHeight: mobile?180:260, objectFit:'cover', borderRadius:10, marginBottom:14,
+                cursor:'pointer', border:'1px solid rgba(255,255,255,0.1)'}}/>
           )}
-          <div style={{display:'grid',gridTemplateColumns:'1fr 1fr 1fr',gap:6,marginBottom:12}}>
+          <div style={{display:'grid',gridTemplateColumns:'1fr 1fr 1fr',gap:8,marginBottom:14}}>
             {[['Gewicht',`${item.gramm}g`],['Dauer',`${item.stunden}h`],['Farben',item.farben]].map(([l,v])=>(
-              <div key={l} style={{background:'rgba(255,255,255,0.04)',borderRadius:8,padding:'8px 10px'}}>
-                <div style={{color:'rgba(255,255,255,0.55)',fontFamily:'monospace',fontSize:9,marginBottom:3}}>{l.toUpperCase()}</div>
-                <div style={{color:'#fff',fontFamily:"'Space Mono',monospace",fontSize:13,fontWeight:700}}>{v}</div>
+              <div key={l} style={{background:'rgba(255,255,255,0.04)',borderRadius:8,padding:'10px 12px'}}>
+                <div style={{color:'rgba(255,255,255,0.55)',fontFamily:'monospace',fontSize:9,marginBottom:4}}>{l.toUpperCase()}</div>
+                <div style={{color:'#fff',fontFamily:"'Space Mono',monospace",fontSize:14,fontWeight:700}}>{v}</div>
               </div>
             ))}
           </div>
-          <div style={{display:'grid',gridTemplateColumns:'1fr 1fr 1fr',gap:6,marginBottom:12}}>
+          <div style={{display:'grid',gridTemplateColumns:'1fr 1fr 1fr',gap:8,marginBottom:14}}>
             {[['💖',item.preis_freundschaft,'#ff6b9d'],['🤝',item.preis_normal,'#4ecdc4'],['💼',item.preis_auftrag,'#ffe66d']].map(([e,v,color])=>(
-              <div key={e} style={{background:`${color}10`,border:`1px solid ${color}25`,borderRadius:8,padding:'8px 6px',textAlign:'center'}}>
-                <div style={{fontSize:14,marginBottom:3}}>{e}</div>
-                <div style={{color,fontFamily:"'Space Mono',monospace",fontSize:14,fontWeight:700}}>{v.toFixed(2)}€</div>
+              <div key={e} style={{background:`${color}10`,border:`1px solid ${color}25`,borderRadius:8,padding:'10px 8px',textAlign:'center'}}>
+                <div style={{fontSize:16,marginBottom:4}}>{e}</div>
+                <div style={{color,fontFamily:"'Space Mono',monospace",fontSize:mobile?14:16,fontWeight:700}}>{v.toFixed(2)}€</div>
               </div>
             ))}
           </div>
           {item.bemerkung && (
             <div style={{background:'rgba(255,255,255,0.03)',border:'1px solid rgba(255,255,255,0.07)',
-              borderRadius:8,padding:'10px 12px'}}>
-              <div style={{color:'rgba(255,255,255,0.55)',fontFamily:'monospace',fontSize:12,lineHeight:1.6}}>{item.bemerkung}</div>
+              borderRadius:8,padding:'12px 14px'}}>
+              <div style={{color:'rgba(255,255,255,0.6)',fontFamily:'monospace',fontSize:12,lineHeight:1.7}}>{item.bemerkung}</div>
             </div>
           )}
         </div>